【デザイン基礎|実務向け】実務で差がつく!
未分類
1. 導入:なぜ今、
の「コンテキスト」が重要なのか
Web制作において、
要素は単に「ページ上部のデザインエリア」と捉えられがちです。しかし、アクセシビリティやSEOを考慮した現代のフロントエンド開発において、
の役割は「配置場所」ではなく「コンテキスト(文脈)」によって大きく変化します。この特性を理解していないと、スクリーンリーダー利用者に誤った構造を伝えてしまうリスクがあります。本記事では、実務で迷わない
の正しいマークアップ手法を解説します。
2. 基礎知識:
の「2つの顔」
要素は、配置される場所によってブラウザや支援技術からの解釈が異なります。
サイト全体のヘッダー(Banner)
直下に配置された
は、Webサイトの「バナー(banner)」ランドマークとして認識されます。ロゴ、サイト名、グローバルナビゲーションなど、全ページ共通の導入部を指します。
セクション内のヘッダー(Generic)
や
などの区分要素内に配置された
は、そのセクション固有の「導入部」として扱われます。この場合、ランドマーク(banner)としての役割は失われ、単なる「グループ化」の役割を担います。
3. 実装/解決策:役割に応じたマークアップ
実務で最も注意すべきは「入れ子」の制限です。
・
の中に別の
や
よりよいエクスペリエンスを提供するため、当ウェブサイトでは Cookie を使用しています。引き続き閲覧する場合、Cookie の使用を承諾したものとみなされます。
タイトルとURLをコピーしました
コメント