2006年9月27日
インターネット・エクスプローラー(IE:Internet Explorer) の 画面が真っ白 問題
ウェブページの開発において、 ブラウザーの画面が真っ白になってしまう問題の解決について。お知り合いの方が開発中のウェブページに問題があったので調査してみた。 現象としては、 マッキントッシュ(Macintosh)上の Firefox等のブラウザーからは問題ないのだが、 マイクロソフト(Microsoft)の ウィンドウズ上で インターネット・エクスプローラー(IE:Internet Explorer) から ウェブページを見てみると、 画面が真っ白になってしまって、 何も表示されない場合があった。
いろいろ調べてみると、この問題は IEの仕様で、コード認識に矛盾点があると、 何も画面に表示されないことがあるようだ。 例えば今回の例でいうと、 charset の定義よりも前に 日本語が含まれた <title>タグ があり IEがそれを SHIFT_JIS と自動認識してしまう場合などである。
この手の問題からの解決策として、
- <meta>タグ で charset の定義をキチンと記述する。
- charset の定義の内容と 実際のhtmlファイルの文字コードをキチンと一致させる。
- <title>タグ は charset の定義の後に記述する。
【参考リンク】
カテゴリー: HTML/CSS 22:57 | コメント (0) | トラックバック (0)
2005年8月15日
CSSでの失敗談(1)
前回の『「PukiWiki/mbstring無しのPHPでの動作」による解決策(2)』 まで、PukiWiki におけるカレンダー機能プラグインのインストールについて 書いてきたが、おまけで、その際の失敗談をもう一つ。このプラグインのインストールには、 cal.css という独自のスタイルシートを追加する必要があるのだが、 その方法の説明は 「PukiWikiのCSS(skin/default.ja.css)に追加(コピー＆ペースト)して下さい 」 とあるので、それに従って skin/default.ja.css ファイルの最後に cal.css の内容を追加したら何の問題もなかった。 このときは、手元の全てのブラウザ(IE6, Firefox, Opera7)でテストを行った。
また、そのインストール方法の説明には、 「@import url("cal.css"); っていう手も無いわけではありませんが... 」 とあるので、今後、他のプラグインをインストールした時の事も考えて、 追加したcal.cssの内容を「@import url("cal.css"); 」という一文に置き換えてみた。 そして再びテストしてみても問題なく動作していた。 但しこの時は手抜きテストで、たまたま開いていたIE6のみでテストを行っていた。
その後しばらくしてから、Firefox と Opera7 とでは、 うまく表示されないという現象に気づいた。 よくよく調べてみると、 「@import」 はCSSファイル内で記述する場所により動作が異なることが判明した。 IE6では、何処にあっても動作したが、 Firefox と Opera7 では、定義を始める前に「@import」行を書いておかないと 正常に読み込んでくれていないようだ。
規格の原典 にあたってみると、
The '@import' rule allows users to import style rules from other style sheets. Any @import rules must precede all rule sets in a style sheet. The '@import' keyword must be followed by the URI of the style sheet to include. A string is also allowed; it will be interpreted as if it had url(...) around it.のように、確かに、「他のスタイル・ルールより前に記述しておく必要がある」となっている。 Firefox と Opera7 は、厳密にこれに準拠しているのに対し、 一方IE6は、よく言えば寛大に、悪く言えばいい加減に、この規格に対応しているようだ。
今回は、上記のような経緯から、たまたまIEのみで確認してしまっていた。 こんなところにバグが潜む原因があるようだ。 私は、まだまだ、修行が足りないようである。
カテゴリー: HTML/CSS , Wiki 22:33 | コメント (0) | トラックバック (0)
