忍者ブログ

WEB-dブログ.株式会社プライムネットワーク

株式会社プライムネットワークスタッフが、html5やCSS3、phpなどのWEB技術に関することやワードプレスなどのCMSについて学んだことなどを紹介して行きたいと思います。

本日は、少し古い話になるのですが、去年の4月にGoogleが発表したガイドライン「Google HTML/CSS Style Guide」の中のhtmlについて思うことを書きます。

まず、このガイドライン、発表は英語の文章で出されたのですが、一年以上たった今も、日本語に翻訳されていません。原文英語(しかも、テキストばかりなのにやたらと重い!!よほど参照されているのかな?)

英文なんて簡単に読めるものじゃないので、頑張ってくださいよ、グーグル株式会社の日本人!

さてさて、そんなわけで、英文を読めない私は、REFLECTDESIGNさんが翻訳してくれている「Google HTML/CSS Style Guide」を適当に和訳してみたを読ませていただきました。

ガイドラインに思うこと

その中で、私が気になったものだけについて感想を述べます。

プロトコル表記

まずは、「埋め込みリソース」からプロトコル表記を省略するということについてなのですが、これは大丈夫なのか?なんて思ってしまいました。

まずプロトコル表記がなんなのかというと、URLの前につく「http:」「https:」のことで、これって重要じゃないの?なんて思いました。

しかも、これを省略するとかなり不格好なソースになります。

非推奨
<script src="http://www.google.com/js/gweb/analytics/autotrack.js" type="text/javascript">
推奨
<script src="//www.google.com/js/gweb/analytics/autotrack.js" type="text/javascript">

このプロトコルについては詳しくないのでなんとでも言えますが、どうせなら「//」も無くして欲しいものです。

書式ルール

よくソースを見やすくするために「インデント」、つまり字下げをするかと思いますが、これについては、「半角スペースを2つ」で行うのが望ましいそうです。

もともと私は「インデントしない派」で、全てを左寄せで記述していたのですが(1行改行でコント-ロールする派)、どうも新人さんに教える時にこれでは不都合が多く(つまり見づらい・・・)、近年では「タブ」によってインデントしておりました。

でも、そんなにGoogleさんが言うのであれば、今日よりインデントを「半角スペースx2」に変えますよ!

また、htmlタグの要素や属性、属性の値などは全て小文字で記述するとのことですが、これは私もそう思います。

中には全て大文字で記述されているものもありますが、はっきりいって気持ち悪い。ただ、あくまでも個人的な意見なので、大文字で書かれている方はスルーしてください。

メタルール

まぁ、昨今のjQuaryやら各フレームワークのことを考えると、エンコードは「UTF-8」というのは問題ありませんね。

html

この部分が一番驚きです!

まぁドキュメントタイプは推奨されるのが、<!DOCTYPE html>という形式でいいらしいので、かなりシンプルになります。

ただ、驚きはここからです!
なんと「省略できるタグは省略」するとのことで、「ザHTML」とも言うべき「html」「head」「body」が省略できます!(オプション扱いですが・・・)

非推奨
<!DOCTYPE html>
<html>
<head>
<title>いいのか本当に</title>
</head>
<body>
<p>見づらくなるような</p>
</body>
</html>
推奨
<!DOCTYPE html>
<title>いいのか本当に</title>
<p>見づらくなるような

んん、随分シンプルになって文字入力の手間が増えるけど、ちょっと見づらくない?

特に他人の書いたソースを分析するときに物凄く面倒くさいことになりそう。
Firebugや開発ツールなど上手く機能するのかな?

XHTMLがかなり厳格だったため、どっぷりと浸かってきた私としては、まぁ、気持ち悪い。
とはいえ、スマホなどの普及によりデータの軽減は必須となってきているので、この新たな取り組みは、いいことなのかもしれませんね。

ただし、注意しなければならないのは、あくまでもGoogleの見解であって、W3Cの勧告ではないため、現段階では自分で納得出来る部分だけを採用すればいいのかなと思っています。

とはいえ、検索結果を牛耳っているGoogleですから、このガイドラインを守るとSEO的な効果はあがるのでしょうかね?

このエントリーをはてなブックマークに追加
PR
■ この記事にコメントする
お名前
タイトル
文字色
URL
コメント
パスワード
Vodafone絵文字 i-mode絵文字 Ezweb絵文字
■ コメント一覧
レスポンシブデザインにおける画像の取り扱いについて HOME ロングシャドウは気合で作れるけれど・・・
Copyright © WEB-dブログ.株式会社プライムネットワーク All Rights Reserved
忍者ブログ / [PR]