アクセシビリティーとは？ / What the accessibility ?

Slide 1

Slide 1 text

アクセシビリティとは？ @kubosho ABEMA アクセシビリティタスクフォース

Slide 2

Slide 2 text

話すことアクセシビリティタスクフォースでは ABEMA にアクセシビリティ向上を波及させようとしています。ここでは「そもそもアクセシビリティとはなんぞや？」という疑問に答えます。

Slide 3

Slide 3 text

アクセシビリティ？

Slide 4

Slide 4 text

アクセシビリティ？ ● accessibility = access + ability ○ 「アクセス + 〜できる」 ○ accessibility → a11y

Slide 5

Slide 5 text

アクセシビリティ？ ● 誰もがありとあらゆる状況・環境で、ほぼ同じコストで同じ量の情報を得られる。そして、ほぼ同じ目標を達成できる。

Slide 6

Slide 6 text

誰もが

Slide 7

Slide 7 text

「誰もが」はすべての人が対象高齢者や障害者だけではなく、すべての人が対象。すべての人には自分も含む。

Slide 8

Slide 8 text

ありとあらゆる状況・環境

Slide 9

Slide 9 text

ありとあらゆる状況・環境誰もが、状況や環境によって不自由になる。 ● スマホの画面が割れて操作しづらい ● Bluetooth イヤホンが電池切れ ● 腱鞘炎でマウスが持ちづらい ● メガネが壊れた

Slide 10

Slide 10 text

ほぼ同じコストで同じ量の情報を得られる

Slide 11

Slide 11 text

ほぼ同じコストで同じ量の情報を得られるあらゆる条件でほぼ同じように使えることを目指す。 ● 目が見えづらい人向けに文字サイズを大きくしすぎたら晴眼者にとっては一覧性が下がる

Slide 12

Slide 12 text

ほぼ同じコストで同じ量の情報を得られるあらゆる条件でほぼ同じように使えることを目指す。 ● 目が見えづらい人向けに文字サイズを大きくしすぎたら晴眼者にとっては一覧性が下がる ● 画像の代替テキストにページ内にない文章を書いたら晴眼者が知らない情報が出てくる

Slide 13

Slide 13 text

代替テキスト内にない文章を書いた例この画像の代替テキストが「ハンバーグ・チーズ・ベーコン・オニオンが、パンに挟まったハンバーガー」だとした場合引用元: https://flic.kr/p/oT3Th5

Slide 14

Slide 14 text

代替テキスト内にない文章を書いた例ページ内に材料の情報が無く、画像だけ表示されていた場合、先ほどの代替テキストはスクリーンリーダーユーザーしか認識できない。 → 晴眼者はハンバーガーの材料を画像から読み取るしかない。引用元: https://flic.kr/p/oT3Th5

Slide 15

Slide 15 text

同じ量の情報を得られる例ハンバーガー材料 ● パン ● ハンバーグ ● チーズ ● ベーコン ● オニオン ● ケチャップ引用元: https://flic.kr/p/oT3Th5

Slide 16

Slide 16 text

ほぼ同じ目標を達成できる

Slide 17

Slide 17 text

ほぼ同じ目標を達成できる同じものを使って、目標を達成できるようにする。 ● 専用のものを作るとメンテナンスコストが増える ● 誰もが使いやすいものを追求することで、利用者の誰もが恩恵を得られる ● より使いやすくするカスタマイズは利用者に委ねる ● カスタマイズがしやすいように作る

Slide 18

Slide 18 text

まとめ

Slide 19

Slide 19 text

アクセシビリティ ● accessibility = access + ability ○ 「アクセス + 〜できる」 ○ accessibility → a11y ● 誰もがありとあらゆる状況・環境で、ほぼ同じコストで同じ量の情報を得られる。そして、ほぼ同じ目標を達成できる。

Slide 20

Slide 20 text

Slide 21

Slide 21 text

https://cyberagent.connpass.com/event/227974/ Muddy Web #2 を 2021/11/12 にやります「ABEMA のアクセシビリティタスクフォースは、これまで何をやって、これから何をやるか」