IE7ショック - 混乱を回避できるか商用サイト
MicrosoftのInternet Explorerは、事実上の世界標準といえるブラウザであるが、そのバージョン7ベータ2の日本語版がアップされている。
新機能が盛りだくさんのIE7
上記のページによると、６つの新機能が紹介されている。
- 新しい外観
- タブ
- 印刷
- RSS フィード
- 検索
- セキュリティ
項目だけ見ると、嬉しいものばかりである。
では、早速ダウンロードして試用してみる。
とはいかない。
Microsoftの製品は、正式版でも不具合が多く、ベータ版であればなおささら躊躇してしかるべきである。
現に、あちこちで被害？報告が出され、かつ最悪なケースとしては、アンインストールが成功しないことなどである。
ところが、そういうリスクがありながらも、このIE7を試さなければならない理由がある。
Internet Explorerは、ブラウザのデファクトスタンダード（de facto standard）であり、商用サイトのオーナーであるならば、正式版登場前に一度は自サイトの表示確認を実施してしかるべきである。
記者説明会でのIE7の７つの機能
IE7ベータ2日本語版の公開に合わせて、マイクロソフトのWindows本部ビジネスWindows製品部の中川哲マネージャーによって記者説明会が開かれている。
その記事では、７つの機能が紹介されている。
- デザイン
- タブブラウジング
- 検索
- 印刷機能
- RSS
- プライバシー・セキュリティー
- 互換性と管理性
順番はともかく、上の６つまではMicrosoftのサイトと同一である。
だが、問題はやはり７番目だ。
（7）互換性と管理性としては、CSS2.0への対応、Ajaxのネイティブ動作のサポート（IE6でActiveXを利用していた）などがある。また、要望の多かったアルファチャンネル透過PNGサポートも実装。新技術への対応をすすめながらも、IE6上で動作するアプリケーションとの互換性は確保しているという。
ActiveXがらみは、編集人もサイトで用いていないので確認のしようがないのだが、CSS関連がやはり苦汁を飲まされるかもしれない。
IE7とWebデザイン～崩れる表示
上記の記事によると、DOCTYPE宣言が問題になるらしい。
実は、業界では「DOCTYPEスイッチ」というものが、広く知られている。
詳しくは、head要素、DOCTYPE、htaccessほか :SEO塾を参照して、用語などを確認していただきたい。
XML宣言は、IE6では問題だったが、IE7では解消
編集人は、Web標準やストリクトを前面に出しているものの、喉につかえている小骨がある。
最近のほとんどすべてのサイトをMovable Typeで構築しているのだが、ご存じのように、これはXHTMLとCSSでレイアウト・デザインされている。
もちろんテーブルは、本来のテーブルにのみ使用している。
さて、XHTMLの場合、ファイル冒頭に「XML宣言」を記述することが正式な作法である。
が、これをやってしまうと、IE6では表示がおかしくなる。互換モードと解釈されるのである。
XML宣言を記述した場合 - IE7では問題解消のページを、IE6とIE7で確認して欲しい。
IE6では、左サイドバーの文字列が、一回り大きく表示されているのである。
もちろん、IE7では解消されていることを確認した。
ただしIE7で、XML宣言の表示が崩れないとはいえ、皆がWindows Vistaに代えたり、IE7をインストールしたりするわけではないだろうから、依然としてXML宣言は微妙であることも間違いない。
IE7とCSS
編集人は、商用サイトを運営してはいるものの、Web作成のビジネスが一次的ではないので、このエントリーでの解説は、主にCSSがらみにとどめたい。
もともと、Internet Explorerはバージョン6でも、CSSで難儀をさせられていたわけだが、IE7でもこの問題がかたちを変えてまとわり付いてくる。
例えば、box内のリストのマージンの不具合は、IE7でも解消されていない。
さて本題であるが、CSS解釈でバグが多いInternet Explorer用などのCSS振り分けという裏技が、Web製作業界では流通している。
- if
- <!--[if IE 6 ]><link href="から" rel="stylesheet" type="text/css"><![endif]-->
↑は、IE6にのみCSSを読み込ませる仕掛け
ほかにも、<!--[if IE 5.5000 ]>～<![endif]-->はIE5.5にのみCSSを読み込ませる - * html セレクタ { ほげほげ }
- 「ほげほげ」の記述は、Win版・Mac版のIE5.0～6.0のみに適用される
- html>body セレクタ { ほげほげ }
- 「ほげほげ」の記述は、Win版のIE5.0～6.0には適用されない
上記の裏技のうち、「if」は、IE7でも「<!--[if IE 7 ]>～<![endif]-->」が有効であることを確認できた。
(1)は「if」なしで左サイドバーのbox内リストの上下マージンがおかしくなっているが、(2)はIEの5.0～7.0に対する「if」ありで、リストが作成者の意図通りに表示されている。
また「* html」は、IE7では有効にならないことも確認した。
ちなみに、上記ページはIE6では、まともに見える。
最後の「html>body」は確認していないが、上記「* html」と同様に無効であるだろう。
IE7用にCSSのブラウザ振り分けという試練
一方で、ブログによるXHTMLとCSSの普及が広がり、他方で、Vistaに付属したり、XPにインストールしたりと、Internet Explorer 7のシェアも高まるだろう。
ただし、この世界標準のブラウザも、6と7でまた違うCSSの解釈をするわけだから、Web作成の側も一層、難題が持ち上がってくるのである。
なお、XHTMLとCSSに関しては、検索エンジン、eコマース、Web作成に関する本 :SEO塾の下の方、「SEOの前のホームページ作成でお役立ちの本」の項の２冊の書籍がとても有益であることを付け加えておく。
2006-05-24 09:34 AM | コメント (0) | トラックバック (0) | [ 管理人編集 ]
