コーディングガイドライン
当サイト作成においてHTML・CSSを書くときのガイドラインです(覚書)。
あくまでも「自分のための」ガイドラインであり、一般的なサイト作成においてこれに従わなければならないものではありません。
また、配布テンプレートについては別のガイドラインに従って作成しています。
HTML
DTDに関わらず、文法的に正しい記述を心がける。また、HTMLでは文書の構造を示すことを目的とし、見た目の装飾に関わることを記述しない。
宣言・文字コード
- 文字コードはUTF-8
- IEに対してはXML宣言を省略
- DTDはXHTML 1.0 Transitional
head
- 基本的にはmeta、link、script、titleの順に記述
- 最初にmeta要素で文字コードを明示
- link要素によるナビゲーションを活用
- titleは「ページ名 - サイト名」とする
body以下
- body要素にはコンテンツごとに任意のclass属性を付加
- グループ分けのためのブロックには以下のclass属性を付加
- ※全体包括ブロックのみ例外 : id="container"
- .banner : サイトロゴなどのブロック
- .navigation : サイト内のメニューリンクブロック
- .contents : 内容包括ブロック
- .main : 内容のうちメインになるブロック
- .sub : 内容のうちサブになるブロック
- .contentinfo : 著作権や更新日など、フッター的なブロック
- 非推奨要素は使わない
id・class命名ルール
- idは一意なもの、或いはアンカーとして記述。classは分類
- 見た目に依存した名前は極力避ける
CSS
- 文字コードは基本的にUTF-8
- ブラウザのデフォルトスタイルをリセットする「default.css」をインポートしたものをHTMLファイルからリンクし呼び出す
- ブラウザによって未対応のプロパティ・独自拡張は適用されなくても閲覧に支障が生じないように使う
セットの記述方法
- セレクタをまとめてかく場合は
,のあとに半角スペース {の前に半角スペース- 1プロパティ1行、
:のあとに半角スペース、行末には;を必ずつける
記述順序
- 要素、グループ分けブロック別、ページ固有
- プロパティの順序はCSS2 Specificationに準ずる