Open2

アクセシビリティ

expsh13expsh13
  • 背景
  • Webアクセシビリティとは
    • アクセシビリティとは
    • Webアクセシビリティとは
    • 他のワードとの違い
      • UI
      • UX
      • ユーザビリティ
      • 図でまとめる
  • なぜ学ぶ必要があるのか
    • インフラとしての役割
    • 義務化
    • SEO
  • 具体例
    • デザイン
    • コーディング
  • 参考文献

背景

アクセシビリティへの対応が義務化されたことをきっかけに調べ出した。

webアクセシビリティとは

アクセシビリティ

英語では“Accessibility”で、「アクセシビリティ」という言葉は、Access(近づく、アクセスするの意味)とAbility(能力、できることの意味)からできています。「近づきやすさ」、「利用のしやすさ」などという意味から派生して「(製品やサービスを)利用できること、又はその到達度」という意味でも使われます。

Webアクセシビリティとは

利用者の障害などの有無やその度合い、年齢や利用環境にかかわらず、あらゆる人々がウェブサイトで提供されている情報やサービスを利用できること、またその到達度を意味します。

他のワードとの違い

  • UI
    UIとはユーザー・インターフェース(User Interface)の略で、ユーザーとコンピューターあいだで情報をやり取りするさまざまなものです。(デザイン、ボタン、マウス、キーボードなど)
  • UX
    UXとはユーザー・エクスペリエンス(User Experience)の略で、ユーザーが製品やサービスで得られる体験のことです。ユーザビリティが効率や効果を指標とするのに対し、UXはユーザーの感情なども含めた総合的な体験を評価します。
  • ユーザビリティ
    特定のユーザが特定の利用状況において、システム、製品又はサービスを利用する際に、効果、効率及び満足を伴って特定の目標を達成する度合い使いやすさや有用性などを意味する言葉です。
    この定義は「どんなシーンで、誰が、何を目的として、どのように使うのか想定しなければ使いやす
    いシステムは実現しない」

※Interfaceには、本来「接点、接触面」という意味があります。

図でまとめると下記。
「ユーザビリティ」は狭く深く使いやすさを追求していくのに対し、「アクセシビリティ」は浅く広く、使える人の範囲の広さを追求していくよな裾を広げていく概念であり、一般的に、障害者や高齢者だけをターゲットとして、彼らのためだけの施策をするのは好ましくないと言える。

なぜ学ぶ必要がある

インフラとしての役割

現代社会では、ウェブサイトは重要な情報源で、社会生活を営む上でなくてはならないインフラの一つになっています。老若男女問わず多くのかたがパソコンやスマートフォンだけでなく、タブレットやゲーム機など様々なデバイスでウェブサイトにアクセスしています。
しかし、ウェブサイトがウェブアクセシビリティに配慮して作られていないと、利用者の症状や状況によっては、ウェブサイトを介して情報を入手できなかったり、ウェブ上で行う申込や手続などのサービスが利用できなくなったりするなど、社会生活で大きな不利益が生じます。さらには、災害時に避難場所などの必要な情報を得られない状況となれば生命の危機に直面するおそれさえあります。
こうした理由から、ウェブサイトで提供している情報やサービスを常に誰もが安心して利用できるように、ウェブアクセシビリティを確保する必要があるのです。

義務化

令和6年(2024年)4月1日から、障害者差別解消法(障害を理由とする差別の解消の推進に関する法律)の改正により、国や地方公共団体などに義務付けられている合理的配慮の提供が、民間の事業者も義務化されました。
障害のある人への合理的配慮とは、社会生活の中にあるバリア(障壁)を取り除くために何らかの対応を必要としている場合には、負担が重すぎない範囲で対応することです。例えば、日常生活であれば「駅員が車いすの乗客の手助けをする」「窓口で筆談、手話などを用いて意思疎通する」といったことです。また、その合理的配慮を的確に行うため、環境の整備が努力義務となっており、ウェブサイトの場合ではJIS X 8341-3:2016に準拠したウェブサイトを作り、ウェブアクセシビリティを確保することがこれに当たります。
企業の社会的な責任として合理的配慮を行う事業者が増えることは、私たちがウェブサイトを情報インフラとして利用する上でとても大切なことです。

SEO

ユーザーにとって使いやすいサイトであることはすなわち、検索エンジンのクローラーに対してWEBサイトの情報を正確に認識されるようにするための手助けにもなります。

  • alt属性を使った画像への代替テキストの付与
  • 文法上正しい意味を持つマークアップ

具体例

https://a11y-guidelines.freee.co.jp/checks/index.html

参考文献

http://digital.go.jp/assets/contents/node/basic_page/field_ref_resources/08ed88e1-d622-43cb-900b-84957ab87826/9f89625f/20230512_introduction_to_weba11y.pdf
https://www.gov-online.go.jp/useful/article/202310/2.html
https://developer.mozilla.org/ja/docs/Web/Accessibility
https://www.ciaj.or.jp/access/accessibility/index.html
https://zenn.dev/ymrl/articles/7f41ad2f39f714
https://jp.ext.hp.com/techdevice/technologysc/creator_002/