 |
2005年12月12日 |
「Web標準」で得をする！？（前編）
投稿者 : hitoshi yamaura
先週は、Webの世界は「セマンティックWeb」に近づいていくというお話をしました。
その「セマンティックWeb」向かう流れの中で、Webデザイン・構築においては「Web標準」ということが、最近、業界誌やセミナー等で盛んに謳われています。
英訳すると「Web Standard」。
なんだかちょっとアカデミックな響きですね ^^;
では「Web標準」とは一体、何なのでしょうか？
その「セマンティックWeb」向かう流れの中で、Webデザイン・構築においては「Web標準」ということが、最近、業界誌やセミナー等で盛んに謳われています。
英訳すると「Web Standard」。
なんだかちょっとアカデミックな響きですね ^^;
では「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でレイアウトをしていきます。
言葉ではなかなか実感がわかないと思うので、実例をお見せします。
まずこれは当社のウェブサイトです。
（作りかけですみません・・・）
http://www.weblab.co.jp/service/index.html
このドキュメントからスタイルシートを外すとこうなります。
http://www.weblab.co.jp/service/index_noncss.html
見てすぐにおわかりになると思いますが、HTMLの方は非常にシンプルなHTMLです。デザイン要素は、CSSに記述しています。
最近、本屋さんに行って、Webデザイン関連の書籍コーナーに行くと「(X)HTML + CSS でデザインする」とか、そういうタイトルの本がたくさん置いてあります。
つまり「Web標準」や「(X)HTML + CSS」というのは、ブームというか、トレンドなのであります。
それにしても、CSSはとっつきにくい！
ブラウザによって表示のされ方も違うし。
ご自分でホームページを作っている人の中には、苦手意識のある人も多いと思います。
にもかかわらず、なんでブームなのでしょう。
実は、主にSEOやアクセシビリティにおいて、メリットが多いからなのです。
次回、その辺りを詳しくお話します。
W3Cというのは、Webで利用される技術の規格を定めている団体です。
http://www.w3.org/
さて、こんな話を始めると当然に
「あら大変！うちのホームページは、Web標準なのかしら」
という話になります。
安心してください。
実は、世の中の多くのWebサイトが、W3Cの規格に準拠していない、つまり“Web標準でない”サイトなので。
（こんな理由じゃ安心できない！？ ^^;）
なぜそうなってしまったのか！？
それは、これまでブラウザを提供してきた会社（MicrosoftとNetscape）がWeb標準の実装に消極的だったからと言われています。
つまり、Web標準でサイトを作っても、思った通りにブラウザに表示されないのです。
“Web標準で作る”ということは、当然に“正しいHTML”でページを作成するということです。
“正しいHTML”ということは、当然、そのHTMLを構成するタグも、正しい使い方をされなければなりません。
例えば、レイアウトをtableタグでマークアップする場合がありますが、本来tableタグはレイアウトをするためのものではなく、表を表示するためのものです。なので、レイアウトを組むためにtableを使うのは、本来は良くないとされています。
じゃぁ、レイアウトはどうやって整えれば良いのでしょうか？
答えは、CSS（スタイルシート）です。
まず、正しいHTMLで文書をマークアップします。そしてCSSでレイアウトをしていきます。
言葉ではなかなか実感がわかないと思うので、実例をお見せします。
まずこれは当社のウェブサイトです。
（作りかけですみません・・・）
http://www.weblab.co.jp/service/index.html
このドキュメントからスタイルシートを外すとこうなります。
http://www.weblab.co.jp/service/index_noncss.html
見てすぐにおわかりになると思いますが、HTMLの方は非常にシンプルなHTMLです。デザイン要素は、CSSに記述しています。
最近、本屋さんに行って、Webデザイン関連の書籍コーナーに行くと「(X)HTML + CSS でデザインする」とか、そういうタイトルの本がたくさん置いてあります。
つまり「Web標準」や「(X)HTML + CSS」というのは、ブームというか、トレンドなのであります。
それにしても、CSSはとっつきにくい！
ブラウザによって表示のされ方も違うし。
ご自分でホームページを作っている人の中には、苦手意識のある人も多いと思います。
にもかかわらず、なんでブームなのでしょう。
実は、主にSEOやアクセシビリティにおいて、メリットが多いからなのです。
次回、その辺りを詳しくお話します。
