CSSとは?

Cascading Style Sheets(カスケーディング・スタイル・シート)という名称である。

これは、ウェブページのスタイルを指定するための言語です。ワープロソフトなどで作成される文書も含めて、文書のスタイルを指定する技術全般をスタイルシートといいます。

HTMLやXHTMLなどで作成されるウェブページにスタイルを適用する場合には、スタイルシート言語の1つであるCSSが一般的に利用されています。

CSSは、HTMLと組み合わせて使用する言語であり、HTMLがウェブページ内の各要素の意味や情報構造を定義するのに対して、CSSではそれらをどのように装飾するかを指定します。 例えば、ウェブページがスクリーンに表示される際の色・サイズ・レイアウトなどの表示スタイルや、プリンタなどの機器で印刷・出力される際の出力スタイル、 音声で読み上げられる際の再生スタイルなど、ウェブページをどのようなスタイルで表示・出力・再生するかについて指定することができます。

なぜ、スタイルシートが必要か?

現在、ウェブページを制作する言語として広く利用されているHTML4.01やXHTML1.0には、装飾目的の要素(タグ)や属性が存在しています。また、タグでレイアウトをまとめるなどの方法を駆使すれば、HTMLだけでウェブページの見栄えを制御することもできなくはない。

しかし、ウェブページのスタイリングにHTMLを用いるべきではありません。HTMLは情報構造を定義するための言語であり、見栄えの制御のために本来の役割とは違った使い方をすると、 文書の情報構造がでたらめになってしまうからです。コンピュータや検索エンジンに理解されないでたらめな文書構造になってしまえば、せっかくの情報もうまく活用されません。

また、HTMLの要素(タグ)をどのように表示するかは、ユーザーエージェント(ブラウザ)によって異なることがあります。HTMLタグを駆使してある閲覧環境では見栄え良くレイアウトできたとしても、 他の閲覧環境ではまったく意図しないレイアウトになってしまうこともありえる。

CSSの基本は?

・CSSを使用するメリット

CSSで文書の見栄えを制御することで、文書の構造とスタイルを分離して管理できるようになります。 このことから様々なメリットが得られます。

・文書構造を保ったままスタイルを指定できる

HTMLで文書のスタイルを制御しようとすると、文書内容や意味にそぐわないHTMLタグを使用して、 文書構造が分からなくなるという問題が起こります。 CSSを使用することで文書の構造に影響を与えずにスタイルを制御できるようになり、 スタイル指定のせいで文書構造が分からなくなるということがありません。

・メンテナンス性が向上する

HTMLでスタイルを指定する場合、例えば見出しの色やサイズを変えようとすると、 見出しが使用されているすべての箇所を変更する必要がありますが、 CSSではこうしたスタイルを一括で管理することができます。 また、複数の文書でスタイルを共有できるため、メンテナンス性が格段に向上します。 一度CSSを体験すると、二度とHTMLによるスタイリングに戻る気がしなくなるものです。

・SEO効果やアクセシビリティ向上が期待できる

HTMLによる見栄えの制御をやめて情報を適切にマークアップすることで、検索エンジンに正しく解釈されるウェブページとなります。 また、CSSでスタイル指定することで、文書から余分なマークアップを排除して、 スタイルに関する記述を一箇所にまとめてウェブページを軽量化することができます。 これらの改善により、多くの場合SEO効果やアクセシビリティ向上が期待できます。

・メディアごとにスタイル指定できる

CSSではパソコンのスクリーン・携帯機器・テレビ・音声・印刷・点字など、 様々なメディアごとに適用するスタイルを指定し分けることができます。 現状ではユーザーエージェント(ブラウザ)側の対応が完全ではありませんが、 メディアごとにスタイルを指定することで、将来的に特定のメディアに依存することなく、 それぞれのメディアに合ったスタイルでウェブページを表示・再生・出力させることができるようになります。

inserted by FC2 system