Google HTML/CSS Style Guide 抜き書き

http://re-dzine.net/2012/05/google-htmlcss-style-guide/

埋め込みリソースからプロトコル表記(http:,https:)を省略する。

半角スペース2つ分でインデントする。

小文字のみ使用する。alt属性など値が文字列の場合は除く。

文末のスペースを削除する。

エンコードは、UTF-8(BOM無し)を使う。

HTML5を使うこと。

可能な限り適切なHTMLを記述すること。
W3C HTML validator」などの検証ツールを使用。

見出しならhx要素、段落ならp要素、アンカーならa要素など目的に応じたHTML要素を使う

画像には、意味のある代替テキストをalt属性として、動画・オーディオコンテンツにはキャプションを記述する。
装飾的な用途の場合など意味を持たない画像については、代替テキストは記述せずにalt=””とする。

見た目に関するものはスタイルシートに、振る舞いに関するものはスクリプトへ移して記述

可能な限り適切なCSSを記述すること。
CSSバリデーターにバグがある場合や独自の構文を必要としない限りは、ちゃんと書く。
HTML同様W3C CSS validatorなどのツールで検証

IDとクラス名にはちゃんと意味の分かる名前を使う

値が「0」なら単位を省略

小数点の頭の「0」は省略

HEX形式のカラーコードで3文字で表記できるものは3文字にする。

IDやクラス名の別々の単語はハイフンで繋ぐ。

CSSハックは、ユーザーエージェントごとの違いを吸収するためには簡単で魅力的な方法だけど、プロジェクト全体のコードの品質を落とすことにもなるので「最後の手段」として考えること。

プロパティの記述順序

アルファベットの順に記述する。

すべてのプロパティの終端はセミコロンを書くこと。

すべてのプロパティ名の終端にはコロンの後にスペースを入れること。

別々のセレクタとプロパティは改行して書くこと。

「一貫性を持ちましょう。」

コードを編集する前に、あなたは周りのコードを見て、そのスタイルに沿って書きましょう。算術演算子の前後にスペースがあるなら、あなたもそうすべきです。コメントの周りが#で囲まれているなら、そうすべきです。

スタイルガイドラインを持つことのポイントは、コーディングの共通の語彙を持つことです。ここでは、グローバルなスタイルルールを提示しています が、ローカルなルールも重要です。もしあなたが追加したコードのスタイルが、周りの既存のコードと大幅に異なっていると、他人がそのコードを触るとき、リ ズムが崩れてしまいます。このようなことは避けましょう。