コーディングガイドラインとは？
コーディングガイドラインとは、簡単に説明するとコーディングのルールをまとめたものです。
Ｗｅｂサイトを作るときには、1人ではなくチームを組み役割分担する場合がほとんどかと思います。
コーディングガイドラインを決めずに進めていくと、書式が統一されていないので、コードが煩雑になってしまう可能性があります。それが1人でなく複数でコーディングしてゆけばなおのこと。
コーディングガイドラインを決めることによってコーディングに統一性を持たせ、作業の効率化を図ることができ、ミスを防ぐこともできます。
そこで、今回はコーディングガイドラインに入れておきたい項目をご紹介します。
コーディングガイドラインに入れておきたい項目
・対象ブラウザを決める。
対象ブラウザが決まっていない場合、コーディングする人によってはIEだけ、Firefoxだけに対応させたコーディングをしてしまうことがあります。
・文字コード、改行コードの統一
文字化けしないようにするために文字コードを統一しておいたほうがいいです。
・ファイル名やスタイルの命名規則を作る
定数、変数やクラスなどの名前の付け方の基準を決めます。
命名規則を統一しておくと自分以外のメンバーがコーディングする際にわかりやすいです。
・ファビコンの設置
スマホ、ソーシャル用のタグも追加するケースが多いです。
・見出しにはHタグの利用
見出しタグはSEO効果やユーザビリティーを上げるメリットがあるので、見出しにはHタグを使うことが重要です。
・画像にはALT属性を必ずつける
ALT属性は画像に設定されたテキスト情報のことです。画像が表示されない時、画像の代わりに設定したテキストを表示してくれるものです。また、画像にリンクを貼る際、ALTテキストがリンクのアンカーテキストと同じように扱われます。
・404エラーのページは独自で作成する
・トップページへのリンクは必ずつける
・禁止事項
使ってはならない文法などやってほしくない事項を入れます。
例）HTML内にインラインでCSSを記述してはならない、画像パスは絶対パスで記述しては
ならない
コーディングチェックツールの利用
コーディングガイドラインを作っても、ミスやバグはつきもの。htmlやCSSの構文ミスや文法エラーをチェックしてくれるツールをご紹介します。
●Markup Validation Service
信頼性のあるW3Cが公開しているフリーのオンラインツール
HTML5も検証できエラー時にはその対象箇所と解説が表示されます。
●Darty Markup
HTML、CSS、JavaScriptのソースコードをペーストするだけでチェックしてくれる初心者におすすめのオンラインツール
まとめ
コーディングガイドラインは非常に細かくて慣れないうちは難しいと感じるかもしれません。
しかし、一度ルールを決めてしまえば誰がコーディングしても分かりやすく、コードがきれいに揃うのでミスを防ぐこともでき、ある程度納品物の品質が期待できます。
