8/16(Tue)

今日の生放送

アクセシビリティとは?分かりやすく解説

<目次>
1:アクセシビリティとは
2:Webアクセシビリティとは「誰でも情報にアクセスできるWebサイト」
3:アクセシビリティの具体例
4:アクセシビリティに関する授業
5:まとめ

2021年6月の『障害者差別解消法』改正により、これまで国や自治体のみに義務化されていたWebサイト等へのアクセシビリティ対応が民間事業でも義務化され、公布から3年以内に対応が求められるようになりました。

上記の状況から、アクセシビリティ対応は急務だと言えますが「何から手をつけたら良いか分からない」と悩んでいる担当者も少なくありません。

ここでは「Webアクセシビリティ」に関して体系的に学べる、コース授業『アクセシビリティ入門』を参考に、アクセシビリティの意味とWebアクセシビリティ対応の例をご紹介します。

アクセシビリティ入門

先生プロフィール①

太田良典

太田良典(おおた・よしのり)
BA テクノロジー本部 システムソリューション部所属。HTML4.01のW3C仕様書を翻訳した「HTML4仕様書邦訳計画補完委員会」の委員を務めた後、2001年にBAに参加。Web技術の分野で幅広い専門性を持ち、ウェブアクセシビリティ基盤委員会(WAIC)の委員として活動している。

先生プロフィール②

伊原力也

伊原力也(いはら・りきや)
BA ソリューション・デザイン事業部所属。1999年よりWeb標準に則ったWebサイトの構築業務に従事。2004年にBAに参加。マークアップデザインエンジニアとして業務を行う傍ら、HCD(人間中心設計)プロセス導入を推進している。

 

アクセシビリティとは

アクセシビリティ とは

まず、アクセシビリティについて理解を深めるために、UXの構造と法律の側面から見たアクセシビリティの意義と、類義語との違いから言葉の意味を解説します。

 

アクセシビリティとは「様々な利用者がアクセス可能」なこと

アクセシビリティ(Accessibility)とは障害の有無や年齢、置かれている状況に関わらず、様々な利用者がアクセスしやすい状態のことです。

アクセシビリティ UX

アクセシビリティは上の図のように、UXデザインの基礎としての側面(※1)と、冒頭でも触れた、障害を理由とする差別の解消を推進することを目的で立案された『障害者差別解消法』や障害者施策の基本的事項を定める『障害者基本法』などの法律として位置づけられた側面があります(※2)。

つまり、アクセシビリティはデザインと情報格差の異なる側面から重要視されており、どちらもサービスを使いやすくすることやユーザー体験を向上させることが目的です。

アクセシビリティ対応によって最終的にサービスが使いやすくなれば、情報やサービスにアクセスできるユーザーの母数が増加しやすくなるため、障害者や高齢者に限らず、あらゆる人にメリットがあると言えるでしょう。

※1 参照:https://waic.jp/knowledge/accessibility/

※2 参照:https://www8.cao.go.jp/shougai/suishin/tyosa/h26info/chapter1.html

 

ユーザビリティとの違い

アクセシビリティ ユーザビリティ

国際間のサービス品質を管理する国際標準化機構(ISO)の規格「ISO 9241-11」によればユーザビリティ(Usability)とは以下のように定義されています。

「ある製品が指定されたユーザーによって,指定された利用の状況下で指定された目的を達成するために用いられる際の有効さ、効率及び ユーザーの満足度の度合い」

つまり、アクセシビリティとユーザビリティの違いはアクセスしやすくなる対象者の幅にあることが分かります。前の項目でご紹介したように、アクセシビリティはユーザーの特性や状況に関わらず様々な人が対象になります。その一方で、ユーザビリティは「特定の状態や特定の人に対する」アクセスしやすい状態を表す言葉です。想定の幅によっては、アクセシビリティの対象と重なる可能性もあります。

 

ユニバーサルデザインとの違い

アクセシビリティ ユニバーサルデザイン

ユニバーサルデザイン(Universal Design)とは国籍や障害の有無にとらわれない普遍的なデザインのことです。例えば、右利きでも左利きでも使えるマウスや標識などが挙げられます。さらに詳しく解説すると「ユニバーサルデザイン」はアメリカの建築家、ロナルド・メイスによって作られた言葉で、彼は言葉の意味を以下のように述べています。

「特別な製品や調整無しで、最大限可能な限り、すべての人々に利用しやすい製品、サービス、建物・空間のデザイン」

またユニバーサルデザインの研究を行う、特定非営利活動法人・実利用者研究機構は、ユニバーサルデザインについて以下のように補足しています。

「商品デザインや商品特性を指す言葉ではなく、人とモノや空間、サービスとの関係性そのものを指す考え方」(※)

つまり、アクセシビリティとユニバーサルデザインは「すべての人々に利用しやすい」点では同じですが、実は言葉の対象や意味に違いがあることが分かります。

※引用元:https://www.ud-web.info/

 

Webアクセシビリティとは「誰でも情報にアクセスできるWebサイト」

Webアクセシビリティ とは

Webアクセシビリティとは、年齢や身体能力、利用環境に関係なく、誰でもWebサイト上の情報にアクセスしやすい状態のことです。

Webアクセシビリティの標準は日本工業規格「JIS X 8341-3(高齢者・障害者等配慮設計指針-情報通信における機器,ソフトウェア及びサービス-第3部:ウェブコンテンツ)」Web技術の標準化を行う非営利団体W3C(World Wide Web Consortiumの「Webコンテンツアクセシビリティガイドライン(WCAG)2.0」に定められており、対象範囲は主に以下のとおりです。

  • 高齢者、障害のある人及び一時的な障害のある人
  • 地方や発展途上国の人々
  • スマートウォッチなど入力モードが異なる他のデバイスを使用している人
  • 明るい日光の下や音声が聞こえない環境など「状況に制限がある」人

一時的な障害とは、けがによる能力低下や閲覧する環境によって生じる障害などが含まれるため、医学的な診断による身体障害・精神障害だけに留まりません。

< Webアクセシビリティ10の視点 >

またWeb領域でのアクセシビリティ対応には特に注目が集まっており、その理由はWebの本質とアクセシビリティの親和性が高い点にあります。Webの本質については、Webの開発者ティム・バーナーズ=リーがW3Cの公式サイト(※1)で述べている以下の言葉が参考になります。

ユーザーエージェント とは

そして、Webの本質がなぜ「普遍性」なのか、詳しく解説する時に欠かせない存在がWebサイトの情報をユーザーの代わりに処理・表示する「ユーザーエージェント」です(※2)。

ユーザーエージェントには、ビジュアルブラウザ(グラフィカルブラウザ、テキストブラウザ)やノンビジュアルブラウザ(音声、点字)、検索ロボットなどさまざまな種類があります。そのため、ユーザーエージェントを使い分ければ、Webサイト上の情報をユーザーが認知しやすい状態に変えることが可能です。そして、この仕組みがWebの本質である、普遍性やアクセシビリティに結びついていると言えます。

Webコンテンツのアクセシビリティ確保に関する規格を促進する団体ウェブアクセシビリティ基盤委員会(WAIC)によれば、Webアクセシビリティの定義は以下の通りです。

「ウェブのアクセシビリティを言い表す言葉がウェブアクセシビリティです。ウェブコンテンツ、より具体的にはウェブページにある情報や機能の利用しやすさを意味します」(※2)

さらにWeb技術を標準化する団体W3CではWebアクセシビリティについて以下のように述べられています。

「Webは基本的に、ハードウェア、ソフトウェア、言語、場所、または能力に関係なく、すべての人が使用できるように設計されています。Webがこの目標を達成すると、さまざまな聴覚、運動、視覚、および認知能力を持つ人々がWebにアクセスできるようになります。」(※1)

※1 引用元:https://www.w3.org/standards/webdesign/accessibility

※2 引用元:https://waic.jp/knowledge/accessibility/

 

アクセシビリティの具体例

アクセシビリティ 例

ここまでアクセシビリティの言葉の意味について、Webサイトの特性と法律上の側面、類義語との違いから読み解いてきました。ここからは、さらにアクセシビリティについて明確なイメージを持つために、実際世の中で実装されているアクセシブルなプラットフォームやソフトウェアについて見ていきましょう。

 

Webにおけるアクセシビリティ

W3CではWebアクセシビリティについて次の4原則を定めており、それぞれにWebアクセシビリティ達成基準を満たすための項目があります(※)。ここでは4つの原則と基準項目の一例をご紹介します。

< 知覚できる >

光の加減によって画面が見にくい人や視覚障害や言語障害によって文字が読みにくい人など、さまざまな状況にあるユーザーにとって情報が知覚できる状態を表します。対応例は以下の通りです。

  • 図やイラスト、オーディオやビデオファイルに対してテキストで説明する(代替テキスト)
  • 文字色と背景色のコントラスト比は4.5:1以上で視認しやすい
  • テキストのサイズを拡大縮小したり、テキストの間隔を変更しても情報が得られる

< 操作できる >

Webアクセシビリティ 原則

マウスを使わず、キーボードやその他のデバイスでWebサイトを利用できる状態や、コンテンツを利用するのに十分な時間が用意されている状態などを表します。具体的な対応例は以下の通りです。

  • マウスで利用できる機能はキーボードでも利用できる(メニューの選択をTabキーで行えるなど)
  • キーボードのみでフォーカスしている箇所(カーソルが当たっている箇所)が分かる
  • 必要な場合を除いて、制限時間を停止、延長、または調整できる

< 理解できる >

テキストが読みやすく、分かりやすい状態を表します。異なるユーザーエージェントを使っても同じように理解できるコンテンツが求められます。対応例は以下の通りです。

  • 明確で単純なテキストを使用するか、簡略化されたテキストを記載する

< 表示できる >

コンテンツを正しく読み上げる、文字を拡大できるなど、ユーザーが希望する形で情報が表示できる状態を表します。対応例は以下の通りです。

  • 見出し、リスト、表、入力フィールド、およびコンテンツ構造が適切にマークアップされている

Webアクセシビリティ対策を難しそうだと感じる方も少なくありません。しかし、Webアクセシビリティはゼロか1かではなく、出来る範囲で少しずつ対策を進めていくものなので、サイト制作の初期からガイドラインで設定されている原則を完璧に網羅できていなくても問題ないのです。

※参照: https://www.w3.org/WAI/fundamentals/accessibility-principles/

 

iPhoneのアクセシビリティ機能

iPhoneでも視覚・聴覚・身体機能などに障害がある方や、限定された環境でiPhoneを利用しなくてはならないユーザーが使いやすいようなデザインがされています(※)。例えば、視覚に障害がある方の場合はテキストの読み上げ機能やズーム機能が必要になりますが、iPhoneの場合は以下のようなアクセシビリティ機能が備わっています。

  • Voice Over:画面が見えなくてもiPhoneを使用できる機能。画面に触れるか、画面を指でドラッグすると、アイコンやテキストなど、指の下にある項目の名前が読み上げられる。

また聴覚に障害がある方の場合は以下のような機能が備わっています。

  • サウンド認識:泣き声、ドアベル、サイレンなど、特定の音を認識したときに通知を送信させることができる

※参照:https://support.apple.com/ja-jp/guide/iphone/iph3e2e4367/ios

 

Excel、Wordのアクセシビリティ

Microsoft社のExcel、Wordにもアクセシビリティ機能が搭載されています。Microsoft Office アプリのリボンで「校閲」 タブを選択した後に「アクセシビリティの確認」分割ボタンの上部を選択することで、障害のあるユーザーにとって読みやすく編集しやすいドキュメントであるか確認できるように設定されます。

上記の設定をすることで、アクセシビリティに問題がある文書や表を作成した場合(図に代替テキストが設定されていない場合など)に「アクセシビリティ:検討が必要です」と表示されるようになります。

 

アクセシビリティに関する授業

最後にWebアクセシビリティの概要からコンテンツ設計・デザイン・実装まで一貫して学べる授業をご紹介します。Web制作アシスタントやWebデザイナーの方、これらの仕事を目指している方はぜひ受講してみてください。

< Webアクセシビリティ入門 >

アクセシビリティ入門

< 授業概要 >

この授業では、Webサイトを誰でも、どんな環境でもアクセスできるようにする「アクセシビリティ」の考え方について学びます。アクセシビリティに取り組んで行きたい方や、これからWeb制作について学びたいという方のために、Webアクセシビリティの基礎からはじめ、Web制作の各制作プロセスで実践していく方法についてお話ししていきます。

 

まとめ

アクセシビリティとは、障害者や高齢者に限らず、どのような状態・状況にある人でも、商品やサービス、コンテンツが利用できる状態のことです。つまり使いやすい、または利用しやすい状態を設計する意味ではUXデザインと考え方が重なる部分もあります。

さまざまなユーザーにとって開かれた場であるWebの特性を活かして、多くの人が使いやすいデザインに興味がある方や、Webアクセシビリティ対策に取組みたいと考えている方はぜひ『アクセシビリティ入門』の授業を受講してみてくださいね。

今日の生放送

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

まとめ記事の記事一覧