CSS文法を検証するサービスと主要ブラウザでの表示確認

ここまでCSSについて簡単に説明してきましたが、CSSはHTMLと同じく勉強するだけではなく、実際に自分でここをこう記述するとこう表示されるということを身をもって体験しなければ、マスターすることは難しいでしょう。

そこで、これから自分でCSSを書いていく上で、凄く為になるツールを紹介しておきます。

CSS（スタイルシート）検証サービスでCSSを最終チェックする

• W3C CSS 検証サービス

使い方は、URLに調べたいページのURLを記述するか、直接入力にして直接CSSをコピペするか、アップロードでCSSを読み込むなどしてから「検証する」のボタンを押すだけで、簡単に該当CSSの間違っている部分を指摘してくれます。

検証したら間違っている部分を修正をしていきます。直し方がわからない場合は、そのことについてネット検索をすれば、説明してくれているサイトがみつかるので、そういったサイトも参考にしながらCSSを修正して下さい。そうすることにより、自然とCSSの使い方についての知識が深まっていきます。

また、このサービスを使うことにより、正しいCSSをマスターすることができます。正しいCSSを使うことは、多くの人が（多くのブラウザで）閲覧しやすいホームページ環境を作る手助けとなるので、取り組むことをお奨めします。

このように、ホームページ運営やweb制作をする人にとって、このツールは、CSSを勉強する面においても正しいCSS文法を記述する面においても非常に役立つツールだといえますので、ブログをカスタマイズした後やCSSの記述間違いを探す際には、ぜひ活用させて頂きましょう。

主要ブラウザでデザインが崩れていないか表示確認

• スクリーンショット.jp

ホームページは、使っているパソコンのブラウザ環境などによって表示のされ方が違ってきます。例えば、最も多く使われているインターネットエクスプローラー（IE）だけをみてもIE6とIE7で同じホームページを表示した時にIE7ではちゃんと表示されているページがIE6で見てみたら右メニューが下にずれてしまっているなんてことはよくある話だと思います。

こういったデザインの崩れは、スタイルシート（CSS）の記述ミスが原因の場合がほとんどです。

そんなデザインの崩れを確認するには、それぞれのブラウザをインストールしてどのように表示されるか確認しなければならないのですが、こちらのツールを使えば、様々な主要ブラウザのスクリーンショットを取ることができます。

しかしながら、お試し期間中は、無料でいくつかのブラウザのスクリーンショットが撮れたのですが、お試し期間が終わり有料になってしまったのが大変残念です。

無料で主要ブラウザの表示確認をする

無料で主要ブラウザの表示確認をしたいという方の為に最低でもこれらは確認しておいた方が良いというブラウザのダウンロード先をリンクしておきますので、各自インストールして確認してみて下さい。

• Internet Explorer（インターネットエクスプローラ）
  最も利用者が多いブラウザです。
• Firefox
  IEと同じく利用者の多いブラウザです。
• Safari
  アップル社のブラウザです。
• Opera
  たまに使っている人がいます。
• Google Chrome
  GoogleのWebブラウザーです。

複数のブラウザを紹介しましたが、実際のところInternet ExplorerとFirefoxを利用しているユーザーが大半を占めているので、その他のブラウザに関しては、それほど気にする必要はないかも知れません。