「Web標準」で得をする（後編）

しつこいようですが、「Web標準」は“コンテンツの文書構造を(X)HTML、見た目をCSS”で作成します。
この場合、HTMLだけ見ると、レイアウトの為のtableタグなどが無く、<h1>－<h6>の見出しタグとか、リストタグなどで、きちんと構造化されたHTMLです。
例）https://www.weblab.co.jp/service/index_noncss.html

tableタグで複雑にレイアウトされたHTMLと比べて、いい意味で、非常に「原始的」と言いますか、シンプルです。
実は「Web標準」のメリットは全て“このHTMLがシンプルで構造化されている”ことに集約されています。

■メリット１・・・SEOで有利

やはりこれが最大のメリットなのかなと思います。
検索エンジンは世の中にあるホームページを巡回して、自身のデータベース（索引）に登録していきます。
これを「インデックスされる」とか言ったりします。

当たり前の話ですが、例えば100ページあるホームページなのに、50ページしかインデックスされないと、その時点で検索エンジン経由のアクセスの50％を失っているかもしれません。
ですから、確実に全てのページを、検索エンジンにインデックスされるようにする必要があります。

「Web標準」で作成したHTMLは、W3Cの仕様に準拠した正しいHTMLです。検索エンジンも、「正しいHTML」を前提に作られています。
ですから「Web標準」で作成したHTMLは、検索エンジンがとても理解しやすいのです。
つまり、確実にインデックスしてもらえるということです。

■メリット２・・・ページが軽い

だいぶブロードバンドが普及した今となっては、昔ほどはページの重さも気にされなくなりましたが、「Web標準」のページは、“実際の重さ”と“体感的な重さ”の両方で軽いです。

“実際の重さ”については、(X)HTML + CSS と従来の HTML 4.0 で全く同じレイアウトを実現したとすると、HTMLファイルだけの比較なら半分ぐらいに減ると言われています。
現実には画像の重さも加味すると半分にはなりませんが、「塵も積もれば山となる」で、大規模サイトでは、全体の転送量、つまりサーバや回線の負荷の軽減につながることは明らかです。
大企業やアクセスの多いサイトは無視できないメリットですね。

もう１つ“体感的な重さ”についてですが、ブラウザにもよりますけれども、tableタグって、閉じタグ＜/table＞が読み込まれるまで、そのtable自体が表示されないって知っていました？
この特性を知っているWeb制作者は、従来tableでレイアウトする時、ヘッダ、本文、フッタでtableを分けて、１つにしないようにしたり気を使ったりしてるのですが、(X)HTML + CSSの場合はそのような気を使う必要はありません。

■メリット３・・・メンテナンス性が優れている

デザイン部分は外部ファイルであるCSSで制御されているので、基本的にはHTMLだけ更新していけば良いということになります。
ただし、この場合、更新の際にCSSをいじらないで済むという前提です。
つまり、どういったページをどんな風に増やしていくか、更新していくか、あらかじめサイトを設計する段階で決めて、それに合わせてCSSを作らないとならないということです。
毎回デザイン部分もいじりたい、ということになると、いちいちCSSをいじるよりは、tableでレイアウトをどんどんHTMLに書いて行く方が楽に感じるかもしれません。
（特に外部業者に更新を依頼している場合は、作業工数が変わってくるので注意が必要）

■メリット４・・・アクセシビリティが確保しやすい

これも大きなメリットです。
ユニバーサルデザインというのは聞いた事があると思います。別な言い方をすると、バリアフリーなデザインといいますか。。。
アクセシビリティというのは、ホームページのユニバーサルデザインという風に言い換えても良いと思います。
例えば、目の不自由な人はスクリーンリーダーという、ホームページを読み上げるソフトを使いますが、こういったソフトも正しいHTML構造に最適化されています。
（アクセシビリティについては、次号で詳しく説明します）

以上の４つが大きなメリットです。

こういった流れを受けて、「Web標準」を導入する企業も増えてきました。例えば、米msnや米yahoo。日本語のホームページだと、富士通、IBM、朝日新聞、goo・・・
さすがに自社PRにもなるので、IT系の企業が多いですね。

あっ、そうそう、世の中のほとんどのブログも「Web標準」です。
最近、ブログエンジンでホームページを作るということがにわかに流行っていたりしますが、更新性とともに「Web標準」でできていることによるSEO上のメリットも、人気の理由の１つです。
（但し、下手な業者が作るとせっかくの「Web標準」でできているHTMLソースが去勢されてしまうので注意が必要）

デメリットにも触れないといけないですね。

最大のデメリットは、何といってもブラウザによる表示の違いです。
厳密にデザインを制御しようとすると「ハック」と言って、ブラウザ毎に違う数値を読ませるようなソースコードを書かなければならなかったりします。私も当初はなかなか思い通りにいかず、腹が立っ何度も壁に頭を打ち付けたことか ^^;
CSS自体は、HTMLが理解できる人なら、そんなに難しくはありませんが、やはりこの部分が難関なんですね。

ですから、tableレイアウトで上手く運営できているのであれば、無理して「Web標準」にすべきかどうか、このデメリットの部分を十分に加味して判断しなければなりません。

2回にわたって「Web標準」についてお話しましたが、いかがでしたでしょうか？
次回は、上記のメリット4にも挙げました、アクセシビリティということについてお話します。今後、急速に高齢化が進む日本においては、結構無視できない問題であったりします。

お楽しみに！