絶対に避けるべきHTMLタグの使い方、12選


この記事はSMASHING HUBに掲載された 12 Evil HTML Tag Mistakes You Really Should Avoid の内容を日本語訳したものです。

HTMLを書く仕事をしている人たちはHTMLポリシーについて熟考し、気をつけなければならない。ここでは、コード内でよくある小さなミスを取り上げ、それぞれのHTMLタグのミスに名前をつけました。これから取り上げるようなミスを避けたいのであれば、この記事はあなたを助けることになります。以下で、コーディング中に犯しがちなもの、無視されがちなものについて解決策とともに、議論しています。これらのヒント(チップス)はHTMLを書く仕事をしている全ての人たちにとって役立つものになるでしょう。

目次

ミス1:HTMLタグの間違ったネスト

HTMLタグの適切な閉じ方は重要です。HTMLタグは上から書いた順とは逆の順番で閉じていかなければなりません。初心者は通常、適切な終了タグについてチェックすることを怠らないでください。バリデーションエラーが出てしまい、適切なスタイルが適用されないことがあります。なので、以下のミスには注意してください。

間違った使い方:


正しい使い方:


ミス2:リストの不適切な使い方

OLタグ、LIタグはいつも、ウェブページの様々な用途で使用するアイテムを並べるために使われるべきです。これによって他の多くの利点を得ることが出来ます。リストタグは適切な方法で情報を並べることにとても役立ちます。コード内で、強制的な改行を避けたほうがよりよいです。(強制改行とは長い1文を見栄えをよくするために文の途中で改行すること)

また、サーチエンジンはリストタグを認識し、間違った使い方をしたサイトの順位を下げ、標準的な使い方をしているサイト順位を上げます。

ミス3:フォームタグの不適切な使い方

私たちの多くはフォームタグとテーブルタグを同時に使うときに困惑します。多くはテーブルタグを最初に置きます。テーブルタグ、フォームタグ、どちらを最初に置くのか迷うのです。以下が正しい方法です。

間違った使い方:

……..

正しい使い方:

…….

ミス4:インライン要素内にブロック要素を使う

使っているHTMLのほとんどは、インライン要素かアウトライン要素のどれかに当てはまることを知っているだろう。プログラマーによって作られたこれらのタグはデフォルトではブロック要素かインライン要素として作られた。ブロック要素は、ドキュメント内の区分と同様にパラグラフを含みます。それに対してインライン要素はブロック要素の内部に置かれます。この構造はドキュメントの構造と合っています。したがって、インライン要素を使うとき、必ずブロック要素の内側に置き、それ以外の場所に置いてはいけない。

いくつかのブロック要素:

,

,

,