Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
中小企業のWebサイトでも気にしておきたいアクセシビリティ
自己紹介
澤田 望
パーマ
メガネ
(老眼)
ガリガリ
中年講師
岡山で独立 2014~ Webアクセシビリティ検証
イラスト制作
岡山情報ビジネス学院 非常勤講師
などなど
キヤノン ~2013 サイトデザイン監修
Webアクセシビリティ対応
WAIC 2011~ ウェブアクセシビリティ基盤委員会
コラムを...
本日の主旨
Webアクセシビリティに取り組んだら
これだけ売上げが伸びますよ!
Webアクセシビリティに取り組んだら
これだけ売上げが伸びますよ!という話ではありません。
一番伝えたい情報を
もっと伝わるようにしませんか?
中小企業サイトを運用している方に
「アクセシビリティやってみようかな」
と思っていただきたい。
中小企業サイトを受託している方に
「アクセシビリティ勧めてみようかな」
と思っていただきたい。
なぜWebアクセシビリティは後回しにされるの?
大企業はどんな理由で取り組むのか?
2. なぜアクセシビリティに取り組むのか?
キヤノンサイト基本理念とアクセシビリティ
• アクセシビリティ → 保証

機械可読性の向上 → 機会

サイト品質の向上 → ブランドイメージ(共感)
• キヤノンの製品分野は多岐に渡る

→ 様々...
それだけでは皆さんは納得しない...
https://www.smrj.go.jp/recruit/environment.html より
1. 儲かるの?
2. コストがかかりそう
3. ウチには関係ない
3大ブレーキ
1. 儲かるの?
儲かるようには見えていない
ミクロ的:効果は見えやすい
(使えない → 使える)
マクロ的:定量的な効果測定が難しい
効果が見えにくい
alt="イラスト:グレーの猫" alt=""
A B
どちらが伝わりやすいのか?
どちらが伝わりやすいのか?
背景:ピンク 背景:黒
A B
ABテストをやってみよう。
サイト訪問者がスクリーンリーダーを
使ってるかどうかを知る術がない。
https://sbapp.net/appnews/app/upinfo/ios-12/voiceover-94603 より
https://support.apple.com/ja-jp/HT209655 より
効果はミクロ的に実感しよう!
※ユーザビリティテストなどで実感することが可能
機会損失のおそれ
取りこぼしがあります。
PV :アクセスすることができた
CVR:購入/申込みすることができた
さまざまな指標
「することができなかった」は入っていない
統計局ホームページ/人口推計(令和元年(2019年)5月確定値,令和元年(2019年)10月概算値) (2019年10月21日公表) より
神奈川県年齢別人口統計調査結果 - 神奈川県ホームページ
岡山県の人口(平成31年3月1日) - 岡山県ホームページ(統計分析課)
障がいのある方々のインターネット等の利用に関する調査研究(平成24年6月)総務省 より
人口
障害者 :933万...
平成28年生活のしづらさなどに関する調査(全国在宅障害児・者等実態調査) より
統計局ホームページ/令和元年/統計トピックスNo.121 統計からみた我が国の高齢者-「敬老の日」にちなんで- より
機会損失
\この数字を取りに行きましょう/
SEO
https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=ja より
儲かりそうなことは...
\ なんでもやってみよう /
2. コストがかかりそう
Yesでもあり、Noでもある。
コストがかかるタイミング/そうでもないタイミング
アクセシビリティ対応だけのために
現行サイトを改修することは
おススメしません。
• •
膨大な費用が発生するかも知れません。
サイトのリニューアルや
新規コンテンツの追加など
何かのついでに始めましょう。
• • •
コストがかかる分野/そうでもない分野
高コストな分野
(比較的)
低コストな分野
追加作業コスト 学習コスト
JavaScript等のプログラム
CMS等のサーバープログラム
JIS X 8341-3 適合試験
ガイドライン作成
HTML
CSS
ビジュアルデザイン
テキスト原稿
https://www.mitsue.co.jp/service/production/web_standards.html より
4. JIS対応による効果
コスト低減
• 長い目で見ればメンテナンスコストは低下

画像のテキスト化/マークアップの適正化
• ワンソースであればマルチデバイス対応時の
コストは抑えられる
堅牢性が高くなると
タイミングや分野に気をつければ...
\ コストは抑えられる /
3. ウチには関係ない
本当にそうなのか?
Webサイトを持つ目的
• 商品を買ってもらいたい
• サービスを利用してもらいたい
• 会社の株を買ってもらいたい
• 会社に就職してもらいたい
※ 広告は除く
• 商品を気に入ってもらいたい
• サービスを気に入ってもらいたい
• 会社の株を気に入ってもらいたい
• 会社を気に入ってもらいたい
• 商品を知ってもらいたい
• サービスを知ってもらいたい
• 会社の株を知ってもらいたい
• 会社を知ってもらいたい
知ってもらいたい
アクセシブルな状態
アクセスできる状態にしておく必要
多くの人にアクセスしてもらいたい
多くの人に情報を届けたい
アクセシビリティを向上させる
Webサイトの目的達成への近道
対岸の火事?
Webアクセシビリティに関する法律/政策が存在する国(2019年10月)
掲載国: Web Accessibility Laws & Policies | Web Accessibility Initiative (WAI) | W3C より
法制化が進むと訴訟が増える。(乱暴)
マクドナルドが提訴されたと報道する記事(Cook County Record) より
https://www.buzzfeed.com/jp/skbaer/beyonce-website-accessibility-1 より
日本では?
内閣府:障害を理由とする差別の解消の推進 より
Web以外では訴訟も起きている。
視覚障害を理由とした事務職への配置転換は不当として
岡山短大の山口雪子准教授が提訴し勝訴
(ただし現在も授業担当から外された状況は続いている)
https://yamaguti-yukiko-support.j...
https://lineblog.me/ochiaihiroshi/archives/702531.html より 三井住友ビザカードサイトに設置されている「パズル認証」機能
radikoアプリのバージョンアップ時の不具合に対するツイートより https://blog.goo.ne.jp/despair-rp-hope/e/1c0518e52f9ee74d3024cca9e6cc3fc7 より
サービスを使えるレベルの
最低限のアクセシビリティは
担保しておくべきです。
岡山でも取り組み始めた企業があります。
某サイト「アクセシビリティ方針」より
身近な数字で考える
統計局ホームページ
岡山県の人口(平成31年3月1日) - 岡山県ホームページ(統計分析課)
岡山市のプロフィール人口|岡山市|市政情報|岡山市プロフィール
平成30年度西長瀬町内会事業報告書 より
総人口に対する障害者の比率 → 7.4%
全...
アクセスできなくていい人なんかいない。
• • • • • • • • • • • •
情報にアクセスできることは...
\ 基本的な人権です/
まとめ
1. 儲かるの?
2. コストがかかりそう
3. ウチには関係ない
3大ブレーキ
• 効果はミクロ的に実感できる
• 取りこぼしている数字がある
• SEOにも効果あり
1. 儲かるの?
• タイミングや分野に気をつければ
コストは抑えられる
2. コストがかかりそう
• Webサイトの目的達成への近道
• 訴訟に対するリスク管理
• 情報へのアクセスは基本的な人権
3. ウチには関係ない
@SawadaStdDesign
ありがとうございました
中小企業のWebサイトでも気にしておきたいアクセシビリティ
Upcoming SlideShare
Loading in …5
×

of

中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 1 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 2 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 3 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 4 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 5 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 6 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 7 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 8 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 9 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 10 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 11 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 12 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 13 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 14 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 15 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 16 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 17 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 18 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 19 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 20 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 21 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 22 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 23 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 24 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 25 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 26 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 27 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 28 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 29 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 30 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 31 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 32 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 33 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 34 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 35 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 36 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 37 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 38 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 39 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 40 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 41 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 42 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 43 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 44 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 45 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 46 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 47 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 48 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 49 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 50 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 51 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 52 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 53 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 54 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 55 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 56 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 57 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 58 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 59 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 60 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 61 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 62 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 63 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 64 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 65 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 66 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 67 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 68 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 69 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 70 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 71 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 72 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 73 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 74 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 75 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 76 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 77 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 78 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 79 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 80 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 81 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 82 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 83 中小企業のWebサイトでも気にしておきたいアクセシビリティ Slide 84
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

5 Likes

Share

Download to read offline

中小企業のWebサイトでも気にしておきたいアクセシビリティ

Download to read offline

2019/11/2(土)にハッシュタグにて行われた「リーダブルな昼下がり on 2019/11/02」でのセッションで使用したスライドです。

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

中小企業のWebサイトでも気にしておきたいアクセシビリティ

  1. 1. 中小企業のWebサイトでも気にしておきたいアクセシビリティ
  2. 2. 自己紹介
  3. 3. 澤田 望 パーマ メガネ (老眼) ガリガリ 中年講師
  4. 4. 岡山で独立 2014~ Webアクセシビリティ検証 イラスト制作 岡山情報ビジネス学院 非常勤講師 などなど キヤノン ~2013 サイトデザイン監修 Webアクセシビリティ対応 WAIC 2011~ ウェブアクセシビリティ基盤委員会 コラムを担当
  5. 5. 本日の主旨
  6. 6. Webアクセシビリティに取り組んだら これだけ売上げが伸びますよ!
  7. 7. Webアクセシビリティに取り組んだら これだけ売上げが伸びますよ!という話ではありません。
  8. 8. 一番伝えたい情報を もっと伝わるようにしませんか?
  9. 9. 中小企業サイトを運用している方に 「アクセシビリティやってみようかな」 と思っていただきたい。
  10. 10. 中小企業サイトを受託している方に 「アクセシビリティ勧めてみようかな」 と思っていただきたい。
  11. 11. なぜWebアクセシビリティは後回しにされるの?
  12. 12. 大企業はどんな理由で取り組むのか?
  13. 13. 2. なぜアクセシビリティに取り組むのか? キヤノンサイト基本理念とアクセシビリティ • アクセシビリティ → 保証
 機械可読性の向上 → 機会
 サイト品質の向上 → ブランドイメージ(共感) • キヤノンの製品分野は多岐に渡る
 → 様々な⽴場や環境のお客さまに対して
   情報保証をする義務
 → 企業のマーケティング活動の基盤を保証
  14. 14. それだけでは皆さんは納得しない...
  15. 15. https://www.smrj.go.jp/recruit/environment.html より
  16. 16. 1. 儲かるの? 2. コストがかかりそう 3. ウチには関係ない 3大ブレーキ
  17. 17. 1. 儲かるの?
  18. 18. 儲かるようには見えていない
  19. 19. ミクロ的:効果は見えやすい (使えない → 使える) マクロ的:定量的な効果測定が難しい 効果が見えにくい
  20. 20. alt="イラスト:グレーの猫" alt="" A B どちらが伝わりやすいのか?
  21. 21. どちらが伝わりやすいのか? 背景:ピンク 背景:黒 A B
  22. 22. ABテストをやってみよう。
  23. 23. サイト訪問者がスクリーンリーダーを 使ってるかどうかを知る術がない。
  24. 24. https://sbapp.net/appnews/app/upinfo/ios-12/voiceover-94603 より
  25. 25. https://support.apple.com/ja-jp/HT209655 より
  26. 26. 効果はミクロ的に実感しよう! ※ユーザビリティテストなどで実感することが可能
  27. 27. 機会損失のおそれ
  28. 28. 取りこぼしがあります。
  29. 29. PV :アクセスすることができた CVR:購入/申込みすることができた さまざまな指標 「することができなかった」は入っていない
  30. 30. 統計局ホームページ/人口推計(令和元年(2019年)5月確定値,令和元年(2019年)10月概算値) (2019年10月21日公表) より
  31. 31. 神奈川県年齢別人口統計調査結果 - 神奈川県ホームページ 岡山県の人口(平成31年3月1日) - 岡山県ホームページ(統計分析課) 障がいのある方々のインターネット等の利用に関する調査研究(平成24年6月)総務省 より 人口 障害者 :933万人 神奈川県:918万人 岡山県 :190万人 インターネット利用率 視覚障害者:91.7% 聴覚障害者:93.4%
  32. 32. 平成28年生活のしづらさなどに関する調査(全国在宅障害児・者等実態調査) より
  33. 33. 統計局ホームページ/令和元年/統計トピックスNo.121 統計からみた我が国の高齢者-「敬老の日」にちなんで- より
  34. 34. 機会損失
  35. 35. \この数字を取りに行きましょう/
  36. 36. SEO
  37. 37. https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=ja より
  38. 38. 儲かりそうなことは...
  39. 39. \ なんでもやってみよう /
  40. 40. 2. コストがかかりそう
  41. 41. Yesでもあり、Noでもある。
  42. 42. コストがかかるタイミング/そうでもないタイミング
  43. 43. アクセシビリティ対応だけのために 現行サイトを改修することは おススメしません。 • •
  44. 44. 膨大な費用が発生するかも知れません。
  45. 45. サイトのリニューアルや 新規コンテンツの追加など 何かのついでに始めましょう。 • • •
  46. 46. コストがかかる分野/そうでもない分野
  47. 47. 高コストな分野 (比較的) 低コストな分野 追加作業コスト 学習コスト JavaScript等のプログラム CMS等のサーバープログラム JIS X 8341-3 適合試験 ガイドライン作成 HTML CSS ビジュアルデザイン テキスト原稿
  48. 48. https://www.mitsue.co.jp/service/production/web_standards.html より
  49. 49. 4. JIS対応による効果 コスト低減 • 長い目で見ればメンテナンスコストは低下
 画像のテキスト化/マークアップの適正化 • ワンソースであればマルチデバイス対応時の コストは抑えられる 堅牢性が高くなると
  50. 50. タイミングや分野に気をつければ...
  51. 51. \ コストは抑えられる /
  52. 52. 3. ウチには関係ない
  53. 53. 本当にそうなのか?
  54. 54. Webサイトを持つ目的
  55. 55. • 商品を買ってもらいたい • サービスを利用してもらいたい • 会社の株を買ってもらいたい • 会社に就職してもらいたい ※ 広告は除く
  56. 56. • 商品を気に入ってもらいたい • サービスを気に入ってもらいたい • 会社の株を気に入ってもらいたい • 会社を気に入ってもらいたい
  57. 57. • 商品を知ってもらいたい • サービスを知ってもらいたい • 会社の株を知ってもらいたい • 会社を知ってもらいたい
  58. 58. 知ってもらいたい アクセシブルな状態 アクセスできる状態にしておく必要 多くの人にアクセスしてもらいたい 多くの人に情報を届けたい
  59. 59. アクセシビリティを向上させる Webサイトの目的達成への近道
  60. 60. 対岸の火事?
  61. 61. Webアクセシビリティに関する法律/政策が存在する国(2019年10月) 掲載国: Web Accessibility Laws & Policies | Web Accessibility Initiative (WAI) | W3C より
  62. 62. 法制化が進むと訴訟が増える。(乱暴)
  63. 63. マクドナルドが提訴されたと報道する記事(Cook County Record) より
  64. 64. https://www.buzzfeed.com/jp/skbaer/beyonce-website-accessibility-1 より
  65. 65. 日本では?
  66. 66. 内閣府:障害を理由とする差別の解消の推進 より
  67. 67. Web以外では訴訟も起きている。 視覚障害を理由とした事務職への配置転換は不当として 岡山短大の山口雪子准教授が提訴し勝訴 (ただし現在も授業担当から外された状況は続いている) https://yamaguti-yukiko-support.jimdo.com/ より
  68. 68. https://lineblog.me/ochiaihiroshi/archives/702531.html より 三井住友ビザカードサイトに設置されている「パズル認証」機能
  69. 69. radikoアプリのバージョンアップ時の不具合に対するツイートより https://blog.goo.ne.jp/despair-rp-hope/e/1c0518e52f9ee74d3024cca9e6cc3fc7 より
  70. 70. サービスを使えるレベルの 最低限のアクセシビリティは 担保しておくべきです。
  71. 71. 岡山でも取り組み始めた企業があります。
  72. 72. 某サイト「アクセシビリティ方針」より
  73. 73. 身近な数字で考える
  74. 74. 統計局ホームページ 岡山県の人口(平成31年3月1日) - 岡山県ホームページ(統計分析課) 岡山市のプロフィール人口|岡山市|市政情報|岡山市プロフィール 平成30年度西長瀬町内会事業報告書 より 総人口に対する障害者の比率 → 7.4% 全国 12,614万人 → 933万人 あの人は アクセスできなくていいの? A10班(32世帯) 64人 → 4人 岡山市 72万人 → 5万人 西長瀬町内会 1,770人 → 130人
  75. 75. アクセスできなくていい人なんかいない。 • • • • • • • • • • • •
  76. 76. 情報にアクセスできることは...
  77. 77. \ 基本的な人権です/
  78. 78. まとめ
  79. 79. 1. 儲かるの? 2. コストがかかりそう 3. ウチには関係ない 3大ブレーキ
  80. 80. • 効果はミクロ的に実感できる • 取りこぼしている数字がある • SEOにも効果あり 1. 儲かるの?
  81. 81. • タイミングや分野に気をつければ コストは抑えられる 2. コストがかかりそう
  82. 82. • Webサイトの目的達成への近道 • 訴訟に対するリスク管理 • 情報へのアクセスは基本的な人権 3. ウチには関係ない
  83. 83. @SawadaStdDesign ありがとうございました
  • MikiTsukada

    May. 1, 2020
  • xbs7

    Nov. 12, 2019
  • lunaluna_dev

    Nov. 7, 2019
  • nakanogen

    Nov. 5, 2019
  • syuichitsuji

    Nov. 3, 2019

2019/11/2(土)にハッシュタグにて行われた「リーダブルな昼下がり on 2019/11/02」でのセッションで使用したスライドです。

Views

Total views

1,713

On Slideshare

0

From embeds

0

Number of embeds

101

Actions

Downloads

3

Shares

0

Comments

0

Likes

5

×