ブラウザ上で IE 各バージョンのレンダリング結果を表示する Firefox のアドオン

Date
2008-07-26 (土)
Category
Web
Tags
, , , ,

ウェブサイトを作る際に、誰もが必ずしているのが各ブラウザでの表示テスト。
その中でもどうしても避けて通れないのが、日本では圧倒的シェアを誇る Internet Explorer さんでのテストです。

私は Firefox をデフォルトで使い、IE でのテストは各バージョンごとに立ち上げるのが面倒極まりないので IETester なるツールを使っていますが、Firefox のアドオンにこんな便利なものがあったんだーというものを知ったので、メモっときます。

ブラウザ上にページを表示し、右クリック、コンテキストメニューの「描画」から 「IE8 Beta」、「IE7」、「IE6」、「IE5.5」 各バージョンを選ぶと、それにあわせた IE でのレンダリング結果を見せてくれるわけですわー。これは便利。
（ツールバーもインストールされるようなんですが、なぜか私のとこには現れない…笑）

IE NetRenderer

んでもって、「IE6 – IE7 （混合）」、「IE6 – IE7 （差分）」を選ぶと、IE6, IE7 それぞれのレンダリング結果をかぶせた形で見られます。

IE NetRenderer （混合）
※クリックすると大きな画像でごらんいただけます。

IE NetRenderer （差分）
※クリックすると大きな画像でごらんいただけます。

ズレてレンダリングされているのがわかりますねぃ。
差分で見ると、テキスト部分は白い文字、リンク部分はピンクの文字で表示されているのが IE6 でのレンダリング結果のようです。レンダリング結果がこれだけズレてるのは、line-height の設定の違いですね。

ボックスのレイアウトはきっちり組みますが、テキストなどは多少のズレがあっても私はそれほど気にしていません（ブラウザによってデフォルトのフォントサイズが違うし、そもそもみんながデフォルトのサイズで見てるかといったら、決してそうではないと思うので）。しかし、時には雑誌や新聞などの組版のように、きっちり考えられた上でのデザインをブラウザごとに反映せねばならぬこともあるかと思いますので（それも Web 上では限界はあると思うけど…）、そんなときにはお役立ちになるかもしれんね、ということで。

しかしまぁ、ここであーだこーだいっても仕方ないと思うんで、あーだこーだいいませんが、IE6 ってさ…どこまでしぶといんだろう。

こんなアドオンを入れなくてもよくなる日が早くくればいいなぁ。ハハ…

page top

Trackback URL：

No Reply »

No comments yet.

Leave a comment

  • お名前、メールアドレスの入力は必須ですが、メールアドレスは表示されません。
  • コメントは管理者の承認後に表示されます。ご了承ください。
(required)
(will not be published), (required)
your comments

recent posts

comments

trackbacks

category

archives

tags