HTML 5の意味要素

6075 ワード

HTML5 Semantic element?


意味要素とは、それ自体に意味を持つ要素を指す.すなわち、要素は、ブラウザおよび開発者に使用の意味を明確に伝えることができることを意味する.
非構文要素div、span要素などについては、これらの要素がどのような内容であるかを知るには、内部コードを表示する必要があります.それに比べてform、table、imgなどの要素は、コードを見なくても名前を見ればわかります.
HTMLで作成されたドキュメントには、コンピュータで解釈できるメタデータと人間が使用する自然言語の文が混在しています.次のコードでは、1行目と2行目はブラウザで同じ外観です.これは、h 1ラベルのデフォルトスタイルが1行目と同じであるためです.
<font size="6"><b>Hello</b></font>
<h1>Hello</h1>
しかし、最初の行の要素は意味的に何の意味もありません.つまり、意図がはっきりしない.開発者は,表現したい要素の意味を明確に示さず,フォントサイズとフォントを指定したメタデータをブラウザに通知する.しかし,2行目の要素はヘッダ(タイトル)に最上位の意味を含んでいるため,開発者が意図する要素の意味が明確に示されている.これにより、コードの可読性が向上し、メンテナンスが容易になります.
HTML要素は非意味要素、意味要素に分けられます.
non-semantic 요소
div, span 등이 있으며 이들 태그는 content에 대하여 어떤 설명도 하지 않는다.

semantic 요소
form, table, img 등이 있으며 이들 태그는 content의 의미를 명확히 설명한다,
HTML 5に新しく追加されたシンボルマークを次に示します.

シンボル要素を使用する理由


シンボル要素を追加する前に、HTML 4は通常div要素を使用してレイアウトを作成します.
<div id="header"><h2>Header 영역</h2></div>
<div id="nav"><h2>Nav 영역</h2></div>
<div id="section"><p>Section 영역</p></div>
<div id="footer"><h2>Footer 영역</h2></div>
これにより、検索エンジンは正しいWebコンテンツを認識できません.HTML 5要素により、作業がより容易になります.W 3 Cは、都市ネットワークがアプリケーション、企業、コミュニティでデータを共有し、再利用できることを示している.
Reference
  • 意味網とは何ですか。
  • HTML 5時系列要素
  • Poiemaweb