CSS（Cascading Style Sheet）は、HTMLやXHTMLの要素に対して、どのように表示（装飾）するかを指定するための記述仕様です。
ページ内容とそれを飾る指示を分離することによって、SEO効果が狙え、ブラウザ自身が内容を解釈できるようになり、さまざまな効果を上げることができます。

CSS（スタイルシート）がデザインやレイアウトの役目を担うことで、以下のような効果が得られます。

• HTML文書のファイルサイズを小さくできる。
• Webサイト内のデザインを一括管理できる。
• HTMLでは実現できなかった細かなデザインが可能となる。
• 開発時間の短縮、コスト削減の効果が得られる。

特に、ホームページ内のすべてのページのデザインを統一したい場合は、CSSによって抜群の効果を得られます。では、CSSのメリットと注意点を次に挙げてみましょう。

CSSのメリット

まず、CSSを使うことによって、HTMLソースの簡素化が実現できます。HTMLコード内にデザインやレイアウトの指示まで記述してしまうと、検索エンジンのロボットが収集する情報（キーワード）になかなか辿り着けなかったり、メンテナンスに手間がかかってしまう原因になります。Webページ内の記述を内容だけに留め、デザインなどの装飾は異なるファイルに記述することによって、HTMLソースとなるページのファイルはシンプル化され（ファイルサイズも小さくなる）、検索エンジンロボットもページ内容を効率よく収集できることになります。

次にHTML上の表示順序を変更できることで、強調したい内容を上位に記述することができます。例えば通常、メニューは上位にあり、その下に実際の内容が表示されますが、検索ロボットは上から順に情報を収集するので、メニュー内容を先に収集してしまい、その後に強調されている内容を収集することになります。検索ロボットはページの最後まで巡回するとは限らないので、収集して欲しい情報まで見てくれない場合もあります。HTML上で、内容を先に記述して、その後ろにメニューを記述しても、CSSを使うことによってメニューをブラウザの上に表示させることが可能となります。

また、h1などの見出しには初期で太字でフォントサイズが大きく設定されています。見た目にそれを簡単に変更できるのがCSSです。CSSが使えることになってから、格段に表現力がアップし、しかも見栄えだけでなく、レイアウトも柔軟なものが可能となりました。

現在では、CSSでWebサイトの体裁を整えるのが当たり前となり、SEO効果を発揮する一つの方法だと位置づけられています。

CSSの注意ごと

CSSでレイアウトを整える時の一番の弱点は、ブラウザの種類・バージョンなどによって表示のされ方が異なることです。
特にInternet Explorer（IE）とFireFoxなどは認識のされ方が異なります。IEでは、バージョンによってもCSSの表現が変わります。

ブロック要素の内側の余白である「padding」を例にしてみます。例えば、ブロック要素の幅を300px、paddingを5pxとしたとき、ブラウザやバージョンによって図のような表現をします。

このようにブラウザによって、またはバージョンによって表現の仕方が変わりますので、すべてのブラウザで同じように表現するには、いろいろな工夫をすることが必要です。ホームページを作成する段階で、必ずいろいろなブラウザで確認しながらレイアウトやデザインを行うことが必要となります。