HTMLコードの書き方に関するいくつかの提案のまとめ

リソースファイルのプロトコルを省略する

画像、メディアファイル、スタイル、スクリプトのURL（http:、https:）からプロトコルを省略し、リソースファイルにページURLのプロトコルを継承させることをお勧めします。これにより、コンテンツの取り違えを防ぐだけでなく、ページのサイズを小さくすることができます。例えば、JavaScriptファイルへの参照は、以下のような書き方があります。

h4、h5、h6タグはなぜほとんど使われないのですか？

タイトルタグにはh1からh6まであり、私たちはh1、h2、h3は使いますが、h4、h5、h6はほとんど使いません。

適度にセマンティックで、ベアボーン（CSSレイアウトなし）のサイトでは、タイトルタグはセマンティックに加え、何らかのスタイル的な効果も持っているでしょう。しかし、CSSが普及した現在では、h1やh6を使ってもそれほど大きな違いはなく、見た目はとにかく応用が効くようになっています。

より強力な機能を持つtitleタグとして、title要素はページ内でウェイトの高いキーワードを意味するため、h1、h2、h3はキーワードのウェイト付けに頻繁に使用されます。h4、h5、h6はstrongやemほど強力ではないので、ほとんど使われることはない。そのオーソリティレベルは以下のように推測される。

h1 > h2 > h3 > strong > em > h4 > h5 > h6

thead、tbody、tfootはいつ使う？

私はもともと、theadはth;のようにテーブルのタイトルセルのテーブルヘッダーとして使用し、tbodyはテーブルの内容、tfootはテーブルの説明文に使用するものだと思っていました。私の理解は正しくなく、これらのタグは本当は必要ないのです。

なぜなら、ブラウザは通常、表示を開始する前にテーブル全体をダウンロードする必要があり、テーブルベースのレイアウトの時代にはユーザーの読解に影響を与えるからです。そこで、これらのタグは、テーブルを複数のテーブルセクションに分割し、ダウンロードが完了した時点で表示できるようにするために使用されます。また、長い表を印刷するときに、ヘッダーやフッターを各ページに表示させることができます。

/{br オプションタグの省略

Dreamwaveを使ったことがある人は覚えていると思いますが、HTMLファイルを作成するとき、デフォルトのコードは次のようになっています。

タイトルや外部CSS、JavaScriptの参照をhead領域に、ページに表示されるコンテンツをbodyに配置することになるが、実はhtml、head、bodyはすべて省略可能なタグである。

これらのオプションタグを削除すると、見た目は変になりますが、ページは問題なく表示され、W3Cの検査もパスします。私のブログではすでにこの方法をとっています。ただし、XHTMLでページを書きたい場合は、宣言として以下のコードが必要なので、htmlタグは残しておくこと。

bタグとiタグ

bタグとiタグは、uタグと同じように、W3Cによって「推奨されないタグ」に分類される運命にあると多くの人が思っていました。しかし、HTML5の仕様では、この2つのタグはまだ推奨されているのです。私はこのことに気づいていて、友人と議論したこともあります。しかし、HTML5ではどのように定義されているのか、まったく理解できなかったのです。

hrタグ

hrは線であり、コンテンツを区切る横線である。hrは、CSSの処理能力からすると無駄な線を引く、ダサいものだと思っていた。実際、hrは意味的にはテキストを区切る線であり、テキストを文脈から完全に切り離し、関連性のないものにするものである。

多くのブログ記事に登場する分割線のようなものですが、hrは意味的には同じで、クローラーにも理解できるようになっています。

なぜ、タグをボタンとして使うことに慣れたのか？

input type="button "でないのは、IEの下位バージョンではホバー効果が表示されないためと理解できる。しかし、なぜspanではなく、aタグなのでしょうか？aタグはhrefなしで、ボタンにするのが正しいのでしょうか？まだわかってません、昔はリフレクみたいな感じでした。 {反射のようなものです。

あとがき

GoogleのHTML/CSSスタイルガイドは、推奨コードを短く簡潔にまとめたマニュアルで、便利ですが、調子に乗らないようにご注意ください。例えば、スペース2つをインデントとして使用することが推奨されていますが、多くのチームでは実現不可能かもしれません、私たちのものはまだタブです。

マニュアルに書かれているHTMLの推奨はHTML5に特化したものが多いですが、これはXHTMLスタイルではなくHTMLスタイルであり、実際にはコードを節約するために弱体化している箇所も多いので、トレードオフの判断は慎重に行うべきでしょう。