京都のホームページ制作会社の有限会社エム・ツーです。レスポンシブウェブデザインを実践しています。

ホームページのチェック

2016年4月23日(火)

ホームページをチェックしていますか?
デザイン、UIの良しあしでなく、htmlが正しく作成されているかどうか検査しましょうということです。
例えば、皆さんが、やっとのことでホームページのコーディングを終え、 「完成した~」と一息ついたとします。 その後、ブラウザチェックなど、主に見た目をチェックされることと思います。 この時、htmlなど文法の記述ミス、間違ったタグの使用、CSSの指定の間違いなど、「完全にこれはアウト」、 という部分がないかどうか、どのようにチェックをされていますか?
すこしまとめてみました。

1. htmlの文法、構文は正しく記述されていますか?

title-img

htmlの文法のチェックをどのようにされていますか。
単純ミスでタグが抜けていたりするので、かならずチェックは必要ですが、コーディングの工程として、 文章をhtmlでマーキングした後、CSSでレイアウトする前にかならずhtmlチェックをされていることと思います。
もし、そのようにされていないとしたら、ちょっと問題あります!
W3C Markup Validation Service validator.w3.org などで、 かならずチェックしてからCSSの制作にとりかかって下さい。

2. CSSの文法、構文は正しく記述されていますか?

CSSのチェックを行います。
CSSは、ブラウザの実装状況など変動激しいので、常に注意必要です。
出来るだけ今のブラウザ普及状況、実装状況を把握しながら、適切な対応必要かと思います。
例えば、すでにモダンブラウザならすべて実装されている機能であるのに、 -moz-や-webkit-などのベンダープレフィックスを付けたままの指定ですましている部分などは修正するべきです。
W3C CSS Validation Service http://jigsaw.w3.org/css-validator/validator.html.ja

3. javascriptの文法、構文は正しく記述されていますか?

動作しない場合には、すぐに現象として現れるので気が付きますが、 意外とわからない部分でエラーが出ていたりします。 チェックするには、 各ブラウザに備え付けの開発ツールのコンソールなどで確認できます。

4. htmlにリンク切れ、間違いURLはありませんか?

いろいろ、プラグインなどもあるかと思いますが、わかり易いのは、 FireFoxブラウザのプラグインで「 LinkChecker」です。表示しているページのリンクを、 色つきで表示してくれます。
また、サイト全体のチェックを行いたい場合、 https://validator.w3.org/checklink が便利です。

  ※ さらにより完成度を目指すのであれば、以下のことにも注意して下さい

5. セマンティックにhtmlを記述していますか?

html5になって、いよいよこのような記述が注目されるようになっています。
htmlは、文章の意味付けにもっとも重点を置くべきで、そのようなhtml作成を行えるように、 html5では、<header> <footer> <navi>など、その意味づけ、構造を明確にするタグが追加されています。
今後ブラウザの進化も考え、そのような対応はますます重要になると思います。

6. 読み込みスピードは最適化されていますか?

googleで、一時、サイトのランキングにこのスピードが影響するような記事を見たような気がしますが、 実際は、あまり影響していないようです。
読み込みスピードもあまり遅いと見た人にはいらいらさせるので注意したいものです。
google で、 PageSpeed Insights で調べてみて下さい。 チェックするサイトがあります。

7. ユーザーエクスペリエンスは最適になされていますか?

ユーザが使いやすいように考慮されているかどうかということをチェックできます。
google PageSpeed Insights でチェックできます。

8. モバイルフレンドリーになっていますか?

googleが提唱するモバイルにやさしいサイトとなっているかどうかをチェックします。
以下のサイトでチェック出来ます。 https://www.google.com/webmasters/tools/mobile-friendly/?hl=ja URL変わるかもしれませんので、ご注意!

9. sitemap.xml は最新のものが設置されていますか?

googleのクローラーが指標として利用しますので、常に最新のものを置いておくのが望ましいです。
作り方は、ネットにいろいろ情報あるかと思います。

10. google ウェブマスター向けガイドラインに沿っていますか?

具体的に、エラーとしては現れないものの十分注意すべきこととして、googleの「ウェブマスター向けガイドライン」を熟読し、 その内容に準拠した作りにすることも大変重要です。

以上、2016年4月22日時点で、まとめてみましたが、多分半年もたたないうちに修正、 あるいは没原稿となるおそれもありますので、読まれた方は十分留意して下さい。
皆さま、良いサイトを作って下さい。

お問い合わせフォーム

075-406-7167

お電話での受付:平日9時~18時

ホームページ制作ウェブシステム制作のご相談は お電話あるいは、お問い合わせフォームよりお気軽にご相談下さい。

ページの先頭へ