カテゴリ:ブラウザ :: webデザイナーの為のブログ

先日公開されたwin版safariベータですが、今までは日本語表示は未対応でしたが、今回のアップデートで日本語表示が可能になりました。ただし、テキストフィールドへの日本語入力はまだ未対応なようです。

しかし、最速ブラウザと名乗っているだけあって、動作はかなり早い。HTMLの表示はもちろんのことFLASHの動作も現在のブラウザのなかでは最速でしょう。

また、safariはほかのブラウザとはまったく異なるインターフェイスなのでちょっとした優越感に浸れるのもポイント。あと、safariにはデフォルトでテキストにスムージングがかけられているので綺麗。（ただしメイリオフォントをデフォルトフォントに指定していると２重にスムージングがかかり（確証はないですが）汚く見えるので注意）

webページを作成する際、W3Cの規格に沿った標準モードか、過去のブラウザと互換性を持った互換モードを選ぶことになるわけだが、そこでwin IEでちょっとした問題があるわけです。

XHTMLを作成する際、utf-8以外の文字コードを使用する場合は、必ずxml宣言をしなければならない。通常xml宣言を書いた場合（それプラスDTDをフル記述）は標準モードになるわけなのだが、win IE6はバグで互換モードになってしまう。つまり、win IE5と同等の動作をし、バグも持ち越される。

しかし、この互換モードになってしまうというバグは考えようによっては大きなメリットにもなる。ターゲットブラウザをwin IE6以上やfirefox、opera等に絞るのであれば単なるデメリットでしかないが、win IE5.xも視野に入れるとなるとかえって好都合なのだ。基本的にwin IE6互換モードとwin IE5.xは挙動が同じため、win IE6互換モードに対応させれば、特に意識することなくwin IE5.xにも対応させることが可能なため。CSSハックも同じ物を指定してやるだけでよい（CSSハックを使う際はIE7でのチェックを忘れずに）。

逆にxml宣言を取り除くと標準モードになるわけだが、このモードを使用してwin IE5.xに対応させようとすると苦労するかと思う。win IE6標準モードとwin IE5.xでは挙動が異なる為CSSハックが使えない。基本的にwin IE向けCSSハックはIE6、IE5両方に適用されてしまうため、両者のバグが一致する時のみにしかCSSハックが使用できない。IE5.xだけに個別のCSSを適用させたい場合は、条件分岐コメントを利用するという手もあるがそんなことをするくらいなら、xml宣言をしたほうが良いと思う。

というわけで今後仕事でそういう案件にかかわりそうな気がしたので書いてみたわけです（・ω・）

ふと思ったんだが、Operaのシェアが大幅に増える予感。任天堂wiiがOperaブラウザを実装しているため。今後最も売れるゲーム機だと思われるため、Operaのユーザは大幅に増えるんじゃないかなと思った。自分がOperaユーザーなので嬉しい限り。

先日ＩＥ7をインストールしたから、ＩＥ6使えなくなったわけで、スタンドアローン版ＩＥ６を入れたんですよ。しばらくは普通に使えていたんだけど、急に使えなくなった。。。ＩＥ5.ｘも。起動はするけど、ウィンドウがアクティブにならねぇ～。

ＩＥ7が悪さしているのか？？それともＰＣが寿命？まぁ元々スタンドアローン版ＩＥは正規版じゃないからしょうがないのか。。。ってか、ＩＥ７にブラウザエンジン切り替え機能が付けばいいんだけどな。

IE7になって、PNG24の対応や、CSSの解釈が大幅に改善されたので、表現の幅が広がり嬉しい反面、従来のサイトの動作チェックで頭を抱えることになるだろう。

自分の場合、今までは属性セレクタを使いCSSハックを行って、各ブラウザと互換をとっていたわけだが、この場合、IE6以前のバグが修正されていないとIE７では表示に不具合を生じてしまう。属性セレクタハックがIE７では使えない為だ（逆に属性セレクタが正式にサポートされたわけだが…）。

こうなると、IE7用のハックを適用するか、HTMLに余分にタグを追加するか、もしくは今まで以上にCSSレイアウトを考慮してデザインをする必要が出てくる。

そろそろIE5.xは切っちゃっていいかな。。。

ちなみにa要素にvertical-alignをmiddle,top,bottomのいずれかを指定することで、ハックしなくても解決できました。（汗

先日IE７が正式リリースされた。
過去のブラウザのこともあるので、WEBデザイナーや趣味でWEB制作をしている人は、バージョンアップしにくかったが、IE7とIE6を共存させることが可能であることが判明。方法は簡単下記サイトでIE6のスタンドアローン版をダウンロードし、普通にIE7にアップグレードすればOK。
http://coliss.com/articles/build-websites/verification/69.html
http://tools.veloc-it.com/tabid/58/grm2id/4/Default.aspx

また、macでブラウザチェックしたいけど、winしか持ってないって人に朗報。下記サイトでサファリのキャプチャを撮ってくれます。
http://www.danvine.com/icapture/

さっそくIE7でチェックしてみたら、プルダウン式ナビゲーションが微妙おかしなことになっていた。。。やっぱCSSハックが悪さしてるんだろうな。許容範囲だけど。

--追記--
IE5.5やIE5.01で検索してくる人が多かったので付け加えます。下記サイトでIE5.xのスタンドアローン版も入手できます。
http://browsers.evolt.org/?ie/32bit/standalone
IE6スタンドアローン版を薦めましたが、制作者はIE7スタンドアローン版を入れて、IE6はこれまでどおり使ったほうがいいかも。IE6スタンドアローン版の調子があまりよくなかったので…

ちなみにWinとMac両方でブラウザチェックをする人にはインテルMacがオススメ。インテルMacでは仮想的にWindowsを動かすことが可能です。いままではブラウザのシェア上windowsで作業をするwebデザイナーが多かったと思いますが、あえてwindowsを使う必要もなくなりますね。というか普通にMac上でwindowsが動きますからね～。