本当に使えるコーディングチェックサイト厳選3選

コーディングの正確性について、不安を持つWeb制作担当者は少なくないのではないでしょうか。
コーディング後に、ミスが発覚すると修正作業のために時間を大幅にロスしてしまう可能性があります。

できるだけミスを防ぐためにも、適切なコーディングができているかどうかをチェックできるツールはストックしておいた方がいいでしょう。

今回は、コーディングを担当しているものの自信が無いという方にオススメのコーディングチェックツールをご紹介します。

コーディングで気を付けなくてはいけないこと

制作するにあたって、コーディングレベルがありますが、HTML・CSSを利用する際に気を付けなくてはいけないことは単純に「正確に動作し、ブラウザによってサイト崩れが発生しない」ことなのではないでしょうか。

例えば、「リンクページをクリックしたが、正確にページが表示されない」や「PCでサイトを見たときには正常に動くのにスマホで見たらレイアウトが崩れた」などのヒューマンエラーはよくあることであっても、制作段階で未然に防ぐ事が重要です。

コーディングチェックサイト3選

1.Another HTML-lint gateway

http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

オンライン上で(X)HTMLの文法をチェックしてくれるツールです。
チェックした文法が点数化されるので、上達度を測ることもできます。

但し、チェックに関して極めて厳しい警告も出されますが、文法上で修正の必要・不必要を見極める情報も持っていたほうがいいでしょう。

2.Markup Validation Service

http://validator.w3.org/

「Markup Validation Service」は、コーダーの方であれば一度は聞いたことがあるのではないでしょうか。
主体がW3Cであることから。信頼して使用されている方も多いかと思います。

HTML5も検証でき、常に更新を続けているので多様のパターンがチェックでき、HTML文書が(X)HTML標準に準じているかをチェックできるオンラインツールです。
検証方法も3パターンあり、URLのダイレクト入力やファイルのアップロード、コードの直接入力があるので、そのときのチェック量やファイル状況によって使い分け可能です。

エラー時はコード該当箇所と解説が表示されるので、コーディングのスキルアップツールとしても使用できます。

3.Dirty Markup

http://dirtymarkup.com/

Dirty Markupは、HTML文法だけでなくCSS、JavaScriptの3タイプのソースを選択箇所にコードをペーストするだけでチェックしてくれるオンラインチェックツールです。

インターフェイスもわかりやすく、コーディング初心者の方に使いやすいシンプルなツールです。ホームページを公開し、通常通り反映しているがソースコードを調べてみたい、という時に便利でしょう。