でも、自分の環境では思ったとおり反映されているけど、ブラウザやバージョンの違いで意図しないエラーが吐き出されていることもあります。
そんな時便利なのが、HTMLやCSSをチェックしてくれるサービス。カスタマイズしたあとは一度チェックしてみましょう。「え、こんなにひどいの?」とショックを受けるかもしれません。
まず「HTMLとXHTMLの違いは何ぞや」という話を簡単にご説明します。
HTMLは、標準的であり一般的な言語。最終バージョンは4.01です。これにXML要素を加えたものがXHTMLです。はい、簡単すぎてわけわかりませんね。
自分のブログはどちらで記述されているのかわからない時は、ブログのソースを見てみましょう。一番上に記述があるので、そこで判別できます。Stingerを例に挙げるとこんな記述が。
で、HTML4.01やXHTMLの記述が正しいかどうかチェックしたい場合は、こちらのツールを使います。
URL指定、コピペ、アップロードの3パターンが用意されています。自分のブログをすぐに確認したい時はURLを入力してチェックしてみましょう。
残念ながら当ブログはHTML5で作ってあるので、このツールは使えません。だれかのブログを勝手にチェックしてみます。さて、誰のブログでしょう。
「-98点」となってしまいました。文法的にマズイ点がたくさんあったようです。冒頭でふれたようにブラウザは自動補正してくれるので、見た目で気づかないことが多いんですよね。
思ったとおり表示されていれば問題ないですが、エラーはできるだけ消したほうが致命的な問題を回避できます。表示速度にも若干影響する部分です。
HTML5は4.01後の最新バージョンで、採用するブログが徐々に増えています。いくつかのタグが新たに加わり、廃止されたものもあります。
構造を明確にできるようになった、というのが特徴で、たとえばGoogle先生に『ここはヘッダーです!』『ここが記事本文です!』『ここは本文に直接関係ない部分です!』というのを伝えられます。
このHTML5はまだ正式勧告されていないのでツールもベータ版ですが、こちらでチェックできます。
では、カスタマイズで最も多くいじるであろうCSSのチェックをしてみましょう。
HTMLと同じく、3パターンでチェックできます。詳しい説明は不要ですね。重大なエラーが見つかったらすぐ修正しましょう。
もしテーマを自作した場合は、WordPressが正しく動くかどうかをチェックしておきましょう。
プラグインをインストールしたら、「外観」に「Theme Check」という項目が追加されます。ここから実行するだけですが、その前にデバッグモードにしておかなければなりません。
これでデバッグモードに切り替わりました。テーマチェックをした後は、「false」に戻すのをお忘れなく!
たった一か所の記述ミスで重大なエラーが出ることもあるので、あちこちカスタマイズした後は必ずチェックする習慣をつけておきましょう。
チェックツールで100点になったら検索サイトで上位表示されやすい、ということはありません。でも、表示スピードに影響するほどのエラーならSEOにも関係してくるので注意してください。