XHTML/CSS・トップ | CSS基礎知識・目次

●種類の異なるブラウザをインストールする




 CSSをデザインする上で1番難しいのはブラウザとの対応状況です。いかに多くのブラウザのバグを回避するかがポイントとなります。ウィンドウズ版IEのシェアがまだまだ多いのですが、ほかのブラウザを無視して良い訳がありません。特に企業などWebデザインを構築する場合は多くのブラウザで実際に確認することが求められます。そこで1番手っ取り早いのが種類の違うブラウザをインストールすることです。解説やCSSプロパティのブラウザ別の対応表で確認するのももちろん大事ですが、CSSのスタイルシートのレイアウト確認用に個人のWebサイト作成者でもなにかひとつをパソコンにインストールすることをおすすめします。筆者がすすめるのは確認したほうが確実なのとCSSの書き方や上達が格段に早くなるからです。難しいことはありません。ひとつひとつのプロパティを詳細に確認するというよりもリンクをたどって各ページのスタイルを確認するのはそんなに手間は掛かりません。あきらかにおかしいところを修正すれば良いのです。種類の違うブラウザで確認する作業を怠ると重大なミスを見逃してしまう結果となりかねないのです。しかし、不安もあるかと思いますのでここではブラウザについて解説します。

 現在の主要なブラウザはウィンドウズ版IE(v8、v9)、Firefox(v5)、Opera(v11)、Google Chrome(v12)、Safari(v5)です。この中で、Firefox、Operaのブラウザは Windows版、Mac版、Linux 版があります。なお、当サイトはSafariでのCSSプロパティの動作確認は行っておりません。(Mac版IEは2003年度に開発を中止し、2006年1月31日に無償サポートを終了。ただし、Windows版Safariが無償公開されています。)

■種類の異なるブラウザで表示させるには?↓

 インストールしたブラウザでパソコン上のHTML(XHTML)ファイルを表示させるには二つの方法があります。ひとつは、使用するブラウザを立ち上げ、「メニューバー」→「ファイル」→「ファイルを開く、または開く」→「ファイルを開く」ダイアログボックス→“目的のファイルを選択”→「開く」をクリックします。(※ファイルの種類欄にHTMLファイルかすべてのファイルを選択します。)

 もうひとつの方法は、HTML(XHTML)ファイルをマウスポインタでポイント、右クリックし、ショートカットメニューからブラウザを起動させる方法です。

ショートカットメニューからブラウザを選ぶところ。数種類のブラウザのアイコンが見える。

 HTMLファイルをポイントし、右クリックするとショートカットメニューが表示されます。その中の「プログラムから開く」にポイントするとサブメニューが現れ、ブラウザを選択することができます。(ただし、インストールして初めての時は、表示されていないケースが多いですが)

 サブメニューにブラウザのアイコンが表示されない場合は「プログラムの選択」→「ファイルを開くプログラムの選択」ダイアログボックス(※プログラム一覧表に該当するブラウザのアイコンがあれば選択する)→「参照」ボタンをクリック→「プログラムから開く」ダイアログボックスから目的のブラウザを探し出し、選択します。この方法で開くと以後、写真のようにサブショートカットメニューにブラウザのアイコンが表示されるようになります。

※保存先の場所・階層を移動するときの基本的なファイル操作方法は、別項の「ファイルを開く、保存する基本操作」をご参照ください。(ブラウザのアプリケーションを例に詳しく解説してあります。)

※目的のブラウザを探し出すとはダウンロードした場所つまりインストール先のことです。通常の保存先は「マイコンピュータ」→「ローカルディスク(C)」→「Program Files」の中にあります。そこから該当するブラウザのディレクトリ(フォルダ)を見つけ、その中にブラウザの実行ファイル(または、ショートカットアイコン)があります。保存先を変更した場合は、変更先のディレクトリから探してください。また、ここでいう実行ファイルとは拡張子が「exe」ファイルのことです。

 これでパソコン上から任意のブラウザでHTMLファイルに適用されているスタイルシートのレイアウト・デザインを確認することができるようになります。

 なお、HTMLファイルおよび、そのほかのアイコンはインストールしたブラウザを「既定のブラウザ」「標準のブラウザ」として指定するとそのブラウザ特有のアイコンに変更になる場合があります。

 ダウンロード・インストールするときは日本語版であるか、プラットフォーム・OSの種類の確認、ダウンロード・インストール中の画面の解説に注意してください。

 以下に代表的な入手先を付記しておきます。(すべて無料です。)

■Netscape 日本語版 終了

※2008年3月1日にサポート終了。(ダウンロード先は削除しました。)

■Mozilla 日本語版 終了

※2006年4月にリリースされた Mozilla 1.7.13 が最後のバージョンとなりました。

■Firefox(ファイアーフォックス) 日本語版↓

・Mozilla Japan
https://www.mozilla.org/ja/firefox/new/

■Opera(オペラ) 日本語版↓

・ウェブブラウザ Opera ダウンロード
http://jp.opera.com/download/

※HTTPではなく、FTPのプロトコルを選択してダウンロードすることをおすすめします。

■Google Chrome(グーグル・クローム) 日本語版↓

Google Chromeダウンロード

2006年2月1日 公開
2011年7月2日 更新


XHTML/CSS・目次 | CSS基礎知識・目次

Copyright (C) 2006-2008 http://www.xml.vc/