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
PWA is Progressive Web Accessibility
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
yamanoku
May 20, 2020
Technology
120
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
PWA is Progressive Web Accessibility
PWA Night vol.16 #PWANight 発表資料
yamanoku
May 20, 2020
Transcript
36 slides
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
More Decks by yamanoku
See All by yamanoku
大型犬好きによるPugの紹介
yamanoku
1
180
SvelteのHTMLはどう解釈されているのか / How Svelte compile HTML
yamanoku
1
350
Navigation APIと見るSvelteKitのWeb標準志向
yamanoku
2
290
Shifting from MCP to Skills / ベストプラクティスの変遷を辿る
yamanoku
5
1.2k
SchooでVue.js/Nuxtを技術選定している理由
yamanoku
4
9k
たかがボタン、されどボタン ~button要素から深ぼるボタンUIの定義について~ / BuriKaigi 2026
yamanoku
1
600
ひとりNavigation API Advent Calendarの紹介 / Mita.ts #9
yamanoku
1
240
DenoとJSRで実現する最速MCPサーバー開発記 / Building MCP Servers at Lightning Speed with Deno and JSR
yamanoku
2
790
転生したらTypeScriptのEnumだった件 ~型安全性とエコシステムの変化で挫けそうになっているんだが~ / TSKaigi 2025
yamanoku
0
91
Other Decks in Technology
See All in Technology
プロダクションコードにおける encoding/json から encoding/json/v2 へのスムーズな移行
sansantech
PRO
1
390
Steering と Hook (チームの決まりを守らせる) | 目指せ Kiro マスター 06
inariku
PRO
2
110
GCASアップデート(202607-202610)
techniczna
1
260
In-Context Learning再入門。ICLの勾配降下的解釈の研究動向を追ってみる。
dai08srhg
1
810
Agent Harnessはどう作る?事例から学ぶAI Agentの設計思想
sergicalsix
0
280
Reticulum, le réseau cypherpunk dont vous avez besoin !
rlifchitz
0
130
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
17
120k
AWS構成から考えるWebセキュリティ ― WordPressの構築経験から考える公開範囲と更新運用【JAWS FESTA 2026 in AKITA】
cscengineer
PRO
2
420
AWS基盤改善を支える 私たちの理念と行動指針
kentosuzuki
0
180
bpf_arenaとstruct_opsを使うのが難しかった話
masu_mi
0
230
81天的 AI Agent 軟體開發團隊治理實務分享
regionbbs
0
160
AI時代に求められる優秀なTechLeadの振る舞い
pospome
11
16k
Featured
See All Featured
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
2
3k
We Have a Design System, Now What?
morganepeng
55
8.4k
Paper Plane (Part 1)
katiecoart
PRO
3
12k
The Pragmatic Product Professional
lauravandoore
37
7.5k
Prompt Engineering for Job Search
mfonobong
0
580
Fashionably flexible responsive web design (full day workshop)
malarkey
409
67k
Designing Experiences People Love
moore
143
24k
Testing 201, or: Great Expectations
jmmastey
46
8.4k
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
990
The SEO identity crisis: Don't let AI make you average
varn
0
630
First, design no harm
axbom
PRO
2
1.4k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
660