第1回 CSSとはテーブルレイアウトを卒業しよう

CSSとは

CSSとは、Cascading Style Sheet(カスケーディングスタイルシート)の略称で、(X)HTML文書やXML文書の装飾(デザイン)を指定できる規格のひとつです。

(X)HTMLは「要素(タグ)を使用して文書に対して意味を持たせる(マークアップする)」ことを目的とした技術です。

いわゆるテーブルレイアウト(table)のような、要素を使ってのデザインやページレイアウトは、本来の(X)HTMLの目的から考えると誤った使用方法であるともいえます。

そのため、現在ではCSSを使い、フォントや文字の大きさ、色、文字 飾り、行間、背景などの視覚的な表現と、文書の内容とを切り離すことが推奨されています。

文書の内容と視覚的表現を切り離す

上図のように、文書の意味とデザインの指定を切り分けることで、(X)HTMLの構成がシンプルになります。それにより、製作者側は全体の工数を削減することができます。

Web標準化とは

Webサイトは多くの人がそれぞれ異なるいろいろな環境からアクセスする可能性があります。アクセシビリティを考慮し、誰もが平等に情報を得ることができるWebサイト、つまり標準的な規格に則ったサイトにするためには、W3Cが定めた(X)HTMLを、本来の用途のとおりに使用することが重要です。

これが、情報のバリアフリー化、つまり「Web標準化」のもっとも基本的な考え方です。

また、ソースコードのファイルサイズが軽減され、ユーザーにとっても閲覧しやすくなります。

そのほかにも(X)HTMLとCSSを正しく使うことSEOやアクセシビリティの面で多くのメリットを得ることができます。

W3Cとは

W3C:World Wide Web Consortiumとは、XML、(X)HTML、CSSなどのWeb上で使用されるさまざまな技術の標準規格を定め、勧告を行っている非営利の標準化団体です。

(X)HTML+CSSでWebサイトを制作するためにDreamweaverなどのWebサイト構築ツールが必須かというと、そうではありません。

極端な話では、WindowsやMacintoshに標準で付属している、テキストエディタさえあればWebサイトは作れます。

次回は、CSSをDreamweaverで書くメリットについてご説明します。(こう鈴木 航 (すずきこう)

次のページは…
DreamweaverでCSSを書くメリットってなに?
関連リンク
鈴木 航 (すずき こう)
鈴木 航 (すずき こう)

XHTML、CSSなどのWeb関連技術を得意とする。かぼちゃの煮物が嫌い。

CSS 3分コーディング

RSSフィードで
最新情報を購読