ブラウザのハーモニー
インターネットが今のように普及してくると、ブラウザ(閲覧ソフト)はウィンドウズの中でも重要な地位を占めるのも当然のなりゆきであり、このブラウザの比較検討が今回とりあげたテーマです。数年前まではほとんど｢ネットスケープ｣の独占体制であったのが、マイクロソフト社の｢インターネット･エクスプローラ｣の登場により、シェアは急激な変化を遂げました。以来、これら２大ブラウザが市場を二分する状況へ、去年あたりからは同じ｢ネットスケープ｣でもまったく新しいバージョンが参入し、三つどもえの競争を繰り広げています。
ほんらい自由競争は消費者にとってありがたいはずが、ことコンピュータの世界だとそうも言いきれません。結局、いろいろ騒がれながらもＰＣ業界ではマイクロソフト社が事実上ＯＳ(オペレーティング･システム)市場を独占しているのは、そういった特殊な背景があるわけです。たとえば、いくら優れた機能を持つソフトでも、機能するためにはそれを動かすＯＳや、そのＯＳを動かすプロセッサはじめ様々なハードが不可欠であり、場合によっては新しいソフトが全体とバランスがとれず、結果として機能の低下を招く可能性さえ多々あります。
新車を買ったからと運転を習う必要はありませんが、新しいコンピュータは買ったものの使い方がわからないという経験は、みなさんも覚えがありませんか？ あるいは、新車のラジオが故障したらディーラーや買った店へ持っていけば問題は解決するでしょうが、新しいコンピュータの場合は事情が違います。ソフトの問題を販売店や購入先へ問い合わせるとコンピュータの製造元に聞けと言われ、コンピュータの製造元へ問い合わせると今度はソフトの製造元に聞けと言われ、ソフトの製造元へ問い合わせてもＯＳの製造元に･･････もし、ソフトを使うためのボードが組み込まれたようなケースでは、ここへボードの製造元が加わることは言うまでもありません。
ネットスケープ4.7
ネットスケープ６
インターネット
エクスプローラ初心者からプロまでレベルを問わず、業者の間をたらい回しにされたあげく、数日を経て問題が解決しないぐらいは日常茶飯事なのがコンピュータ業界というわけです。こうして、あれやこれやの事情から一般消費者はなまじ新しいソフトより使い馴染んだ古いソフトを選ぶ傾向がある一方で、最近は多くの業者がベータ版(商品化前の新しいソフト)を一般公開しており、昔と違って試そうと思えば誰でも簡単にダウンロードできます。過半数を占める消極派と少数の積極派は両者が一体となり、ソフトを選別してゆく自然淘汰の中で主流は決定されるのです。
ブラウザ市場を席捲する二大勢力ネットスケープとマイクロソフトが、それぞれ機能面で微妙な違いはありながら、ブラウザの目的がＨＴＭＬ(ハイパー･テキスト･マークアップ･ランゲージ)文書を表示することである以上、どちらを使おうと大差はないかといえば、そうでもありません。そして、同じネットスケープでも現在のバージョン4.7を発展させたバージョン５とその次世代のバージョン６を同時開発中、バージョン６が予想を上回る高性能に仕上がったためバージョン５を飛ばすという曰(いわ)くつきだけあり、バージョン６は相当｢優れもの｣です。つまり、ブラウザを動かす根本的なエンジンから新しく設計された反面、バージョン4.7と機能面での違いがはっきり出ています。
ただし、まだベータ版のバージョン６は未完成の部分も多く、これから改良されてゆくとは思いますが、ともかく現状のままで一部の問題は対処が可能です。ホームページを持っているかたなら、自分の意図したペ−ジデザインはなるべく多くの読者に伝えたいはずであり、もし違うブラウザを使う読者へそれが伝わらないというのでは、おもしろくないでしょう。どのブラウザで見ても、できるだけ同じメージが表示されるよう注意すべき点はいくつかあります。その鍵となるのが｢ネットースケープ4.7｣(以下｢ＮＳ４｣)、｢ネットスケープ６｣(以下｢ＮＳ６｣)、｢インターネット･エクスプローラ｣(以下｢ＩＥ｣)の違いを把握しておくことです。
そこで、いま主流となっているこれら３ブラウザのハーモニーを求める読者へ、大まかではありますが、筆者自身、体験上から注意している点を以下にご紹介しておきましょう。
改行タグ<br>と段落タグ<p> → ｢ＮＳ４で行間のバランスはいいのがＩＥだと開きすぎるのはなぜ？｣ これらのタグは、ふつう前者が１行、後者が２行の改行で使います。ただ、<br>は重ねて使うと２行、３回なら３行と、タグを使った回数だけ改行を繰り返しますが、もともと文節を区切るための<p>タグは使う場所やブラウザ次第で必ずしも効果が一定しません。ブラウザによってはテーブル<table>〜</table>のすぐ後で<p>を使っても効果がなく、たとえばＮＳ４で行間のバランスは良かったのがＩＥだと開きすぎたりするのでご注意ください。そんな場合は<p>の代わり<br><br>を使うと、どちらのブラウザで表示しても行間が揃います。
段落タグ<p>の拡張機能 → ｢ＮＳ６を使った時だけ段落最後の行が右よりになるのはなぜ？｣ 改行タグ<br>や段落タグ<p>は他の多くのタグと違って、もともと開始タグと終了タグを持ちません。ところが、<p>だけはＨＴＭＬのレベル３から開始タグと終了タグを使って段落テキストの位置を指定できるようになりました。以来、段落を右へ寄せたければ<p align=right>〜</p>で挟み、ＮＳ４やＩＥだと終了タグがなくても段落さえ変われば問題はなかったのが、ＮＳ６では注意しないと後の段落まで影響を及ぼします。ＮＳ６の場合のみ、なぜか段落最後の行が右よりなってしまう時など、その前に<p>タグを閉め忘れていないかお確かめ下さい。
ＮＳ４のみでサポートする機能 → ｢文章が点滅しなかったり違うレイアウトになるのはなぜ？｣ 点滅タグ<blink>、段組タグ<multicol>、スペース･タグ<spacer>などはＮＳ４でしか効果がなく、その大前提を踏まえて使わなくてはなりません。<blink>〜</blink>で挟んだ文字を他のブラウザで表示しても何ら変化せず、文字を点滅させない限りページの効果が半減するような場合は別の方法を考えたほうが無難です。点滅しないよりはしたほうが効果的ぐらいの認識でご使用ください。同じく<multicol>タグを使って段組した文章は読みやすくなりますが、ＮＳ４以外のブラウザだと(同社のＮＳ６でさえ)無視されるため、やはり段組しないよりはしたほうが読みやすそう程度の使い方をお薦めします。スペースを制御できる<spacer>タグも、デザインにこだわるウェブマスターへは強力な武器でありながら、このタグを使っていくらバランスが良くなろうと、他のブラウザで見る限りせっかくの努力はむしろ逆効果となりかねません(代案として筆者が編み出したのは<img>タグと透明画像を組み合わせる方法です)。こうした一部のブラウザに機能が限定されるタグは、今後ますます主流から外れてゆくとみていいでしょう。
ＩＳのみでサポートする機能 → ｢マーキーやフローティング･フレームが表示されないのはなぜ？｣ ＩＥでしか使えない<marquee>タグや<iframe>タグも、それを踏まえた上で使わないと効果が半減します。<marquee>タグを使えばページの中へマーキ用の枠を作成し、その枠内でテキストが指定した方向(上下左右)にスクロールできたり、<iframe>タグを使えばページの中へ高さと幅を指定した四角いフレームセルを作成し、そこに指定したファイルが表示できる機能は、どちらもアイデア次第で用途が広くて魅力的な機能なだけ、それを表示できるブラウザとできないブラウザの差は決定的です。その差が及ぼす影響も先のＮＳ４でしか使えないタグどころではなく、なぜ窓が表示されないのかいくら悩もうと答はでません。点滅しなかったり、レイアウトが変わっても文章は読めます。しかし、<marquee>タグでスクロールさせたい文章や<iframe>タグで作成したフローティング･フレーム(窓)へ表示される文章だと、ＩＥ以外のブラウザにまったく表示されず、それをどう対処するか？･･････何かアイデアが浮かばない限り、これらのタグは避けておくのが賢明です。
スタイル･シート → ｢指定したはずのフォントや文字のサイズが反映されないのはなぜ？｣ 一部のブラウザでしか使えない機能だからといって、必ずしも将来性がないとは限りません。ＨＴＭＬのレベル３から拡張された｢スタイル･シート｣の場合、ＩＥがサポートするだけでＮＳ４は採用していなかったのが、ＮＳ６で使えるようになりました。今後の傾向として、この機能をサポートしないブラウザは無視すればよさそうですが、今のところはＮＳ４を使う読者がまだ半数近くを占めています。スタイル･シートを使わないよりは使ったほうがいい程度の感覚でサポートしないブラウザも考慮しておけば、よりいっそう正確な意図を読者へ伝えられることは間違いありません。
<map>タグと<table>タグ → ｢クリッカブルマップのメニューが途中から機能しないのはなぜ？｣ せっかくＮＳ４とＩＥのハーモニーが生まれたところへ新たな問題を投げかけるのはＮＳ６、斬新な機能を備える裏で、これまで無関係だったタグの配置など、ちょっとしたことが問題の原因となったりします。たとえば、ＮＳ４やＩＥでは機能していたクリッカブルマップのメニューが、どういうわけかＮＳ６だと途中から使えないような場合、まず考えられる原因はタグ同士の位置関係です。もっとも、<map>〜</map>内で設定する項目が｢ハリウッド最前線のサイトマップ｣ぐらい多くない限り、この問題は心配ありません。しかし、ある程度サイズが大きいテーブル内の画像で細かくリンクを設定しようと思えば、ＮＳ６だけはどこへクリッカブルマップを書き込むかが微妙です。ＮＳ４やＩＥだと、クリッカブルマップはテーブル外に置いたほうがデザインへ影響しなくて好都合ながら、あいにくＮＳ６の構造は、それが通用する範囲は限られてしまいます。今まで機能していた(テーブル外の)クリッカブルマップが、どういうわけだかＮＳ６では途中からリンクしないとしたら、とにかくクリッカブルマップを画像と同じテーブル内へ移してみて下さい。
<blockquote>タグと<center>タグ → ｢ＮＳ６だと終わりの１行が中央寄せにならないのはなぜ？｣ やはり、ＮＳ４やＩＥで機能していたことがＮＳ６だと問題になるのは、文章左右の間隔を空けてインデントが設定できる引用文タグ<blockquote>とテキストの位置を中央へ設定できる中央寄せタグ<center>を使う場合、両者の位置関係です。全体に引用文タグを指定したページ最後へ、中央寄りのコピーライト行を加えるとします。両者は機能的な関連性がないゆえ、</blockquote>で引用文タグを閉じる前にコピーライト行を置き、その中央寄せを閉じる</center>は</blockquote>より後でも先でもＮＳ４やＩＥなら問題はありませんでした。うっかりそのつもりでＮＳ６を使うと、なぜコピーライトの１行が左へ寄るのかさんざん悩む羽目となりかねないのでご注意ください。このような事態と直面した時は、問題のテキストが｢入れ子のタグを終了してから親タグに戻る｣原則どおりの位置関係か確かめてみるといいでしょう。もし、｢<blockquote>〜<center>〜</blockquote>〜</center>｣の順だとＮＳ６は</blockquote>の部分で<center>タグ機能をキャンセルするため、必ず｢<blockquote>〜<center>〜</center>〜</blockquote>｣の順序を守らなくてはなりません。
アニメーションgif → ｢ＮＳ６でアニメーションの画像がちゃんと表示されないのはなぜ？｣ 画像の一部しか動かないアニメーションgifは、２コマ目以降をその部分だけで作ることができます。画像全体と比べたサイズの違いはコマ数が多いほどファイル容量へ響くため、動かない部分を省略するとしないでファイルの軽さは極端に違ってくるわけです。省略した各コマのコマンドが背景色の透明化やコマ送りのオプションをどう設定しようと、ＮＳ４やＩＥでは問題がありませんでした。そのアニメーションgifも、ＮＳ６の場合は設定次第で表示がおかしくなります。背景色の透明化を使わずコマ送りも｢Removed by｣が｢Nothing｣だと心配はありません。ところが、透かした背景で動く画像は、コマ送りの際、そのコマが次のコマへ重複しないよう背景あるいは前のコマと置き換える必要があります。ＮＳ６でいったいどうしたんだろうと驚かされるのは、このパターンです。１コマ目の全体像が本来は２コマ目以降も表示されるはずが、部分的な画像とそっくり入れ替わってしまうので話になりません。対策として、筆者は部分的な画像の代わり、すべてのコマをフルサイズで１から作り直しました･･････まったく面倒をかけてくれるものです！
以上の他、テキストをブラウザへ表示させないための<comment>タグはＩＥで機能してもＮＴ４だと隠すつもりの文章が見えたり、<hr>タグの属性で指定した水平線の色はＩＥでしか効果がなかったり、ブラウザによってはリスト･タグやフレーム･タグへsrc属性を使えたり使えなかったり、細かい相違点をあげてゆくときりがありません。加えて、今回はあえて除外した｢Javaスプリプト｣も、getyearメソッドで呼び出した年がＮＴ４とＮＴ６だと西暦1900年を基準(０)にした数値であるのがＩＥの場合は西暦０年であったり、ブラウザ毎の仕様が異なる機能はまだまだあります。そうした違いの中から、とりあえず以上の点を注意するだけでブラウザ間の不協和音が少なからずハモり始めるはずです。
もし、ふだん使っていないブラウザで自分のホームページを見比べ、何か疑問が生じたかたは、改めてこのアーティクル(記事)を読み返すといいかもしれませんね!?
|
お断り