2006年11の月、空からIE7が降ってくる

2006年11の月2日
空から恐怖の大王が来るだろう
アンゴルモアの大王を蘇らせるために
その前後マルスイクロソフトは幸福によって支配する

いや全然幸福になりそうでもないんであって……:sad:
いよいよ本日マイクロソフトがInternet Explorer 7日本語正式版をリリースしました。

IE7のCSS対策については

でも取り上げましたが、今後のサイトの作り方として、あえてここで提案したい。

いつまでも古いブラウザを気にするのやめませんか?

まずは、FirefoxやSafariだとか(一応IE7も)WEB標準への準拠度が高いモダンブラウザを基準にしながらデザインが崩れないようなサイトを作る。次にオールドブラウザでの動作も一応確認してみる。まったく同じように見えなくともユーザが情報を得るのに支障がない程度のデザインの違いならもう諦めてしまう。古いブラウザには、そもそも最初からCSSを読み込ませない。

これでいいじゃありませんか。サイトのアクセス解析を見てみてください。NN4だとかIE5だとかでアクセスしてくるユーザってもうほんの一部でしょう?そういうユーザってたとえばあなたのサイトで積極的に買い物をしてくれるようなアクティブユーザではないですよ。そうよ、きっとそうなのよ!

…というような考え方の切替をしていかないといつまでもストレスがたまると思うんですよ。条件付コメントを使うことも、一部のブラウザのための表示を書くことになるので、あまりよくないみたいだしね。多少デザインが崩れているよりも、クレジットカードを使うにはIEで…とかいうサイトのほうがよっぽどかっこ悪いし、不便だと思うけどなぁ。。。

IE7CSS問題のまとめと対策

はてなブックマークで知ったんですが、Internet Explorer7のCSS問題がまた注目を浴びてるんですね。
はてなブックマーク » 過去の人気エントリー 2006年05月23日
Internet Explorer 7ベータ2の不具合からWebデザイン業界の混乱が見えてきた

このブログでも以前に、Internet Explorer 7で使えなくなるCSSハックでIE7のCSS実装について取り上げましたが、頭の整理のためIE7を取り巻くCSS問題と処方箋についてまとめてみました。

原因

Internet Explorer6:CSS実装にバグあり+未対応多数。Quirks modeとか。
Modern Blowser(FireFoxとかSafariとか):標準的なCSS実装。Standard mode。
→ウェブ製作者:IEだけが解釈するようにCSSハック導入


MS:IE7は標準的なCSSを実装するよ+ハックは効かなくなるよ(´∀)


IEハックを放置すると→IE7で見ると表示大崩壊ヽ(;´Д
)ノ
IEハックを削除すると→IE6以前で表示大崩壊ヽ(´Д`;)ノ

処方箋(対策)

  1. IE7なんて消えて無くなれ派→ハックそのまま
  2. IE6以前切捨て派→ハック削除。さっさとインストールしろ
  3. 八方美人→IE7でもIE6でもモダンブラウザでも問題ないように書き換える。
    • 条件付コメント(Conditional Commentsを使う)*1
    • IE7ハックを使う*2。但しIE8以降に問題を先延ばしするだけ。
    • デザインの制約があっても我慢我慢。

*1 条件付コメント(Conditional Comments)を使う

head内に、
<!--[if lt IE 7]>
<style>
...(CSS)...
</style>
<![endif]-->

とすることでIE7未満のブラウザだけが読み込むCSSを設定できる…らしい。IE7正式版が出たら試してみよう…。
参考:条件付コメント(Conditional Comments)実験ページ

2007-03-15追記:条件付コメントはMicrosoft IEチームも積極的には推奨していない手法であることが分かりました。くわしくはIE7対策:条件付コメントは使ってはいけないを参照してください。

*2 IE7ハックを使う

以下のハックを使うことで、特定のバージョンに対してCSSを適用できる。…が将来困るかも。

参考:Easy CSS hacks for IE7 – Nano See, Nano Do
IE 6以下
* html {}
IE 7以下
*+html, * html {}
IE 7のみ
*+html {}
IE 7とモダンブラウザのみ
html>body {}
IE7以外のモダンブラウザのみ
html>/**/body

Nano See,Nano Doさんのサイトでも書いてあるように、モダンブラウザ向けCSS+条件付コメントでIE6未満向けCSSを記述…がいまのところベストなのかも。
MSがWindows UpdateとかでせめてIE6のCSSを直してくれれば済む話なのに…ぶつぶつ