試験公開中

このエントリーをはてなブックマークに追加

デザイニングWebアクセシビリティ

ボーンデジタル

2,500円+税

アクセシブルなサイトを作ることは特別なことではなく、「ユーザー体験の土台であり、良好なユーザー体験を作るためには欠かせないものなのです」。アクセシブルなサイト構築を実践するための必読書、待望の電子書籍版。

関連サイト

本書の関連ページが用意されています。

関連書である『コーディングWebアクセシビリティ』も好評発売中です。

コーディングWebアクセシビリティ
ヘイドン・ピカリング(著), 太田良典(監訳), 伊原力也(監訳), Bスプラウト(翻訳)
ボーンデジタル
発行日: 2017-03-30
対応フォーマット: PDF, EPUB

内容紹介

著者コメント(本書「電子書籍版の刊行によせて」より抜粋)

このたびようやく、電子書籍版をお届けできることになりました。電子書籍化の作業を行う中で改めて確認できたのは、本書の内容がWebだけでなく、電子書籍にも適用できるということです。電子書籍フォーマットのひとつであるEPUBは、HTML、CSS、SVGなどをパッケージしたものであり、Webコンテンツとほぼ同じように考えることができます。実際、策定されつつあるEPUBのアクセシビリティガイドラインもWCAG 2.0を参照しており、WCAG 2.0の達成基準を満たすように求めています。本書の内容の全てがそのままEPUBへ適用できるわけではありませんが、制作プロセスといくつかの項目は、EPUBのアクセシビリティを向上させるヒントになるでしょう。

「誰でもどんなデバイスからでも情報や機能を利用できること=アクセシビリティ」が重要

この書籍は、ともすれば「規格や達成基準をどう理解し、サイトやサービスを適合させるか」という実装面に目が向きがちだったアクセシビリティ関連の従来の書籍と一線を画します。「特別な取り組みをせず、普通に戦略・要件策定→情報設計→ビジュアルデザイン→実装・コーディングを行うことが達成基準を満たすことにつながる」ということを、具体的に制作を進める中でつまづく疑問(Q)と解決手段(A)を通じて解説します。書かれている内容は、良質なユーザー体験を生むためのノウハウです。これまでWebアクセシビリティに足が遠のきがちだった方にもぜひお読みいただきたいと思っています。

解決手段は実在するサイト事例をもとに解説

アクセシビリティのさまざまな誤解を解くには、納品ベースのクオリティで、どのような解決手段があるのか具体的に説明することが必要です。本書では、絵にしないとわかりにくいようなモノを除き、200以上の実例を引用して解説しています。その中には、著者の2人が所属するBA(ビジネス・アーキテクツ)での先進な取り組みも数多く含まれています。

  • 本書の解説は査読協力の方々(植木 真、木達一仁、徳丸 浩、中根雅文、羽山祥樹、守谷絵美:以上敬称略)によるご指導を経て、執筆・編集しております。
  • 電子書籍版のアクセシビリティについても、査読協力の方々(伊敷政英、ただただし、中根雅文:以上敬称略)にチェックいただきました。
  • 電子書籍版は、本書初版第2刷の内容をもとに制作いたしました。

書誌情報

  • 著者: 太田良典, 伊原力也
  • 発行日: (紙書籍版発行日: 2015-07-24)
  • 最終更新日: 2016-12-22
  • バージョン: 1.0.0
  • ページ数: 297ページ(PDF版換算)
  • 対応フォーマット: PDF, EPUB
  • 出版社: ボーンデジタル

対象読者

Web制作に関わる人(Webディレクター、インフォメーションアーキテクト、Webデザイナー、UIデザイナー、フロントエンドエンジニア、システムエンジニア、Web担当者、学生)、電子書籍制作に関わる人

著者について

太田良典

BA テクノロジー本部 システムソリューション部 セキュリティスペシャリスト/アクセシビリティスペシャリスト、ウェブアクセシビリティ基盤委員会(WAIC)実装作業部会副主査 /JIS X 8341-3改正原案作成委員会委員
HTML4.01のW3C仕様書を翻訳した「HTML4仕様書邦訳計画補完委員会」の委員を務めた後、2001年にBAに参加。Web技術の分野で幅広い専門性を持ち、セキュリティ分野においては「第二回IPA賞(情報セキュリティ部門)」を受賞。アクセシビリティ分野では、ウェブアクセシビリティ基盤委員会(WAIC)の委員として活動している。著書(共著)に「Dreamweaverプロフェッショナル・スタイル」「ウェブの仕事力が上がる標準ガイドブック5 Webプログラミング」など。
http://www.b-architects.com/
http://bakera.jp/
http://twitter.com/bakera

伊原力也

BA ソリューション・デザイン事業部 シニア・インフォメーションアーキテクト、HCD-Net認定 人間中心設計専門家/ウェブアクセシビリティ基盤委員会(WAIC)理解と普及作業部会委員
1999年よりWeb標準に則ったWebサイトの構築業務に従事。2004年にBAに参加。マークアップデザインエンジニアとして業務を行う傍ら、HCD(人間中心設計)プロセス導入を推進。現在はプロジェクト設計、調査分析、コンセプト立案から、アクセシビリティおよびユーザビリティを確保したインタラクションデザイン、さらにフロントエンド実装のディレクションまでを一貫して手がける。クリエイティブユニットmokuva所属。
http://www.b-architects.com/
http://mokuva.com/
http://twitter.com/magi1125

目次

刊行によせて

電子書籍版の刊行によせて

本書の構成

1章:サイトを作る前に

  • なぜWebはアクセシブルなのか
  • なぜアクセシビリティと向き合うのか
  • アクセシビリティのさまざまな誤解

2章:戦略の策定

  • 概要と流れ
  • 2-1 ウェブアクセシビリティ方針を作らない
  • 2-2 適切でないアクセシビリティ方針
  • 2-3 手段が目的になってしまう

3章:要件定義

  • 概要と流れ
  • 3-1 CAPTCHAの導入でアクセス不能になる
  • 3-2 ブラウザやOSの機能が干渉を受ける
  • 3-3 コンテンツ側の冗長なアクセシビリティ機能
  • 3-4 動画コンテンツにアクセスできない
  • 3-5 紙媒体のコンテンツがそのまま使われる
  • 3-6 CMSの導入に失敗する

4章:ナビゲーション設計

  • 概要と流れ
  • 4-1 分類や並び順がわかりづらい
  • 4-2 カテゴリ名や構造がわかりづらい
  • 4-3 ナビゲーションに一貫性がない
  • 4-4 現在地がわからない
  • 4-5 再調整したり、やり直す手がかりがない
  • 4-6 情報への到達手段が少なすぎる

5章:インタラクション設計

  • 概要と流れ
  • 5-1 デバイスに依存したUI
  • 5-2 思ったようにスクロールできない
  • 5-3 勝手に新規タブやポップアップが開く
  • 5-4 一定時間で勝手にページ移動する
  • 5-5 動きをコントロールできない
  • 5-6 音が勝手に再生される

6章:システム設計

  • 概要と流れ
  • 6-1 情報が不足しているフォーム
  • 6-2 不要な項目を入力させられるフォーム
  • 6-3 ラベルや説明が不足しているフォーム
  • 6-4 入力が困難なフォーム
  • 6-5 ミスを誘発するフォーム
  • 6-6 エラーが解決できないフォーム
  • 6-7 確認・訂正ができないフォーム
  • 6-8 戻る機能が使えないフォーム
  • 6-9 時間切れで作業が継続できなくなるフォーム

7章:コンテンツ設計

  • 概要と流れ
  • 7-1 ページタイトルがわかりづらい
  • 7-2 適切な見出しが立っていない
  • 7-3 言葉がわかりにくい
  • 7-4 複雑な表が理解できない
  • 7-5 画像を含むコンテンツが理解できない
  • 7-6 リンク先がわからない

8章:ビジュアルデザイン

  • 概要と流れ
  • 8-1 見た目に頼っている
  • 8-2 コントラストが低い
  • 8-3 どこが押せるかわからない
  • 8-4 テキストブロックが読みづらい
  • 8-5 文字が画像になっている
  • 8-6 フォーカスが見えない
  • 8-7 小さく密集したものが押せない
  • 8-8 スタイルに一貫性がない
  • 8-9 閃光で発作が起きる
  • 8-10 拡大すると問題が起きる

9章:実装

  • 概要と流れ
  • 9-1 文法ミスがある
  • 9-2 セマンティクスが不適切
  • 9-3 コンテンツがCSSに依存している
  • 9-4 代替テキストの実装が不適切
  • 9-5 リンク先がわからなくなる実装
  • 9-6 ラベルがマークアップされていない
  • 9-7 スクリーンリーダー対応が不適切

付録

  • WCAG2.0と本書内容の参照リスト
  • 関連情報・資料集
Home 書籍一覧 デザイニングWebアクセシビリティ ▲ ページトップへ戻る