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
150
Shifting from MCP to Skills / ベストプラクティスの変遷を辿る
yamanoku
4
970
SchooでVue.js/Nuxtを技術選定している理由
yamanoku
4
8.6k
たかがボタン、されどボタン ~button要素から深ぼるボタンUIの定義について~ / BuriKaigi 2026
yamanoku
1
420
ひとりNavigation API Advent Calendarの紹介 / Mita.ts #9
yamanoku
1
160
DenoとJSRで実現する最速MCPサーバー開発記 / Building MCP Servers at Lightning Speed with Deno and JSR
yamanoku
2
620
転生したらTypeScriptのEnumだった件 ~型安全性とエコシステムの変化で挫けそうになっているんだが~ / TSKaigi 2025
yamanoku
0
65
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
AIエージェントを構築して感じた、AI時代のCDKとの向き合い方
smt7174
1
250
最新の脅威動向から考える、コンテナサプライチェーンのリスクと対策
kyohmizu
0
110
シン・リスコフの置換原則 〜現代風に考えるSOLIDの原則〜
jinwatanabe
0
210
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
4
23k
AIを共同作業者にして書籍を執筆する方法 / How to Write a Book with AI as a Co-Creator
ama_ch
2
110
Discordでリモートポケカしてたら、なぜかDOを25分間動かせるようになった話
umireon
0
140
Eight Engineering Unit 紹介資料
sansan33
PRO
3
7.2k
聞き手の目線で考えるプロポーザル
takefumiyoshii
0
410
#jawsugyokohama 100 LT11, "My AWS Journey 2011-2026 - kwntravel"
shinichirokawano
0
270
ある製造業の会社全体のAI化に1エンジニアが挑んだ話
kitami
2
980
Digitization部 紹介資料
sansan33
PRO
1
7.3k
QGISプラグイン CMChangeDetector
naokimuroki
1
260
Featured
See All Featured
A better future with KSS
kneath
240
18k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
1
1.5k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
880
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
68
38k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
180
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
120
Embracing the Ebb and Flow
colly
88
5k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.8k
The Pragmatic Product Professional
lauravandoore
37
7.2k
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
1
2.5k
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