みんなにやさしいウェブサイト

みんなにやさしいウェブサイト 2025年4⽉21⽇ Toranomon Tech Hub 第三回技術異種格闘技戦〜好きな技術LT⼤会〜

ゆずねり (X: @yuzuneri) •お仕事 •Webバックエンドたまにフロントエンジニア •趣味 •ドール、ポーカー、交錯員 2025/4/21
2

アジェンダ 1. やさしいウェブサイトとは 2. ウェブアクセシビリティの基本 3. まとめ 2025/4/21 3

やさしいウェブサイトとは

バリア‐フリー〘名〙（英barrier-free）⽼齢者、障害者、妊婦、⼦どもなどの⽣活弱者に不都合な障害がないこと。だれもが安全で快適に⽣活できる環境、状態であること。また、そのさま。道や床などの段差をなくしたり、階段をなくしてゆるやかなスロープにして⼿すりをつけるなどは、そのような環境の実現のための事例であるが、物理的なものに限らず、⽂化‧情報、制度、⼈々の意識についても同じことがいえる。（精選版⽇本国語⼤辞典）
2025/4/21 5

誰でも使えるのがWebの本質 •ウェブの⼒はその普遍性にある。障害の有無にかかわらず、誰もがアクセスできることは不可⽋な要素である。（ティム‧バーナーズ＝リー） https://www.w3.org/ja/mission/accessibility/ 2025/4/21 6

ウェブサイトの重要性 •オンラインサービスへのアクセスが制限されると⾏政、教育、就労など様々な機会損失が発⽣ •災害情報など⽣命に関わるサービスもある 2025/4/21 7

法的背景 •⽇本では2024年4⽉に障害者差別解消法が改正され⺠間事業者にも合理的配慮が義務化 •国際的にも多くの国で類似の法整備がある 2025/4/21 8

ウェブアクセシビリティという考え •みんなが使いやすいウェブサイトを⽬指す＝ウェブアクセシビリティ •情報格差をなくし、誰⼀⼈取り残さないようにするため •W3Cが作成 2025/4/21 9

ウェブアクセシビリティの基本

誰のため？ •障害のある⽅ • 視覚、聴覚、運動障害など •⼀時的な制約がある⽅ • 怪我や病気、周囲の環境など •利⽤環境の依存 • パソコン、スマートフォン、インターネット環境など
2025/4/21 11

4つの基本原則 1. 知覚可能（Perceivable） 2. 操作可能（Operable） 3. 理解可能（Understandable） 4. 堅牢（Robust） 2025/4/21
12

1. 知覚可能（Perceivable） •情報やUIがユーザに認識できる •⾊だけに頼らない表現 •⾳声情報の提供 •字幕情報の提供 •画像に代替テキストを提供 2025/4/21 13

2. 操作可能（Operable） •ユーザがすべてのUIを操作できる •キーボードでの操作 •コンテンツを読むのに⼗分な時間がある •フラッシュを抑制する 2025/4/21 14

3.理解可能（Understandable） •ユーザが情報やUI操作を理解できる •読みやすいテキスト •表⽰や操作が予想でき、⼀貫性がある •間違いを防いだり、修正を容易にできる 2025/4/21 15

4. 堅牢（Robust） •さまざまなユーザーエージェントが確実に利⽤できる •HTMLを正しく利⽤する •特定のブラウザに依存しない 2025/4/21 16

OSやブラウザの機能で達成する •⽂字拡⼤、カラー変更などを独⾃の補助機能を実装してもアクセシビリティは確保できない •利⽤者は、ウェブサイトの補助機能を積極的に使いたいわけではない •OSやブラウザの設定で⼀貫した体験をしたい 2025/4/21 17

達成基準のレベル •レベルA • 最低限守るべき必須要件 •レベルAA • 多くの⼈がアクセスしやすくなる推奨要件 •レベルAAA • あらゆる⼈が最⼤限アクセスしやすくなる追加要件
2025/4/21 18

原則とレベルの件数 A AA AAA 計知覚可能 9 11 9 29
操作可能 14 6 14 34 理解可能 7 6 8 21 堅牢 1 1 0 2 計 31 24 31 86 2025/4/21 19

まとめ •ウェブアクセシビリティは「特別な誰か」のためのものではない •少しの配慮で多くの⼈が使いやすくなる •簡単なところからぜひはじめてみてください！ 2025/4/21 20

参考⽂献 •Web Content Accessibility Guidelines (WCAG) 2.2 • https://www.w3.org/TR/WCAG22/ •ウェブアクセシビリティ導⼊ガイドブック｜デジタ
ル庁 • https://www.digital.go.jp/resources/introduction- to-web-accessibility-guidebook 2025/4/21 21

みんなにやさしいウェブサイト

みんなにやさしいウェブサイト

yuzneri

More Decks by yuzneri

Other Decks in Programming

Featured

Transcript