Skip to main content

HTML5 SECTION要素を使用するタイミング

Leap Motion SDK (六月 2026)

Leap Motion SDK (六月 2026)
Anonim

新しいHTML5

セクション 要素が多少混乱する可能性があります。 HTML5より前にHTML文書を作成していた場合は、要素を使用してページ内の構造分割を作成し、ページでスタイルを変更する可能性があります。だから、単にあなたの既存の

DIV 要素

セクション 要素。しかし、これは技術的に間違っています。だからあなたが

DIV 要素

セクション どのように正しく使用するのですか?

SECTION要素は意味要素です

最初に理解しなければならないことは、

セクション 要素は意味要素です。これは、ユーザエージェントと人間の両方に、囲まれたコンテンツの内容、具体的にはドキュメントのセクションに関する意味を提供することを意味します。

これは非常に一般的な意味論的記述のように見えるかもしれませんが、それはそうであるからです。他のHTML5要素があります。これは、コンテンツをより意味的に区別して提供しています。

セクション 素子:

  • 記事

  • ASIDE

  • NAV

SECTION要素を使用する場合

使用

記事 コンテンツがサイトの独立した部分であり、記事やブログの投稿のように独立してシンジケートすることができます。使用

ASIDE 要素が、サイドバー、注釈、脚注、または関連付けられたサイト情報など、ページのコンテンツまたはサイト自体のいずれかに接線方向に関連している場合、要素となります。使用

NAV ナビゲーションであるコンテンツの要素。

セクション 要素は一般的な意味要素です。他のセマンティックコンテナ要素のどれも適切でないときに使用します。ドキュメントの一部を結合して別の単位にすることができます。これらの単位は、何らかの形で関連するものとして記述できます。セクション内の要素を1つまたは2つの文で記述できない場合は、その要素を使用しないでください。

代わりに、

DIV 素子。ザ

DIV HTML5の要素は非意味的なコンテナ要素です。結合しようとしているコンテンツがセマンティックな意味を持ちませんが、スタイリングのために結合する必要がある場合は、

DIV 要素は使用するのに適切な要素です。

SECTION要素のしくみ

ドキュメントのセクションは記事の外部コンテナとして表示され、

ASIDE 要素。また、コンテンツの一部ではないコンテンツを含めることもできます

記事 または

ASIDE。 A

セクション 要素は、

記事,

NAV、または

ASIDE。セクションをネストして、1つのコンテンツグループが、記事のセクションまたはページ全体である別のコンテンツグループのセクションであることを示すこともできます。

セクション 要素は、ドキュメントのアウトライン内にアイテムを作成します。それで、あなたは常にヘッダー要素(

H1 を通して

H6)をセクションの一部として使用します。あなたがセクションのタイトルを思いつくことができない場合は、再び

DIV 要素がおそらくより適切です。セクションのタイトルをページに表示したくない場合は、CSSでいつでもマスクすることができます。

SECTION要素を使用しない場合

より具体的なセマンティック要素を先に使用する上のアドバイス以外に、あなたが使用するべきではない明確な領域があります

セクション 要素:スタイルのみ。

言い換えれば、その場所に要素を配置する唯一の理由がCSSスタイルのプロパティをアタッチする場合は、

セクション 素子。意味要素を探したり、

DIV 代わりに要素を使用します。

最終的にはそれは重要ではない

意味論的なHTMLを書くことの難しさは、私にとって意味論的なものはあなたにとってまったくナンセンスかもしれないということです。あなたがあなたが

セクション 要素を使用する必要があります。ほとんどのユーザエージェントは気にしないで、ページを表示します。

DIV または

セクション.

意味的に正しいと思うデザイナーにとっては、

セクション 要素が意味的に有効な方法で重要です。ページを機能させるだけのデザイナーにとってはそれほど重要ではありません。私たちは、意味的に有効なHTMLを書くことは良い方法であり、ページの未来を守っています。しかし、結局それはあなた次第です。