Webアクセシビリティが今熱い!基本からしっかりと学びたい、より深く身につけたい人にオススメできる本
Post on:2015年3月27日
Webサイトやアプリにおけるアクセシビリティについて学んでみたい、そして身につけたい、と考えている人は多いと思います。
「WAI-ARIA」「Web標準」「セマンティック」など、アクセシビリティに関する用語の解説レベルだけでなく、実務ですぐに使える具体的な方法も数多く掲載されたオススメの本を紹介します。
アクセシビリティってこういうことだったんだ!と分かる一冊です。

本書はSmashing Magazineのアクセシビリティ担当:ヘイドン・ピカリング著「Apps For All(2014)」の訳書で、翻訳はBAの太田さんと伊原さんが監修したものです。
BAの二人は、元同僚。
僕が知る中ではアクセシビリティといえば太田さん、太田さんの存在自体がアクセシブルと言ってもいいかもしれません。
そんな造詣が深い太田さんと伊原さん二人の監訳は訳書にありがちなぎこちない日本語ではなく、制作現場の生きた言葉で非常に分かりやすかったです。
本書は、本日発売!
ちょっとマニアックな本だと思うので、大きな書店に行かないとないかも。
紙面のキャプチャで、中身を少しだけご紹介。

本書はコーダーだけに限らず、アクセシビリティに興味があるWeb制作者、そして全く興味がないWeb制作者にもぜひ手にとって一読して欲しい本です。
基本からやさしく解説されており、Webにおけるアクセシビリティとはどういうことなのかがよく分かります。

HTMLやCSSの高度な知識は必要ありません、基本的なことを理解していればOK。

こんなボタンは実際にはWebページにはありませんが、こういったユーモラスを交えながら、アクセシビリティを紐解いていきます。

ボタンを実装する時は、button要素?div要素?それとも.buttonってつければいい?

普段使用しているHTML要素もその意味・役割を理解して実装すると、マークアップするのがより楽しくなります。

section要素をレイアウトをするために使っている人は注意!

誰かが書いたコードを修正する事ってありますよね。しかもh2要素が文字を大きくするために使われてる! これは困った。

Webページでよく利用するUIのアクセシビリティにおける問題点や改善点も豊富なサンプルが掲載されています。

普段使用しているコードをこの機会に見直してみるのもいいかもしれませんね。
コーディングWebアクセシビリティの目次
-
- すべての人のために
- Web標準
- 本書の内容
- セマンティクスとスクリーンリーダー
-
- ボタンのすべて
- <button>要素
- ボタンのスタイル
- ボタンにラベルをつける
-
- WAI-ARIAの進む道
- ARIA: 平等への情熱
- ロールプレイング
- 初めてのARIAウィジェット
- ルールを知る
-
- 飛んでいこう
- 分割する
- 有名なランドマーク
- メインイベント
- 見出しを忘れずに!
- リンクをハイジャック
-
- いないいないばぁ
- 何をどう隠すべきか
- ヒントをちょうだい!
- プログレッシブな折りたたみ項目
- タブを1つください!
-
- 生きてる!生きてる!
- 警告!
- 全体像を見せる
- ダイアログ
-
- 巻末資料
- #a11y
- ブログ
- テスティングツール
- WAI-ARIA
- そして最後に、、、
アクセシビリティは気になるけど、どこから手をつけていいか分からないという人に特にオススメです。アクセシブルとはどういうことなのか? どうしてWebに必要なのか? 誰が幸せになるのか? アクセシビリティに関する認識がきっと変わりますよ。
献本の御礼
最後に、献本いただいたボーンデジタルの担当者さまに御礼申し上げます。
当サイトでは随時、献本を受け付けています。
お問い合わせは下記よりお願いいたします。
sponsors