Slides from Thinkful Accessibiilty Lecture by JP DeVries

1. ALL USERS ARE
DISABLED
even you

2. WHEN YOU SWITCH FROM YOUR DESKTOP TO SMARTPHONE CAN YOU?
➤ RIGHT CLICK?
➤ VIEW THE SOURCE OF A WEBPAGE?
➤ VIEW 5 APPS AT ONCE?
➤ GOBBLE UP ALL THE BITS YOU PLEASE?

3. WHEN YOU SWITCH BACK TO YOUR DESKTOP DOES IT?
➤ KNOW WHERE IT IS IN THE WORLD?
➤ FIT IN YOUR POCKET?
➤ PINCH ZOOM?
➤ PLACE CALLS?

4. WHEN THE BATTERIES IN YOUR MOUSE DIE
➤ CAN YOU USE IT?

5. WHEN JAVASCRIPT CAKES ITS PANTS DOES YOUR SITE WORK?
➤ I HOPE SO…
➤ ¯_(ツ)_/¯

6. DOES YOUR
USER’S
BROWSER
SUPPORT
WEBFONTS?
Who knows?

7. THERE ARE PEOPLE AND THERE ARE USERS
There are people and there are users and any given person
can be a number of users throughout the day.
Your abilities are not just relative to yourself; they are also
relative to the device you access experiences through

8. ARCHITECTING THE WEB
➤ Experiences you create are
buildings entered, re-visited,
and avoided by a wide
audience of users
➤ while our abilities may very
greatly and change with time
we all justly deserve access
➤ just like in the real world

9. ASSISTIVE TECH IS THE BEST TECH
Design is for everyone – design for everyone

17. DESIGN
FOR
JUSTICE
not for equality

19. ACCESSIBLE ICON
➤ The Accessible Icon Project is
an ongoing work of design
activism.
➤ It starts with a graphic icon,
free for use in the public
domain, and continues its
work as a collaboration among
people with disabilities and
their allies toward a more
accessible world

20. BANDWIDTH AND ACCESSIBILITY

21. ➤ Brazilians work 1 hour for every 14.5MB of access to the web
➤ Some people pay for web access by the byte, not by
the month
➤ People pay *cash* to access the experiences you author.
Never forget that.
➤ Be as light as you can on bandwidth
➤ Optimize Images
➤ Always put your content behind GZIP’ed HTML
➤ Leverage the Browser Cache
➤ Don’t use Icon Fonts.
Seriously though don’t use Icon Fonts.
Ever.
BANDWIDTH AND ACCESSIBILITY

23. HOW DO YOU SUPPORT LOW BANDWIDTH UERS?
➤ Your experience is only as strong as your weakest
point of access
➤ By starting HTML first and progressively enhancing you win
half the battle…
… but there is more to consider
➤ GZIP! GZIP! GZIP!
➤ Far Future Reaching Expiry Dates
➤ HTTP/2?
➤ Silence your CSS Footprint

25. YOU ARE NOT YOUR DISABILITY
Assistive Technology allows the physically impaired just access
and opportunity in the digital age

26. ISN’T
JAVASCRIPT
EVERYWHERE?
Nope.

27. JAVASCRIPT
➤ is risky
➤ fatally crashes on missing semicolon
➤ is awesome
➤ provides amazing asynchronous enhancements
➤ is not designed to deliver semantic content
➤ ~1% failure rate

28. WHY SHOULD WE SUPPORT USERS WITHOUT JAVASCRIPT?
➤ performance
➤ search engine optimization
➤ reliability
➤ reach
➤ accessibility
➤ standards

29. HOW DO WE SUPPORT USERS WITHOUT JAVASCRIPT?
➤ <noscript>?
➤ <noscript> is great, but doesn’t help in situations when
JavaScript is enabled but fails to load or dies on a fatal error

30. HOW DO WE SPLIT UP FRONT END PRIORITIES?

31. WHAT DO PEOPLE COME
TO YOUR
WEBSITE FOR?

32. JAVASCRIPT?

33. NOPE.

34. AJAX?

35. NOPE.

36. REACT!

37. NOPE.

38. THAT PRETTY
STYLESHEET?
(sorry designers)

39. NOPE.

40. SO WHAT THEN?

41. CONTENT

42. PRIORITIZE CONTENT THROUGHOUT YOUR PROCESS

43. PRIORITIES ARE DEPENDENT TO EACH PROJECT
➤ Look at your metrics and analytics
➤ Evaluate what is bringing people to your experience
➤ Ask yourself what is more important branding or async
enhancements?
➤ Focus on content, branding, then enhancements

44. CONTENT, BRANDING, ENHANCEMENTS
make asynchronous enhancements your last priority

45. CSS
NAKED
DAY
flaunt your DOM
April 9th