「Web標準」で得をする！？（前編）

Web標準とは、一言で言うと「WebコンテンツをW3Cの仕様に準拠して制作すること」となります。

W3Cというのは、Webで利用される技術の規格を定めている団体です。
http://www.w3.org/

さて、こんな話を始めると当然に
「あら大変！うちのホームページは、Web標準なのかしら」
という話になります。

安心してください。
実は、世の中の多くのWebサイトが、W3Cの規格に準拠していない、つまり“Web標準でない”サイトなので。
（こんな理由じゃ安心できない！？ ^^;）

なぜそうなってしまったのか！？

それは、これまでブラウザを提供してきた会社（MicrosoftとNetscape）がWeb標準の実装に消極的だったからと言われています。
つまり、Web標準でサイトを作っても、思った通りにブラウザに表示されないのです。

“Web標準で作る”ということは、当然に“正しいHTML”でページを作成するということです。
“正しいHTML”ということは、当然、そのHTMLを構成するタグも、正しい使い方をされなければなりません。

例えば、レイアウトをtableタグでマークアップする場合がありますが、本来tableタグはレイアウトをするためのものではなく、表を表示するためのものです。なので、レイアウトを組むためにtableを使うのは、本来は良くないとされています。

じゃぁ、レイアウトはどうやって整えれば良いのでしょうか？

答えは、CSS（スタイルシート）です。
まず、正しいHTMLで文書をマークアップします。そしてCSSでレイアウトをしていきます。

言葉ではなかなか実感がわかないと思うので、実例をお見せします。
まずこれは当社のWebサイトです。
（作りかけですみません・・・）
https://www.weblab.co.jp/service/index.html

このドキュメントからスタイルシートを外すとこうなります。
https://www.weblab.co.jp/service/index_noncss.html

見てすぐにおわかりになると思いますが、HTMLの方は非常にシンプルなHTMLです。デザイン要素は、CSSに記述しています。

最近、本屋さんに行って、Webデザイン関連の書籍コーナーに行くと「(X)HTML + CSS でデザインする」とか、そういうタイトルの本がたくさん置いてあります。
つまり「Web標準」や「(X)HTML + CSS」というのは、ブームというか、トレンドなのであります。

それにしても、CSSはとっつきにくい！
ブラウザによって表示のされ方も違うし。
ご自分でホームページを作っている人の中には、苦手意識のある人も多いと思います。
にもかかわらず、なんでブームなのでしょう。

実は、主にSEOやアクセシビリティにおいて、メリットが多いからなのです。
次回、その辺りを詳しくお話します。