時間に追われながら、いくつかのサイトを手掛けていると、意外と煩雑になってしまいがちなのがHTMLとCSSの記述。
とくに、CSSで使うためのidやclassなどは、思いつきで適当なものにしてしまうこともよくあります。
ルール作りからなんて時間が取れない場合も多々あるので、自分の中で最低限の共通ルールを決めておくというのもアリでは。
個人的には、
- idは単語の先頭のみ大文字
ex.) IdNameBlock
※キャメルケースと言うらしいです
- idはブロックやカラム単位といった大枠の指定にのみ使う
(JSで利用する場合は別)
- classは基本小文字、単語の場合は最初のみ小文字、もしくはハイフンを使用
※最初のみ小文字はキャメルノーテーションとも言うそうです - CSSでは、idを含めてclassの指定を入れる
複数箇所で同じclass名があっても影響が抑えられるように
ex.) #ContentBlock .title {} - child擬似クラスが可能なら用いる
※IE7,IE8のようなレガシーブラウザは、selectivizr.jsやie7-js等JSで対応 - ブロック毎にタブインデントで見やすくする
(スペースより入力と視認しやすいからってだけですが)
とまあ大雑把ですが、こんな感じでルール決めをしています。
PHPなどの動的処理やスマホ対応も考えて行くなら、HTMLソース部分は少ない記述で抑えたいところです。
この記事へのコメント