スタイルシートとはウェブページのレイアウトを専門に行う言語です。HTML内にそのスタイルを記述したり、HTMLと分離した別のファイルにレイアウトを記述して、複数のファイルから呼び出すことが可能です。

指定できるものとして、フォントや背景画像、余白、マウスカーソルなどがあり、スタイルシートファイルを変えただけサイト内の全てのページに適用することができるので、大規模なウェブ作成には欠かせないものになっています。

１つのスタイルシートは、サイトの全てのページに適用することができます。
また、複数のスタイルシートファイルを用意することで、サイト内のデザインをコンテンツによって使い分けることが可能です。

スタイルシートのメリットはサイト全体に統一感を出せることにあります。
一般の書籍のレイアウトに統一感があるように、ウェブにも同じ背景やフォントを使用したりと統一感を出すことも重要です。全てのページに同じスタイルシートを用いることで、サイト全体が１つのブランドとしての協調性を持つことができるのです。

スタイルシートについて

スタイルシートと言った場合、カスケーディング・スタイル・シート(CSS)と、JavaScript・スタイル・シート(JSS)がありますが、一般的にスタイルシートと呼ばれるのは前者のCSSです。

W3Cで標準化されているCSSには、CSS1(レベル１)とCSS2(レベル２)がありますが、Internet ExplorerやNetscapeなどのブラウザはCSS2を完全に実装しておらず、基本的にCSS1を記述することになります。

スタイルシートの実装

スタイルシート実装するには主に２つの方法があります。

埋め込み型スタイルシート：style属性を用いてタグに実装する
リンク型スタイルシート：別ファイルにスタイルシートを記述し、そのスタイルを使うウェブページのヘッダーからリンクで読み込む

リンク型スタイルシートを用いると、外部スタイルシートファイルを更新するだけでサイト全体の見せ方を簡単に変更できるためメンテナンスが楽になるというメリットがあります。

また、スタイルシートファイルは最初にダウンロードするだけでよいので、そのスタイルを適用したページは、埋め込み型スタイルシートを利用したページよりもダウンロードが速くなります。

スタイルが多くのページに共通するものであればサイト全体のスタイルシートとして追加するべきですが、たった１ページでしか使わないスタイルは埋め込み型にした方がよいでしょう。

そうすると、ページ共通のスタイルにリンクしたままで、そのページの埋め込み型スタイルシートが追加されます。これは、修正されたページにも、共通のスタイルシートに対する変更が反映されるという利点があります

詳しくは、スタイルシートのページで解説してありますので、詳しくはそちらをご覧ください。

eWeb