- 本記事は 虎の穴ラボ Advent Calendar 2023 2日目の記事です。(予約投稿)
- 昨日は A.M さんの 「Amazon Bedrock Prototyping Camp 2023に参加してきました」でした。
- 次回は Y.F さんの「スタッフエンジニアを読んだ感想」です。ご期待ください！
こんにちは。大場です。東北に引っ越してもう直ぐ一年が経ちそうですが、まだ冬の寒さに慣れそうにありません。 今回は最近読み進めている『Webアプリケーションアクセシビリティ 今日から始める現場からの改善』という書籍について紹介します。
モチベーション
この本を購入した際のモチベーションとしては以下のような思いがありました。
- デザイナーから画面デザインが共有された際に、その意図を自分なりに見い出せるようにしたい
- デザイナーの意図をより汲み取りコミュニケーションを円滑に行えるようにしたい
当初はアクセシビリティに特化して理解を深めたいというよりも、自分にない新しい視点(今回だとアクセシビリティ)を持ってデザインを見れる様になりたいなといったものでした。 購入直後まとまった時間がなかなか取れず、文章量が多い事もありなかなか読み進めることができませんでした。 現在は虎の穴ラボが定期的に開催している もくもく読書会 の中に持ち込み少しずつ読み進めています。 読了には至っていないため理解不足な点もありますが、全体的に概要レベルで紹介できればと思います。
書籍情報
| タイトル | Webアプリケーションアクセシビリティ 今日から始める現場からの改善 |
|---|---|
| 著者 | 伊原力也,小林大輔,桝田草一,山本伶 |
| 発売日 | 2023年2月27日 |
| 発行 | 技術評論社 |
| ページ数 | 576ページ |
書籍内容
1章 Webアクセシビリティとは
突然ですが、皆さんはWebにおいてアクセシビリティの意味を尋ねられたらパッと回答できるでしょうか。 私の場合は本書を読むまでユーザビリティとの違いがよくわかっていませんでした... この章では、2章以降を読み進めていくにあたって重要キーワードとなるアクセシビリティの定義について解説しています。 その後に身体的に障害を持つ方々の理解とデジタルデバイスの対応や、アクセシビリティ標準や達成基準について紹介されています。
2章 Webアクセシビリティの基礎
Webアプリケーションにおけるアクセシビリティ上の課題と改善方法についてを取り上げて解説がされています。 キーボード操作ができない、インタラクティブ要素(クリック可能な要素)が隠れてしまってフォーカスが当たらない等、 アクセシビリティ上起こり得る課題を取り上げ、CSSでどのように記述すれば改善できるかを具体的なコードも含めて解説しています。
3章 4章 5章 (ケース毎の課題と改善事例の紹介)
3、4章は2章と同様に課題と改善方法について解説していくといった構成になっています。 3章ではフォーム入力、4章では UIデザイン に 関する内容を取り扱っています。 UIデザインと一口で言ってもピンと来にくいと思うので例を挙げると、 テキストの色の設定やサイズや行間に関して、どうすれば見やすく理解しやすくなるか等が紹介されています。 5章ではこれまでの2、3、4章を前提としてダイアログやツールチップなど画面コンポーネントにフォーカスした問題点と改善方法が紹介されていました。
6章 デザインシステムとアクセシビリティ
デザインシステムについての基礎知識と導入したデザインシステムにアクセシビリティを織り込むメリットや、どのように強化していくかといった内容が紹介されています。
7章 アクセシビリティの組織導入
Freee株式会社での活動事例を挙げ、アクセシビリティの意識向上やチームを巻き込んで小さな取り組みを波及させていく活動について等、 アクセシビリティに対する取り組みを組織へ導入していく流れが紹介されていました。
8章 アクセシブルなUI設計の原理を導く
2から5章では課題が起きた後の改善例が取り上げられていましたが、 この章でははじめからアクセシビリティを担保するために押さえておくポイントが紹介されています。
どんな方向け
現場レベルで発生するアクセシビリティ上の課題と、その解決策についてコードで解説されています。 Webデザイナーはもちろん、画面設計から製造を手がけるエンジニアが読んでみても学びがあるかと思います。
感じたこと
2章から6章にかけては具体的な事例と解決方法が明確に示されており、特に理解度を深めたい章です。 それらを理解することで自分が携わるプロダクト開発で、今まで気づかなかった課題が見えてきそうに感じます。 書籍読了後は今後の振り返り会でアクセシビリティ上の良い点や悪い点を挙げて改善に繋げていきたいです。
また後からアクセシビリティを上げるといった提案を行なっても、 そのWebサービスの性質や企業特性や事業内容に左右される部分かと思いますが、なかなか工数を割くのが厳しい場合もあると思います。 個人的なスモールスタートとして画面開発に携わる機会があれば、アクセシビリティを考慮しながらマークアップを行っていきたいです。
さいごに
医療系のサイトや障害を持った方のアクセスが多いWebサービスを運営しているのであればアクセシビリティに関する知識は必要ですが、 その他のWebサービスが大半で常日頃からアクセシビリティに対する視点を持ちながら開発を行っている方はなかなか希少な存在かと思っています。 特にとらのあな通販の様な視覚情報がメインのエンタメ商材を扱う場合なかなか注力しにくい分野ですし、マイノリティなユーザーに目を向けるシーンも少ないです。
本書を読む事でアクセシビリティに関する知識は深まる事はもちろんですが、普段の業務では目を向けないユーザー視点を考えたり、 そもそもそういったユーザーが存在するという事実を改めて再認識できました。
もし興味がある方は手元のPCでアクセシビリティ機能を試しに有効にしてみてはいかがでしょうか。 例えば、ブラウザやOSに搭載されている音声読み上げ機能を使ってWebサイトを閲覧してみるとどの程度対応されているかがわかって面白いと思います。
宣伝
もくもく読書会は来月の2023年12月26日(火)にも開催を予定しています。 オンライン上で読み進めたい本を持ち寄って各自のペースで読み進める形式となっています。 本を積んでしまっている方や読み進めたいのに時間がなかなか確保できない方におすすめです！ 興味がある方はぜひConnpass経由からお申し込みください🙏 yumenosora.connpass.com
採用情報
虎の穴ラボでは一緒に働く仲間を募集中です！
この記事を読んで、興味を持っていただけた方はぜひ弊社の採用情報をご覧ください。
toranoana-lab.co.jp
