ロゴとグローバルナビのヘッダー。狭い画面ではハンバーガーメニューに切り替わり、aria-expanded とキーボード操作にも対応しています。
レイアウト前後リンクとページ番号のページネーション。現在地は aria-current、省略記号は読み上げ対象外にしています。JavaScript不要。
ナビゲーションdetails / summary だけで動くFAQアコーディオン。schema.org の FAQPage に対応し、JavaScriptは一切使っていません。
コンテンツネイティブの <dialog> を使ったモーダル。フォーカストラップと背面スクロールの抑制はブラウザ任せなので、JavaScriptは開閉の数行だけで済みます。
UIパーツschema.org の BreadcrumbList に対応したパンくずリスト。区切り文字・色・余白はCSS変数で変更でき、折り返しと横スクロールの2パターンを用意しています。
ナビゲーション