HTML/CSS中に書くコメントについて考えてみます。

考えると言っても既に考えた後なので、実際には私がどうやっているかというものです。

HTML中に書くコメントのスタイル(R流)
  1. <div id="r-styles-net" class="Stylish Simple Smart">
  2. <h1>R-STYLES.NET</h1>
  3. <p>Web とその周辺技術の考察 + テンプレートデザイン等</p>
  4. <div class="MainContents">...</div>
  5. </div><!-- /#r-styles-net.Stylish Simple Smart -->

閉じタグの後ろに「/」に続けてCSSのセレクタのように、「#id .Class1 Class2 ...」のようにしています。

開始タグの付近にもコメントを置く人も居るようですが、開始タグと大して変わらないと思うので冗長だと思います。また、異様にスペースを取ってあるのも見かけますが、コメントでそこまでやるのはどうかと思いますね。

CSS中に書くコメントのスタイル(海外では主流?)
  1. /* =分類名
  2. ----------------------------------------------- */

海外の方のブログ等で結構よく見かけるスタイルです。

意図等はよく分かりませんが、割とシンプルで見やすいと思います。

CSS中に書くコメントのスタイル(R流)
  1. /* ------------------------------------------------------------ */
  2. /* CONTENTS STYLE(大分類)
  3. /* ------------------------------------------------------------ */
  4. body {background: #fff; color: #333;}
  5. /* for Page Contents(中分類)
  6. /* ------------------------------------------------------------ */
  7. #pageContents {min-width: 960px;}
  8. /*
  9. ** Content Header(小分類)
  10. */
  11. .ContentHeader {font-size: .85em;}

大分類,中分類用に関してはコメントが入れ子にできない事を逆に利用している感じです。

なんとなく揃っていないと気持ちが悪いという方にオススメです。

一応、こんな感じでコメントを書くようにはしていますが、基本的に私はコメントを書きません。

HTMLでは子要素の行数が多くて要素を把握するのが面倒(インデントしないので)になってくると、閉じタグの後ろにコメントを追記する感じです。しかし、id名やclass名を変更するとコメントまで書き直さないと対応が取れなくなってしまい逆効果なので、メンテナンスの工数も考えると、コメントがなかった方が楽な気もします。

当サイトでは、子要素の行数が結構多い要素もあるのですが、うまくモジュール化しているので、特にコメントが必要ではありません。なので多分コメントは入っていないと思います。入っていたら消し忘れのゴミです。

とりあえず、参考までにということで。