Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
人にやさしく -Web アクセシビリティが必要な理由-
Search
Otsuka Yuhi
February 07, 2020
Design
29
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
人にやさしく -Web アクセシビリティが必要な理由-
Otsuka Yuhi
February 07, 2020
More Decks by Otsuka Yuhi
See All by Otsuka Yuhi
Web accessibilityが必要な理由
otsukayuhi
0
58
Other Decks in Design
See All in Design
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.3k
トランジションの冒険 自分と世界を変える冒険の書 / Transition Adventure
dmattsun
2
800
【Designship2026】「社内受託中心部署」から、事業とカルチャーを動かすデザイン組織へ
sugiyama_sukedachi
0
140
Starfall (2025)
rezaline
0
170
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
ayumidesign
0
270
泥臭く語るUIデザイン会|ホワイトボードチャレンジ【RAMEN TECH 2026】
garyuten
1
190
デザなに#1「問いのデザイン」の紹介LT
garyuten
0
150
デザインハーネスをつくるハーネス|誰でも自社らしいデザインをつくれるようにする仕組み
katakai
0
1.4k
Jun Wei Portfolio 2026
wjw100788
PRO
1
360
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
4.4k
コールセンターのオペレーターに6時間だけなってみた
h0sa
0
180
【2026】ポートフォリオ_大坪明日香
tsubo52
0
130
Featured
See All Featured
Game over? The fight for quality and originality in the time of robots
wayneb77
1
310
GraphQLとの向き合い方2022年版
quramy
50
15k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
31k
Code Review Best Practice
trishagee
74
20k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
12k
Mobile First: as difficult as doing things right
swwweet
225
10k
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
630
Measuring & Analyzing Core Web Vitals
bluesmoon
9
1k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
43k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
How GitHub (no longer) Works
holman
316
150k
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
Transcript
2020.2.7 Otsuka Yuhi 人にやさしく - Web accessibilityが必要な理由 -
あまりやさしくない話 からスタート
平成28年4月1日から施行 正式名称は、 「障害を理由とする差別の解消の推進に関する法律」 しょうがいしゃ さべつ かいしょう ほう 障害者差別解消法
ふとう さべつてきとりあつかい きんし 不当な差別的取扱いの禁止 ごうりてきはいりょ ていきょう 合理的配慮の提供
ふとう さべつてきとりあつかい きんし 不当な差別的取扱いの禁止 この法律では、国・都道府県・市町村などの役所や、会社や お店などの事業者が、障害のある人に対して、正当な理由 なく、障害を理由として差別することを禁止しています。
ごうりてきはいりょ ていきょう 合理的配慮の提供 この法律では、国・都道府県・市町村などの役所や、会社や お店などの事業者に対して、障害のある人から、社会の中 にあるバリアを取り除くために何らかの対応を必要としてい るとの意思が伝えられたときに、負担が重すぎない範囲で 対応すること(事業者に対しては、対応に努めること)を求め ています。
障害のある人から要望が あったときに、 出来る限り対応すること
Webサイトに置き換えると、
障害のある人でも利用できる Webサイト
そこで必要になるのが、
ウェブ アクセシビリティ Web accessibility
アクセシビリティ accessibility アクセシビリティ(英: accessibility)とは、近づきやすさやア クセスのしやすさのことであり、利用しやすさ、交通の便など の意味を含む。 現代では、広い種類の利用者が製品や建物、サービスなど を支障なく利用できる度合いを指していることが多い。 参照:http://e-words.jp/
ウェブ アクセシビリティ Web accessibility Webアクセシビリティとは、WebサイトやWebサービスが、 どんな人やどんな利用環境でもなるべく同じように閲覧・利 用できること。また、そのような状態が実現されている度合 い。 コンピュータやソフトウェアの違いや、子どもや高齢者、障害 者などの別によらず、なるべく多くの人がWebページにアク
セスして情報を取得できるよう配慮することを意味する。 参照:http://e-words.jp/
これって、
すべての人が利用できる Webサイト
つまり、
すべての人が利用できる Webサイトが、 法律レベルで求められている。
具体的には?
ウェブ コンテント アクセシビリティ ガイドライン Web Content Accessibility Guidelines (WCAG) 2.0
W3CがWebアクセシビリティを確立することを目的として、2008 年12月11日に勧告したドキュメント。 ウェブ コンテント アクセシビリティ ガイドライン Web Content Accessibility Guidelines
(WCAG) 2.0
W3CがWebアクセシビリティを確立することを目的として、2008 年12月11日に勧告したドキュメント。 ワールド ワイド ウェブ コンソーシアム W3C = World
Wide Web Consortium WWW(Web、ウェブ)で利用される技術の標準化をすすめる国際的な非営利団 体 ウェブ コンテント アクセシビリティ ガイドライン Web Content Accessibility Guidelines (WCAG) 2.0 参照:http://e-words.jp/
“このガイドラインに従うことで、全盲又はロービジョン、ろう又は 難聴、学習障害、認知障害、運動制限、発話困難、光過敏性 発作及びこれらの組合せ等を含んだ、様々な障害のある人に 対して、コンテンツをアクセシブルにすることができる。又、この ガイドラインに従うと、多くの場合、ほとんどの利用者にとって ウェブコンテンツがより使いやすくなる。” (一部抜粋) ウェブ コンテント アクセシビリティ
ガイドライン Web Content Accessibility Guidelines (WCAG) 2.0 参照:http://waic.jp/
• 意味のある順序: コンテンツが提示されている順序が意味に影響を及ぼす場合に は、正しく読む順序はプログラムによる解釈が可能である。 • 文字画像 (例外なし) : 文字画像は、純粋な装飾に用いられているか、テキストの特 定の表現が伝えようとする情報にとって
必要不可欠である場合に用いられている。 • 動き、点滅、スクロール: 動きのある、点滅している、又はスクロールしている情報 が、(1) 自動的に開始し、(2) 5秒よりも長く継続し、かつ、 (3) その他のコンテンツと 並行して提示される場合、利用者がそれらを 一時停止、停止、又は非表示にするこ とのできるメカニズムがある。 ウェブ コンテント アクセシビリティ ガイドライン Web Content Accessibility Guidelines (WCAG) 2.0 参照:http://waic.jp/
理想は、障害のある・なしに 関わらず、すべての人が 等しく情報を得ることが出来る Webサイト
= 人にやさしく(エモさ)
法律なんてなくても、 人にやさしいWebサイトを 作らなければならない。
ウェブ アクセシビリティ web accessibilityについて、 一緒に学んで行きましょう!
やさしさだけじゃ、 ひとは愛せないから
がんばれ!