CSSって何?ウェブ設計図の裏側

基本のHTMLだけでは出来ないことをする

ふだんインターネットで何気なく見ている「ウェブページ」、これらは全て「プログラム」によって記述されているのをご存知でしょうか?満載の写真をパラパラめくるように眺められるサイト、実店舗のようにショッピングが楽しめるサイト‥‥いずれも「裏側」をちょっと覗くと「命令の羅列」、呪文のような文字がずらずらと並んでいるのが確認できます(「ソースを見る」という操作で見られます)。
そうしたウェブサイトを表示させるための「設計図」を書くためにはHTMLという言語が使われます。特に凝った機能を必要としない(例えば、単に記事を表示させるのみの)サイトであればこのHTMLだけで作成できます。近年ではサイトに更なる操作感やより美しい外観を与えるために、HTMLのみならず 用途に応じたさまざまな言語が併用されるのが普通となっています。

記述とガワの「分業」が推奨されている

例えば、「クリックすると展開するメニュー」は普段の閲覧時はじゃまにならず、そこに興味を持ったユーザーが操作して初めて表示されます。こういった「インタラクティブなもの」は基本的HTMLでは実現が難しく、JavascriptやPHPといった言語を併用して「仕込む」ことになります。
また「サイト全体をおしゃれに、統一した外観で見せる」ための言語としてCSSがあります。これはサイト表示の様式(テキスト設定を始め あらゆる見た目)を一括で設定することができる言語です。もちろんHTMLだけでもある程度の外観設定は可能であるものの機能的に限界があり、また個別ページひとつひとつに対して設定していく必要があるなど たいへんな手間を伴います。
HTMLは「記述そのものや構造(段落など)を示すもの」であり、近年ではこの「外観の専門家」CSSを導入することでサイト構成を積極的に「分業」することが推奨されています。