12周年記念パーティ開催! 2024/5/10(金) 19:00

WAI-ARIAを活用したフロントエンド実装

全3回

このシリーズではCSS設計やJavaScriptの実装をしながら、アクセシビリティ強化が行えるWAI-ARIAの仕様を中心に、role属性とaria属性についてくわしく解説します。

最終回 インタラクティブなコンテンツの実装

この記事では開閉するエキスパンダーや、ボタンを押すと対応したパネルが開くUI、Ajaxで後からコンテンツが読み込まれる実装に、どのようにWAI-ARIAを利用することができるのが解説します。

第2回 静的なコンテンツの実装

WAI-ARIAを静的なコンテンツに活用する方法や実装上の注意点を解説します。アイコンやグローバルナビゲーションなど頻出するUIを例に、どのようにrole属性やaria属性を使うかをイメージしてみましょう。

第1回 role属性、aria属性の基礎知識

Webコンテンツアクセシビリティを確保するさまざまな仕様のうち、WebサイトやWebアプリケーションで活用できるrole属性とaria属性について取り上げます。まず、両者の基礎的な知識から解説します。