Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
PWA is Progressive Web Accessibility
Search
Okuto Oyama
May 20, 2020
Technology
110
0
Share
PWA is Progressive Web Accessibility
PWA Night vol.16 #PWANight 発表資料
Okuto Oyama
May 20, 2020
More Decks by Okuto Oyama
See All by Okuto Oyama
Navigation APIと見るSvelteKitのWeb標準志向
yamanoku
2
160
Shifting from MCP to Skills / ベストプラクティスの変遷を辿る
yamanoku
5
1k
SchooでVue.js/Nuxtを技術選定している理由
yamanoku
4
8.7k
たかがボタン、されどボタン ~button要素から深ぼるボタンUIの定義について~ / BuriKaigi 2026
yamanoku
1
430
ひとりNavigation API Advent Calendarの紹介 / Mita.ts #9
yamanoku
1
170
DenoとJSRで実現する最速MCPサーバー開発記 / Building MCP Servers at Lightning Speed with Deno and JSR
yamanoku
2
630
転生したらTypeScriptのEnumだった件 ~型安全性とエコシステムの変化で挫けそうになっているんだが~ / TSKaigi 2025
yamanoku
0
67
React 18からのAPI useIDを使おう!/ Let's Use the useID API from React 18
yamanoku
0
160
リアクティブシステムの変遷から理解するalien-signals / Learning alien-signals from the evolution of reactive systems
yamanoku
3
2k
Other Decks in Technology
See All in Technology
ブラウザの投機的読み込みと投機ルールAPIを理解し、Webサービスのパフォーマンスを最適化する
shuta13
2
260
VespaのParent Childを用いたフィードパフォーマンスの改善
taking
0
180
小さいVue.jsを30分で作る
hal_spidernight
0
130
Digital Independence: Why, When and How
wannesrams
0
250
QAエンジニアはどうやって プロダクト議論の場に入れるのか?
moritamasami
1
320
「SaaSの次の時代」に重要性を増すステークホルダーマネジメントの要諦 ~解像度を圧倒的に高めPdMの価値を最大化させる方法~
kakehashi
PRO
3
3.6k
社内エンジニア勉強会の醍醐味と苦しみ/tamadev
nishiuma
0
280
AIが書いたコードを信じられない問題 〜レビュー負荷を下げるために変えたこと〜 / The AI Code Trust Gap: Reducing the Review Burden
bitkey
PRO
8
1.4k
Anthropic「Long-running a gents」をGeminiで再現してみた
tkikuchi
0
770
Building a Study Buddy AI Agent from Scratch: From Passive Chatbots to Autonomous Systems
itchimonji
0
120
知ってた?JavaScriptの"正しさ"を検証するテストが5万以上もあること(Test262)
riyaamemiya
0
130
20260428_Product Management Summit_tadokoroyoshiro
tadokoro_yoshiro
15
18k
Featured
See All Featured
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
340
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.2k
Evolving SEO for Evolving Search Engines
ryanjones
0
180
YesSQL, Process and Tooling at Scale
rocio
174
15k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Abbi's Birthday
coloredviolet
2
7.4k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
360
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
390
Done Done
chrislema
186
16k
Fireside Chat
paigeccino
42
3.9k
Automating Front-end Workflow
addyosmani
1370
200k
Transcript
PWA is Progressive Web … ? PWA Night vol.16 #PWANight
Okuto Oyama 2020/05/20 Wed
• CrowdWorks Inc. Front End Engineer • Accessibility Advocator Introduction
Okuto Oyama Twitter @ yamanoku GitHub @ yamanoku
PWA RTA in Japan @ PWA Night CONFERENCE 2020 LT
Reading...
PWA is Progressive Web App
I think so ...
PWA is Progressive Web Accessibility
PWA is Progressive Web Accessibility PWA Night vol.16 #PWANight Okuto
Oyama 2020/05/20 Wed
What is “Web Accessibility” ?
None
None
Accessibility is not for the people with disabilities.
Accessibility is for all people.
Live transcription and captioning in Android are a boon to
the hearing-impaired
こえのブログ by Ameba ブラウザ版先行リリース
Tokyo Metropolitan Government COVID-19 Task Force website
PWA & Web Accessibility
The checklist for making a good PWA from What makes
a good Progressive Web App?
Advantages of the PWA
PWA provide fast loading speed The Offline Cookbook | Web
Fundamentals | Google Developers
• PC ◦ Windows, MacOS, Linux... • Smart Phone ◦
iOS, Android, Samsung... • Tablet • Feature Phone ◦ KaiOS • etc… PWA can work on any device
• HTTPS Only ◦ Not mixed content ◦ Secure Connection
PWA is secure by default
Practice Web Accessibility
Reading about accessibility book
• Perceivable ◦ you know what it is. • Operable
◦ you can control it yourself. • Understandable ◦ you know what to do. • Robust ◦ It’s safe to use for any UA. The Four Principles of Accessibility
手触りのよいウェブを考える / better-mobile-web @ PWA Night vol.14
• Timing Adjustable ◦ Session Timeout • Error Identification ◦
Validation • Error Prevention (Legal, Financial, Data) ◦ Reset submit value • Error Suggestion ◦ Easily fix to form errors Accessibility check of server side
• Ameba Accessibility Guidelines • freeeアクセシビリティー・ガイドライン ドキュメント • 三井住友銀行Webアクセシビリティガイドライン •
Easy Checks – A First Review of Web Accessibility Check Web Accessibility Guideline
Lot to do ?
“Progressive”
Not 1 or 0, More than !
Start Small, Start Now !
GAAD Japan 2020(2020/05/21 オンライン)
アクセシビリティの祭典 2020 | Web・AI・IoT「障害者集団」が提案する アクセシビリティの近未来
Thanks for asking !
• https://scandiweb.com/blog/improve-website-accessibility-wi th-progressive-web-apps • https://waic.jp/docs/UNDERSTANDING-WCAG20/Overview.html • A11YJ Slack Group References