Web ページ教育ネットワークに関するこれまでのチュートリアルでは、Web ページの HTML ファイルをセマンティックにすることが何度も強調されてきました。 HTML タグまたは XHTML タグは、外観に基づいて選択するのではなく、Web ページの HTML ドキュメントの構造に基づいて最適な HTML タグまたは XHTML タグを選択する必要があります。 P タグは、改行効果を得るために使用するのではなく、段落を定義するために使用します。 h1 ～ h6 タグは、テキスト サイズや太字効果を実現するために使用するのではなく、見出しをマークするために使用します。
たとえば、タイトルの場合、h1 を使用して定義できます。
<h1>ここに記事のタイトル テキストを入力します</h1>
他の方法で定義する代わりに、次のようにします。
<p style="font-size:16px; font-weight:bold;">ここに記事のタイトル テキストを入力します</p>
Web Teaching Network の以前の記事では、XHTML1.0 で許可されているすべてのタグをリストしましたが、実際には選択できる要素タグが非常に少ないこともわかります。しかし、これらの洗練された要素マークにも、より明確な意味があることも明確に認識しています。タグ付けする適切な要素が本当に見つからない場合は、汎用の div タグと spam タグを使用できます。
ページ内での div タグとspan タグの使用は新しい問題であり、私たちはそれらを使いすぎる傾向があります。 div を必要かつ合理的に使用すると、ドキュメントの構造を大幅に強化できます。 HTML ドキュメントを見て、div と Span が多数あることがわかった場合は、問題を別の観点から見る必要があります。不正行為はないか?それらに代わるより良いマーカーはありますか? h1 がマークされたコンテンツをより適切に表現できる場合は、それを定義するために p または span を放棄する必要があります。
おそらくこれは一対の矛盾であり、それらを正しく使用する方法を理解するのが難しいか、あるいは明確な答えがまったく得られないのかもしれません。ただし、明確にする必要があることが 1 つあります。文書に明確な論理構造を持たせ、スタイルを適用しやすくする必要があります。 div は単なるコンテナ、またはドキュメントの「一部」と考えることができます。コンテナを多用しすぎますが、これは賢明なパターンではありません。また、コンテナが適切かつ適切な位置にあると、文書全体が整理されて見えるようになります。
次のコードはより合理的で効果的です。
| 引用した内容は以下の通りです。 <div id="ヘッダー"> |