“クロスブラウザとは”とGoogle先生に問うてみると、「各ブラウザにおけるWebサイトの表示させる、または操作性を持たせる」というのが共通認識でした。
人によってこのクロスブラウザの焦点は違うと思いますが、いちデザイナー(コーダー)としてクロスブラウザ、Webサイトを同じように見せる必要があるのかについて考えてみました。
この数年でクロスブラウザという概念が広がり、またそれに併せてありとあらゆるCSSハックに関する記事が国内外であがってきました。
これはデザイナーの気質かもしれませんが、自分が描いているデザインが環境によって1pxでずれていると、なんだか不満に感じるのです。これは1年前ほどの僕なのですが、きっと同じ思いのデザイナーさんもいらっしゃるでしょう。
しかしクロスブラウザの本質は、”表示(見た目)”というよりも”操作性”のところにあるのではないかと思うようになりました。
操作性を損なう例
CSSでいえば
例えば旧バージョンのIEにおけるボックスモデルの解釈を考慮せず、サイドバーまたはメインコンテンツの配置が崩れてしまえば、”見た目”が苦しいこともありますが、ナビゲーションの役割を果たすサイドバーが思わぬところに配置されて”使いにくくなる”ということがあるでしょう。
これがページによってサイドバーの配置が崩れていないなど、サイト内で統一されていなければなおさらです。
もっとひどい場合にはナビゲーションリンクがクリックできないなんて場合もあるかもしれません。
これはCSSの使い方における例になりますが、javascriptであってもそうです。見た目の問題ではなく、javascriptを利用したナビゲーションが一部のブラウザで使えず、コンテンツページを閲覧できないのは大きな問題です。
javascriptでいえば
これもまた例にあげると、昨今流行?しているLightboxのように小窓やスライドショーを生成するライブラリがありますが、中にはモダンブラウザにしか対応していないものがあります。
こういうのも頑張ってハックして、どのブラウザでもLightboxの効果を見せるために時間的なコストをかけるよりも、レガシーなブラウザには単純に小窓を開くよう処理するか、またはtarget=”_blank”であっても良いと思います。
もちろんLightboxのように見せることがコンテンツとして重要な意味を持つのであれば、それだけのコストをかけるのは正しいとも思います。
ユーザーのためのクロスブラウザ思考
レガシーなブラウザを使うユーザーのために
IE TesterとCSSハック、そしてIE6ゼロ運動に提言というエントリでは、やむを得ずIE6を利用しているユーザーへの配慮についてコメントしていますが、こういった環境にあるユーザーに対しても、コンテンツを届けることを前提した上で、操作性を落とさない程度に見た目を整えることが重要だと思います。
これだけは絶対だと思うのは、「数pxのずれは妥協の範囲内だと考えた方が楽」ということです。
モダンなブラウザを使うユーザーのために
WebをWebらしく使ってもらうための工夫もそうですし、利用者が使っているブラウザのポテンシャルを最大限に活かして良い体験を提供するのも、ひとつのサービスなのかなと感じています。
Webサイトはまったく同じ見た目である必要はない : could
レガシーなブラウザを利用しているユーザーに対して、リッチな体験を提供するのも素晴らしいことだとは思いますが、新しい環境を持つユーザーに対しては使える技術を最大限に駆使して提供することも大事だと思いました。
見た目にこだわるというのも、デザイナーとして持っていなければいけないこだわりだと思ってますが、操作性ありきの見た目、デザインとコストのバランスを考えなければいけませんね。