An accordion is a vertically stacked set of interactive headings that each contain a title, content snippet, or thumbnail representing a section of content.
![Patterns](https://cdn-ak-scissors.b.st-hatena.com/image/square/8b1ce7052310efd54160feb9642679ae134227e2/height=288;version=1;width=512/https%3A%2F%2Fwww.w3.org%2FWAI%2Fassets%2Fimages%2Fsocial-sharing-default.jpg)
HTMLのマークアップでアクセシビリティーを向上させる方法として、WAI-ARIA(ウェイ・アリア)があります。HTML要素の属性に aria-* を追加することで音声読み上げの精度を高められます。 WAI-ARIAの特徴として、状態を示す属性が存在します。たとえば、aria-selected 属性。名前の通り、該当のHTML要素が選択状態であるかを示すことができます。ウェブサイトのUIパーツにはタブやアコーディオンなど動的なものがあります。こういった動的なパーツの「状態」はHTMLのマークアップだけでは示すことが難しく、JavaScriptの実装が不可欠です。 ▲本記事で解説するサンプル。タブの切り替えによって、aria-selected属性を動的に切り替えている。JavaScriptの制御が必要である。 よく利用される例としてタブ型のユーザーインターフェイスを題材とし、流行りのJSライ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く