Web初心者のホームページを作ろう~第4.5回~「スタイル、CSSとは」

 皆さんこんにちはKUJIRAです。前回からだいぶ時間が経ってしまいました。自分でも自然消滅してしまうのではないかと思ったこの記事、ようやく更新できるように・・・というか更新する気になったので更新したいと思います(笑)。

 前回はtableタグとdivタグという二つのタグについて説明いたしました。覚えているでしょうか?ちなみにKUJIRAは長く更新してなかったのでどこまでやったか全く覚えていませんでした(笑)。

 実は前回まででホームページの基本的なところ、というかページを構成する為の必要最低限の要素は殆ど揃っているのです。では今日は何をするのかというと、前回予告していた通りCSSの使い方についてやっていきたい・・・と言いたいところですが、1クッション置いてCSSについての説明をしたいと思います。

 CSSって何ぞや?と誰しも思っていることでしょう。まぁ知っている人は知っていると思うので、そういう方は今回はお休みということで(笑)。

CSSとはCascading Style Sheetsの略で、俗にスタイルシートとか呼ばれているものです。ホームページはHTMLで書きますが、そもそもHTMLというのはWeb文章を構造的にまとめる為に開発された言語で装飾用には作られておりません。まぁ簡単に言ってしまうと、文章を書いて公開することが本来の目的な訳です。

 しかし、急速なインターネットの普及に伴い、今やWebページは文章を表示するだけではなく、より綺麗に、より見やすく作るという風潮が人々の間に広まり、皆こぞって綺麗なページを作るようになりました。この風潮はHTMLに不要なタグを追加させ、さらには見づらいコードを作ってしまう原因になってしまったのです。

 そこで考え出されたのがスタイルという方法です。スタイルはもともと属性で、属性値の中に定型の書式でパラメータを設定していくことで、ページの整形を行うものです。

 しかし、これでもまだコードとしてはごちゃごちゃします。そこで最終的に考え出されたのが、CSSというわけです。

 CSSは属性としてタグに書いていたスタイルの設定値を、別ファイルにまとめて設定し使用する方法を取ります。 このCSSはタグに直接整形ルールを付与できるほか、class、idなどであらかじめルールを決めておき、必要なときにタグの属性として設定することでルールを与えることができます。これにより長いコードを短く読みやすい形にすることができます。

 しかも、一つのCSSを複数のページで使いまわすことができるため、ページごとに必要な要素をピックアップして使うこともできます。

 ホームページを作成するときはコンテンツデータはHTMLで、装飾は全てCSSという形をとる事でコードを劇的に簡略化する事ができます。また、デザインの一斉変更も可能で更にはSEO対策にも効果を発揮するなどメリットが多いです。

 しかし、デメリットもあります。それは、ブラウザによって見え方が変わってくるという事です。一番ひどいのはIEです。お話になりません。CSSを相当ハックしないとページが崩れてぐちゃぐちゃになります。それでも前述したメリットが凄く大きいので、みんなCSSを使っているわけです。KUJIRAもお勧めします。ということで今回はCSSのお話をしました。次回こそはCSSの使い方を説明したいと思います。それでは。