Universal web design [HackerYou a11y club]

HackerYou a11y club
2016-10-24

Transcript

1. UNIVERSAL WEB DESIGN DAVE NE WTON • @N EWTRON HACKE RYO U A 11Y CLUB 2016
3. Image: Boileau <boileau.pro/blog/luniversal-design-vous-connaissez/>
4. Image: Baanlaesuan <www.baanlaesuan.com/12813/home-ideas-1/universal-design-2/>
5. Image: Goodnight Raleigh <goodnightraleigh.com/2012/01/nc-state-with-a-brickyard-under-construction/>
6. Image: Museum of Disability History <museumofdisability.org/virtual-museum/advocacy-wing/self-advocacy-exhibit/>
7. Rehabilitation Act (1973) Americans with Disabilities Act (1990) Vocational Rehabilitation Amendment Act (1965) Architectural Barriers Act (1968) Education for Handicapped Children Act (1975) Fair Housing Amendments Act (1988) Image: Museum of Disability History <museumofdisability.org/virtual-museum/advocacy-wing/self-advocacy-exhibit/>
8. Image: Wikimedia Commons <commons.wikimedia.org/wiki/File:Non-wheelchair_Ramp_IMG_0908.JPG>
9. Image: Flashmoment <flashmomentcontinued.wordpress.com/2016/01/21/nyc-solomon-r-guggenheim-museum-ಅ嬄槹‧r‧ݘ໑ၹঢᗦ悬沣-20151123>
10. Image: Wikimedia Commons <commons.wikimedia.org/wiki/File:Non-wheelchair_Ramp_IMG_0908.JPG>
11. “ Universal design is the design of products and environments to be usable by all people… ” 
 —Ron Mace
12. Images: CREEC <creeclaw.org/curb-cut-investigation/>, Encore <www.encorekalamazoo.com/creating-curb-cuts>
13. Now
15. Disability
16. Disability Performance
17. Disability Performance Browsers/devices
18. “ Your success as a developer is not determined by the tools that you use, or even the style of your code, it is the business impact that your code has… ” 
 —Steven Michael Thomas
19. Make it easy Make it possible
20. Make it easy Make it possible (maybe)
21. Make it easy Make it possible (maybe)
22. Make it easy Make it possible (maybe)
23. Disability
25. 19% of people have a disability CDC <www.cdc.gov/nchs/fastats/disability.htm> Colour Blind Awareness <www.colourblindawareness.org/colour-blindness/> UNH <www.disabilitycompendium.org/docs/default-source/2014-compendium/annual-report.pdf>
26. 19% of people have a disability —
 4% of adults have cognitive disabilities 8% of men (and 0.5% of women) are color blind 9% of adults have vision trouble 15% of adults have physical functioning difficulty 17% of adults have hearing trouble CDC <www.cdc.gov/nchs/fastats/disability.htm> Colour Blind Awareness <www.colourblindawareness.org/colour-blindness/> UNH <www.disabilitycompendium.org/docs/default-source/2014-compendium/annual-report.pdf>
27. 19% of people have a disability —
 4% of adults have cognitive disabilities 8% of men (and 0.5% of women) are color blind 9% of adults have vision trouble 15% of adults have physical functioning difficulty 17% of adults have hearing trouble —
 100% of people will be disabled in some way, at some point CDC <www.cdc.gov/nchs/fastats/disability.htm> Colour Blind Awareness <www.colourblindawareness.org/colour-blindness/> UNH <www.disabilitycompendium.org/docs/default-source/2014-compendium/annual-report.pdf>
28. The disability market is about the size of China and is emerging as other markets have in the past— 1.3 billion people and $1.2 trillion in annual disposable income Return on Disability <www.rod-group.com/insights>
29. Performance
31. 33% of US adults don’t have home broadband Pew <www.pewinternet.org/2015/12/21/home-broadband-2015/>
32. 33% of US adults don’t have home broadband —
 46% of black adults 50% of Hispanic adults —
 37% of adults who make $20k–$50k/year 59% of adults who make under $20k/year —
 45% of adults in rural areas Pew <www.pewinternet.org/2015/12/21/home-broadband-2015/>
34. 19% of mobile connections in the US aren’t 4G/LTE OpenSignal <opensignal.com/reports/2016/02/state-of-lte-q4-2015/>
 Ericsson <www.ericsson.com/res/docs/2014/regional-appendices-sea-final-screen.pdf>
35. 19% of mobile connections in the US aren’t 4G/LTE 24% of mobile connections in Canada OpenSignal <opensignal.com/reports/2016/02/state-of-lte-q4-2015/>
 Ericsson <www.ericsson.com/res/docs/2014/regional-appendices-sea-final-screen.pdf>
36. 19% of mobile connections in the US aren’t 4G/LTE 24% of mobile connections in Canada 47% of mobile connections in the UK 51% of mobile connections in India OpenSignal <opensignal.com/reports/2016/02/state-of-lte-q4-2015/>
 Ericsson <www.ericsson.com/res/docs/2014/regional-appendices-sea-final-screen.pdf>
37. 19% of mobile connections in the US aren’t 4G/LTE 24% of mobile connections in Canada 47% of mobile connections in the UK 51% of mobile connections in India 75% of mobile connections in Indonesia are 2G OpenSignal <opensignal.com/reports/2016/02/state-of-lte-q4-2015/>
 Ericsson <www.ericsson.com/res/docs/2014/regional-appendices-sea-final-screen.pdf>
38. Browser and device support
39. Image: OpenSignal <opensignal.com/reports/2015/08/android-fragmentation/>
40. If you only support IE11+ and latest two versions of Chrome, Firefox, Opera, Safari: 360 Safe Browser Android BlackBerry Coc Coc IE (old) IEMobile (old) Maxthon MeeGo Microsoft-WebDAV Mozilla NetFront Nokia Phantom Puffin QQ Browser Samsung Internet StatCounter <gs.statcounter.com/#all-browser_version-ww-monthly-201609-201609-bar> Sogou Explorer Sony PS3 Sony PS4 SonyEricsson Tizen UC Browser Yandex Browser Other/unknown
41. If you only support IE11+ and latest two versions of Chrome, Firefox, Opera, Safari: you don’t support 30.03% of network traffic 360 Safe Browser Android BlackBerry Coc Coc IE (old) IEMobile (old) Maxthon MeeGo Microsoft-WebDAV Mozilla NetFront Nokia Phantom Puffin QQ Browser Samsung Internet + older Chrome/Chromium, Firefox, Opera/Opera Mini, Safari StatCounter <gs.statcounter.com/#all-browser_version-ww-monthly-201609-201609-bar> Sogou Explorer Sony PS3 Sony PS4 SonyEricsson Tizen UC Browser Yandex Browser Other/unknown
42. Opera Mini UC Browser StatCounter <gs.statcounter.com/#all-browser-IN-monthly-201609-201609-bar>
43. Opera Mini UC Browser StatCounter <gs.statcounter.com/#all-browser-IN-monthly-201609-201609-bar>
45. JavaScript is not the enemy
46. JavaScript is not the enemy JavaScript is your friend
47. JavaScript is not the enemy JavaScript is your friend but…
49. 1.1% of visits get a broken JavaScript experience gov.uk <gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement/>
50. 1.1% of visits get a broken JavaScript experience — 0.1% turn it off or have a browser that doesn’t support it gov.uk <gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement/>
51. 1.1% of visits get a broken JavaScript experience — 0.1% turn it off or have a browser that doesn’t support it 0.9% have JS that messes up gov.uk <gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement/>
52. page/script download malware blocking/manipulating scripts script parsing plugins/apps blocking/manipulate scripts firewalls CDN failure flakey/dropped connections poorly-written JS ISP blocking/manipulating scripts browsers without modern JS support 1.1% of visits get a broken JavaScript experience — 0.1% turn it off or have a browser that doesn’t support it 0.9% have JS that messes up gov.uk <gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement/>
53. Image: Why availability matters <www.kryogenix.org/code/browser/why-availability/>
54. Image: Why availability matters <www.kryogenix.org/code/browser/why-availability/>
55. Tomorrow
57. Resilience
58. “ At Internet scale, the best you can hope for is to build a reliable software platform on top of components that are completely unreliable. That puts you in an environment where complex failures are both inevitable and unpredictable. ” 
 —Jesse Robbins ACM Queue <queue.acm.org/detail.cfm?id=2371297>
59. separate but equal? nope.
60. Guess this wasn’t worthwhile…
61. Tap here to get the features you need
62. Click here to feel othered
63. I C PAPER
64. I C PAPER PAPER
65. Performance Accessibility Progressive Enhancement Responsive web design
66. let’s talk about progressive enhancement for a moment
67. Map your work to your users’ reality
68. “ Universal design is the design of products and environments to be usable by all people… ” 
 —Ron Mace
69. Universal web design is making the web usable by all people.
70. UNIVERSAL WEB DESIGN DAVE NE WTON • @N EWTRON HACKE RYO U A 11Y CLUB 2016