CSS と HTML (文書構造)を分ける事で得られるメリット
CSSに関してはいろんな雑誌やWebサイトで説明されています。どのような立場で説明されているのか分からなければ、単にCSSとはそういうものだと一部分を解釈してしまいがちです。
例えば、制作、保守、管理に関するメリットは、訪問者にとっては関係のない話です。このようなCSSの部分的な解釈は、CSSとはそういうものだと誤解する原因の一つになっているような気がします。
それぞれの視点からみたHTML/CSS分離のメリット
いくつかの視点でメリットを考えてみました。
訪問者(ユーザー)
- アクセシビリティ向上により、視覚障害のある方でも音声ブラウザによる情報提供が可能になります。
- レイアウト要素を外部CSSとした場合、通常のブラウザのデフォルトではセッションに一度CSSを読み込むだけで済むため、同一セッション内、又はセッション中にCSSが変更されない限り※は、文章のみのHTMLを読み込むだけで済みます。これにより、ダウンロードが速くなるだけでなく、ブラウザの表示速度も速くなります。
- ※MacIE-5 のように、CSSが変更されてもCSSを読み込み直さないブラウザもあります。
企業
- アクセシビリティに貢献するため、全ての人に平等に情報を提供できます。社会貢献というより義務と考えています。
- 外部CSSとする事でHTMLが軽量化するため、1日に10万アクセスもあるようなWebサイトではトラフィック軽減に貢献できます。
制作者
- (X)HTMLソースコードがシンプルになるため、PHPやCGIなどWebアプリケーション開発に適します。
- 外部CSSとする事でレイアウト要素を共有でき、外観を一括変更する事が出来ます。
- CSSを使用したレイアウト・デザインではタグごとに外観を定義することが可能なため、CSSを共有しているページではデザインフォーマットを統一、強制する事が出来ます。一貫性を保ています。
- 制作を行う前に、更新作業のことを想定したCSSのルールを視野にいれる必要があります。
全て
- 論理構造が明確になるため、検索エンジン等のアルゴリズムにマッチしやすくなります。これはSEOを重視する企業・Eサイト、訪問者にとってのメリットでもあります。
- CSS2に準拠したブラウザであれば、異なるブラウザでほぼ共通の外観を提供する事ができます。2005年の現状では、CSS2 が勧告(1998年)されて間が無い2000年ごろのブラウザ対応状況は状況は変わっています。
- Web標準化によりインターネット全体の発展に貢献します。特定のブラウザ、特定のユーザーしか閲覧できないネット社会では、平等な競争原理はなく、市場も育ちません。
ブログが検索エンジンで上位表示され易いという話は良く聞きますが、HTMLとCSSを分離し、文章構造のはっきりした(X)HTMLを出力されるようになっているケースが多いのも理由の一つです。(ブログツールの出来やテンプレート(HTMLの出来)にもよりますが、)
このため、HTML/CSSに関する専門知識のない人でもSEOを意識する必要がないメリットがあります。しかしカスタマイズにはCSSに関する知識が要求されます。
他、ブログサイトがSEO的に有利な理由は、各ページ毎に関連性のあるリンクが張れるトラックバックの恩恵があります。
これらは、HTML(論理構造)とCSS(レイアウト要素)を分離することで得られるメリットであり、単に異なるブラウザで共通のデザイン(見栄え)を提供するための規格ではない事が分かると思います。