初心者向けホームページ作成講座
フリーソフトでホームページを作ろう!
touka.gif(49 byte)
touka.gif(49 byte)
touka.gif(49 byte)
touka.gif(49 byte)
touka.gif(49 byte)
t-1.png(323 byte)

自分のサイトの文法チェック

(更新日 08/12/06)

 実はHTMLは文法的な間違いが多少あっても、それなりに表示されるようになっています。これは作り手側には一見有難いのですが、大きなミスがあっても見逃してしまう要因にもなります。例えばタイトルが空白になっていたり別のウェブブラウザで見た時に意図しない形でページが表示される事も。そこで、ここでは作成したサイトの文法チェックを行えるオンラインツールを紹介します。

Another HTML-lint

check-1.png(9590 byte)

 Another HTML-lintはHTML文書の文法の正確性を採点形式でチェックする事ができるオンラインツールです。「URL」の部分にチェックしたいページのアドレスを入力してチェックボタンで、そのサイトの得点と問題箇所一覧を表示します。アップロードしていないHTMLファイルは「FILE」からチェックする事もできます。

 Another HTML-lint

 さて、このサイトのトップページをAnother HTML-lintでチェックした所、11個のエラー、83点という評価でした。言い訳するとエラーの箇所の殆どは諸事情により書き換えができないので、私の責任ではありません(^^; 残念ながらalphaEDITなどのWYSIWYG型HTMLエディタで作成したHTMLは、無駄なタグが多く入ってしまう事でかなり点数が低くなってしまう筈です。

 このツールは自分のサイトだけでなく、他人のサイトもチェックする事ができるので、気になるサイトのHTMLや配布しているテンプレートがどれだけ正確に書かれているかをチェックしてみるのも面白いと思います。大手サイトの点数が意外に低かったりするので、文法の正確性と人気は別物とう事ですね。点数が低くてもそれ程気にする必要はなさそうです。

W3C CSSチェック

check-3.png(8729 byte)

 W3C CSS 検証サービスではスタイルシートの文法をチェックする事ができます。「アドレス」部分にアップロードしているCSSファイル、HTML内に記述している場合はそのHTMLファイルのアドレスを入力して「検証する」からチェックを行います。

 W3C CSS 検証サービス

 HTMLの文法と違ってスタイルシートの場合は記述ミスがあるとIEで正常に表示されていてもIE以外のウェブブラウザでは表示が崩れる可能性が高いので、エラーが検出された場合は修正が必須と言えます。実はこのサイトを作成している当初に外部CSSファイルをチェックした所、3箇所ほどエラーがありまして、現在は修正しています。

 因みにエラーがない場合は「おめでとうございます! エラーはありません。」というページが表示され、下の画像のタグが表示されます。これをページに貼り付ければ、このサイトはW3Cに準拠した正確なスタイルシートで構築されているという証明になります。

正当なCSSです!

広告
t-2.png(196 byte)