HTML5 セマンティック要素
セマンティック要素の紹介
HTML5 標準では、種類ごとに分けると、ページ構造、テキスト コンテンツ、フォームなど、多くの新しいセマンティック要素が追加されています。
そしてここでは主にページ構造の新しい要素を紹介します。
セマンティック要素とは
簡単に言うと、セマンティック要素とは要素(タグ)に何らかの意味を与えることであり、要素の名前はその要素が表現したい意味です。
たとえば、
特徴:
①保守が簡単: セマンティック要素を使用すると、より明確なページ構造情報が得られ、後でページを保守しやすくなります。コードを再度確認する必要はありません。div を見つけてから、特定の ClassName を見つけます。
②アクセシビリティ: スクリーン リーダーやその他のアクセシビリティ ツールを支援します。
③ 検索エンジンの最適化に適しています: 検索ロボットは、HTML5 のいくつかのセマンティック要素をチェックした後、インデックスを作成したページに関する情報を収集できます。
HTML5 セマンティック要素
<記事>記事>
<ヘッダー>
Internet Explorer 9
Windows Internet Explorer 9 (略称 IE9) は、2011 年 3 月 14 日 21:00 にリリースされました
ブラウザの最小バージョン: IE 9、Chrome 5
使用方法:
①Webページのヘッダーをマークするために使用される場合、ロゴ、ナビゲーション、検索バーなどの情報を含めることができます。
②コンテンツのタイトルをマークするために使用する場合、タイトルに他の情報が含まれる場合にのみ、
を使用してタイトルをマークします。
: Web ページのメインコンテンツを定義します。
ブラウザの最小バージョン: IE はサポートされていません、Chrome 35
: Web ページまたは記事のフッター領域を定義します。著作権、ファイリング、その他のコンテンツを含めることができます。
<フッター>フッター>
投稿者: Hege Refsnes
ブラウザの最小バージョン: IE 9、Chrome 5
使用方法:
①Webページのフッターとして使用する場合、通常、Webサイトの著作権、法的制限、リンクなどが含まれます。
②記事のフッターとして使用される場合、通常、著者に関する情報が含まれます。
: ページナビゲーションリンクをマークします。複数のハイパーリンクを含むゾーン。
<ナビ>
ブラウザの最小バージョン: IE 9、Chrome 5
使用説明: