3つのブラウザ

  • 投稿日:
  • by
  • カテゴリ:

3種類のブラウザ

アイコンは左から IE6、IE7、Firefox2。現在ブラウザの市場シェアの多くはこの3つで占められる。これ以外にMac OS XのSafariもあるが私は持っていないので除外、Operaの利用者はかなり少ないだろう。

馬渕さん著書の新刊連動でハイローバンド・ギャッププレイのフォローアップページを新たに立ち上げた。これはCMS(Contents Management System)によりブログ風となった。というよりブログである。

いまどきのページ・レイアウトはCSSで行うのが一般的なのだが、3つのブラウザはボックスモデルの計算方法の微妙な違いから、レイアウトのずれが出てくる。マージンが十分にあれば多くは問題ないのだが、ブロックを埋めていくと差異が出てきて収まらないことが出てくる。

多くは再調整で問題ないようにするが、中にはブラウザ・ハックと呼ばれる手法で、ブラウザ毎の調整を行うこともあるのだが、私は不慣れなので3つのブラウザを睨めっこしながら調整している。今回もWindows Vista上(IE7、Firefox2)でずっと作業していて、ふとIE6ではとチェックして見たらずれていた orz

CSSとは別にページ・レイアウトをテーブル・タグで行うことも多く行われている。数年前までは段組の多くはテーブルで行われていたし、現在でもかなり見掛ける。

しかしテーブルでレイアウトすることはドキュメント構造を無視すること多いので、検索エンジンなどに意図したドキュメント構造を伝えにくい。この欠点からCSSレイアウトから増えているし推奨されている。検索エンジンがどういう風に伝わっているかはテキストブラウザであるLynxを使ってみるとよい。

ところでテーブルレイアウトで、かつ使用しているタグの管理がいい加減だとどうなるだろうか?

IEはそれなりに表示する。それが他のブラウザとの互換性に影響することもある。

Firefoxはどうだろう? なぜか存在しないfontタグが追加されてしまった。どうやらfontタグが開いている(有効範囲になっている)ところに<p></p>などの対になるタグがあるとその内部に記述していないfontタグが入り込んでしまうことがあるようだ。

全ての状況で発生するとは限らないが特定の環境では起きる。その特定の環境とはデイトレードネットのトップページだった(悲

HLBGPのブロックを追加するために数時間格闘した結果、Firefoxでは内部Proxyのような動きがあることに気が付いた。閉じタグの移動で対策できたのだが、そろそろ現代的なCSSレイアウトへ移行すべき時期のようだ。

私の常用ブラウザはIE7なのだが、スイングスキャン、ブレイクスキャンはFirefoxで表示している。ボックスモデルの計算の違いによりFirefoxでの表示のほうが好ましいからだ。またFirefoxのほうがウィンドウ横幅を小さくすることができることも気に入っている。

Windows XP SP2は通常IE6なのだが、もうじきWindows Updateでの猶予期間が明けてIE7のインストール・ベースが増えてくると思う。ほとんどの場合、問題ないのだがこうやって作成側に回ると悩みは尽きない。Windows2000はしばらく現役でかつIE7はインストールできない。

つまり、IE6の一定数はIE7へ移行することが無い。だからこの3つのブラウザチェックは欠かすことができない。(手間がかかるね..)