HTML5＋JavaScriptのモダンWebアプリをアクセシブルに！

本書は、Web制作者が情報源として利用しているSmashing Magazineで2014年6月に公開された書籍「Apps For All – Coding Accessible Web Applications」の日本語訳版です。 WAI-ARIAとは、HTMLドキュメントに詳細な情報を付加する仕様で、W3Cが2014年に1.0を勧告しています。今後アメリカでの急速な普及が進むにつれ、日本でも「HTML、CSS、JavaScriptなどフロントエンド技術を実装するエンジニアやデザイナーにとって学ぶべきこと」となっていくことが予想されますが、日本語による情報が乏しいのが現状です。そのような状況を鑑み、ウェブアクセシビリティ基盤委員会（WAIC）でJIS X 8341-3の策定に従事する太田良典氏、太田氏と同じく所属するBA（ビジネス・アーキテクツ）で先進な取り組みを行っていることで知られる伊原力也氏を監訳に迎え、日本語版をお届けすることになりました。

ガイドラインの穴埋めに留まらない、知的好奇心をくすぐる内容

今までのWebアクセシビリティ関連書籍にありがちだったWCAG2.0やJIS X 8341-3:2010をベースにした抽象的な解説とは一線を画し、HTML＋CSS＋JavaScriptにおけるキーボード操作やスクリーンリーダー対応における課題をコーディングで解決する、非常に具体的な内容です。問題を解決するための手法として関心を集めていながら日本語の文献が乏しく、なかなか勉強できずに困っているという声が大きく聞かれたWAI-ARIAを解説しています。

推薦コメント：株式会社ミツエーリンクス　取締役CTO　木達一仁様

Webデザインの現場において、HTML5の採用やマルチデバイス対応が必須となりつつある昨今、「アクセシビリティについて学びたいのですが良い書籍を知りませんか?」 そんな質問を受けるたびに回答に苦慮していました。 本書は、そんな私の悩みを解消する福音であり、また今後求められるであろうWebアクセシビリティ対応、特にWAI-ARIAの活用を学ぼうとするすべての人々にとって、すばらしい手引となることでしょう。

• 刊行によせて
• 本書の構成

1章：すべての人のために ― アクセシブルとは何か？

アクセシブルとは何か？　Web とは何か？　そもそものWeb の思想と担保されるべきアクセシビリティとはどういうことなのかについて、本書籍のねらいを交えて解説します。

• 1-1 Web標準
• 1-2 本書の内容
• 1-3 セマンティクスとスクリーンリーダー

2章：ボタンのすべて ― WAI-ARIAの基本

もっとも頻出するコントロールである「ボタン」を題材に、「ロール（役割の定義）」「ステート（状態を伝える）」「プロパティ（情報を提供する）」というWAI-ARIAの基本を解説します。

• 2-1 button要素
• 2-2 ボタンのスタイル
• 2-3 ボタンにラベルをつける

3章：WAI-ARIAの進む道 ― WAI-ARIAの基本思想とルール

WAI-ARIA の全体像について。HTML5 の既存の要素のマークアップにパッチを当てるように記述することで、支援技術向けにもマークアップを拡張できるという基本思想とルールを解説します。

• 3-1 ARIA：平等への情熱
• 3-2 ロールプレイング
• 3-3 初めてのARIAウィジェット
• 3-4 ルールを知る

4章：飛んでいこう ― ページ内に目印をつける「ロール」

ページ内の移動やナビゲーションについて。ページ内に目印をつけて自由に移動することを可能にする「ランドマークロール」を中心に「ロール」を解説します。

• 4-1 分割する
• 4-2 有名なランドマーク
• 4-3 メインイベント
• 4-4 見出しを忘れずに！
• 4-5 リンクをハイジャック

5章：いないいないばあ ― メニューやタブの「ステート」

JavaScript を用いて、「いないいないばあ」と出たり隠れたりするメニューやタブなどの「ステート」について。フォームや各種メニュータイプ別にコードを交えて解説します。

• 5-1 何をどう隠すべきか
• 5-2 ヒントをちょうだい！
• 5-3 プログレッシブな折りたたみ項目
• 5-4 ダブを１つください！

6章：生きてる! 生きてる! ― 「ライブリージョン」や「ダイアログ」

フランケンシュタインの名セリフ「It’s Alive! – 生きてる、生きてる! 」じゃないですが、ユーザーとコンテンツの対話に欠かせない「ライブリージョン」や「ダイアログ」の実装を解説します。

• 6-1 警告！
• 6-2 全体像を見せる
• 6-3 ダイアログ

付録：巻末資料集

• 監訳者が日本語の情報サイトなどを独自に整理してお届けします。
• #a11y
• ブログ
• テスティングツール
• WAI-ARIA
• そして最後に…