Googleによる「Google HTML/CSS Style Guide」

先日、Googleから「Google HTML/CSS Style Guide」が発表されました。
http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml

コーディングの作法について、Google側が解説するような内容で、ほとんどが基本的なものだったのですが、その中で興味深い点がいくつかありました。

■■■■■■■■■

1.httpやhttpsのどちらでもアクセス出来る場合、プロトコル名を削除する

http、httpsのどちらでもアクセス可能な場合というのが条件ですが、画像やCSS、Javascriptファイルのパスからhttp、httpsのプロトコル名を削除します。

↑こうじゃなくて、↓こうする

こうする事で、複数のファイルの混在やデータの圧縮が見込めるそうですが、先頭のプロトコルが無くても大丈夫なんですね。初めて知りました。

      1. +

2.閉じタグを省略する

HTML5から、終了タグやタグ自体が無くても良いタグ(日本語がおかしいですね。。。)があるのですが、ファイルサイズの縮小と可読性の向上のため、省略可能なタグは書かないようにします。




Spending money, spending bytes


Sic.



↑このHTMLを、↓こうする


Saving money, saving bytes

Qed.

確かに、このようなHTMLでもロボットはきちんと読んでくれると思います。とは言え、HTMLを作るのは人間なので、現時点でこれを導入するのは無理でしょうね。Google側でも、optionalと書いていますし。

      1. +

3.CSSで使われる単語同士を、ハイフンでつなぐ

CSSの名前に複数の単語を用いる場合、それらをハイフンでつなぐようにします。

.demoimage {}
.error_status {}

↑こうじゃなくて、↓こうする

#video-id {}
.ads-sample {}

これは個人の慣れの部分もあると思うのですが、二番目以降の単語の頭文字を大文字にする人もいますし、ファイルサイズという点からは、ハイフンが無い分、そちらの方が優れていると言える気がします。ただ、明確にどれが良いとは言えないので、個人的には読みやすければ、どのパターンでも良い気がします。
ただ、色々な書式が混在するのは、勘弁してもらいたいです。