2004年02月18日

Validなサイトへの道

UWORLDさんの以下の記事に触発され、CSSとXHTMLのValidation通過に挑戦しました。



久しぶりに、ログ解析結果を見ると、このサイトを見て下さっている方の中には、結構「OPERA」を使っている方がいるようです。
そこで自分もOperaで見てみましたが、CSSのレベルで表示がぐちゃぐちゃに!!!

まずは、CSSから。
W3C CSS Validator」から挑戦したところ、一行直しただけであっけなく通過。
が、「Web Design Group
に同じものを通したら、WarningどころかErrorまで出る始末。
IDに'-'(ハイフン)でなく'_'(アンダーバー)を使っていると、後者ではErrorが出るようです。

まぁとりあえずOKということで、次はXHTMLへ。
こちらは「The W3C MarkUp Validation Service」を利用しました。
苦心惨憺の末、全ページで通過しましたので、修正点をメモっておきます。
・タグと属性を全て小文字にする
・meta、imgなどのタグを「>」ではなく「/>」で終わるようにする
・imgにはalt属性をつける
・「&」を「&」に置き換える (URLの&も置換する必要があります)
・「<」を「&lt;」に置き換える
・「>」を「&gt;」に置き換える
・<ul>と<li>の入れ子記述を修正
・<blockquote>タグの前と</blockquote>の後ろを一行空ける(エントリーの修正)
・<div>タグの前と</div>の後ろを一行空ける (エントリーの修正)
#Perlで一括変換するプログラムが書けそうですね
<ul>と<li>の入れ子記述の修正方法については、ブルーライトノヴァさんの「リストの入れ子」に詳細が載っています。

以下のツール、サービスを利用されている方は注意が必要です。
デフォルト設定で生成されたり挿入されるコードは上記Validatorを通過しません。
moblog.uva.ne.jp - moblog mail gateway
AsociateHelper

ちなみに「W3C CSS Validator」を通過した後に以下のメッセージが出てくるのですが。



あなたがこのWebページを作るにあたって、高度な相互運用性(Interoperability)に対する配慮を行った事を読者に示すため、このアイコンを張る事をお勧めします。あなたのWebページにこのアイコンを張るためには、次のHTMLの断片を利用すると良いでしょう。

ここで紹介されている「次のHTMLの断片」はimgタグが「/>」で終わっていないので、Validatorを通過しません。
う〜ん、この道は険しいですね。


投稿者 iiroty : 2004年02月18日 11:56 | トラックバック
コメント
コメントする









名前、アドレスを登録しますか?