Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Web Accessibility
where to start?
Rian Rietveld
WordPress Engineer @ Human Made
It’s a team effort
• Client
• Project manager
• Information architect
• Designer
• Developer
• Content manager
Everyone is involved
Change your
point of view!
You are a high end user
But your visitors may not be
Don’t create a website
for yourself
So, what should you do?
Project manager
What not to do
Check the accessibility at the end,
just going before online
Start project
• include accessibility from the beginning
• train your people and yourself
• it is an integral part of the ...
Information architect
Don’t add
A11y Pizza
Browsers get smarter
Users have their own AT
Think twice
about functionality
Can we use this plugin?
Designer
Good read
medium.com/salesforce-ux/7-things-every-designer-
needs-to-know-about-accessibility-64f105f0881b
7 Things Every ...
Colour contrast
Contrast matters
Contrast matters
Contrast matters
Contrast matters
contrastchecker.com
Not by colour alone
I'm gonna make you an offer you can't refuse
I'm gonna make you an offer you can't refuse
Sim Daltonism
Developer
Accessibility !== Black Magic
Use semantic,
meaningful HTML5
Good read
HTML5doctor.com
developer.mozilla.org
Headings
• one unique <h1> per view
• the rest meaningful
• do not skip a level
<div> and <span>
don’t work with
keyboard only
<button> for action
<a> for location
Make it work
before you make it nice
Content manager
Good read
foxland.fi/writing-accessible-content/
Writing Accessible Content
by Sami Keijonen
Meaningful link text
• click here
• read more
• continue reading
• download
Wrong link texts
( good SEO === accessibility )
Test software!
aXe by Deque Labs
Browser add-on
deque.com/products/axe/
WAVE
Chrome plugin
or online

http://wave.webaim.org
Keyboard test!
rianrietveld.com/keyboard/
Change your
point of view!
users
over authors
over implementors
over specifiers
over theoretical purity
W3C HTML Design Principles
@rianrietveld
slideshare.net/rianrietveld
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
WordCamp Brighton: Web Accessibility, where to start
Upcoming SlideShare
Loading in …5
×

WordCamp Brighton: Web Accessibility, where to start

1,487 views

Published on

You want to learn how to build an accessible WordPress website or plugin and have no idea what is important or where to start? Let me give you some tips.

Published in: Internet
  • Be the first to comment

WordCamp Brighton: Web Accessibility, where to start

  1. 1. Web Accessibility where to start? Rian Rietveld WordPress Engineer @ Human Made
  2. 2. It’s a team effort • Client • Project manager • Information architect • Designer • Developer • Content manager
  3. 3. Everyone is involved
  4. 4. Change your point of view!
  5. 5. You are a high end user
  6. 6. But your visitors may not be
  7. 7. Don’t create a website for yourself
  8. 8. So, what should you do?
  9. 9. Project manager
  10. 10. What not to do Check the accessibility at the end, just going before online
  11. 11. Start project • include accessibility from the beginning • train your people and yourself • it is an integral part of the project, like responsive design
  12. 12. Information architect
  13. 13. Don’t add A11y Pizza
  14. 14. Browsers get smarter Users have their own AT
  15. 15. Think twice about functionality
  16. 16. Can we use this plugin?
  17. 17. Designer
  18. 18. Good read medium.com/salesforce-ux/7-things-every-designer- needs-to-know-about-accessibility-64f105f0881b 7 Things Every Designer Needs to Know 
 about Accessibility by Jesse Hausler
  19. 19. Colour contrast Contrast matters Contrast matters Contrast matters Contrast matters
  20. 20. contrastchecker.com
  21. 21. Not by colour alone I'm gonna make you an offer you can't refuse I'm gonna make you an offer you can't refuse
  22. 22. Sim Daltonism
  23. 23. Developer
  24. 24. Accessibility !== Black Magic
  25. 25. Use semantic, meaningful HTML5
  26. 26. Good read HTML5doctor.com developer.mozilla.org
  27. 27. Headings • one unique <h1> per view • the rest meaningful • do not skip a level
  28. 28. <div> and <span> don’t work with keyboard only
  29. 29. <button> for action <a> for location
  30. 30. Make it work before you make it nice
  31. 31. Content manager
  32. 32. Good read foxland.fi/writing-accessible-content/ Writing Accessible Content by Sami Keijonen
  33. 33. Meaningful link text
  34. 34. • click here • read more • continue reading • download Wrong link texts
  35. 35. ( good SEO === accessibility )
  36. 36. Test software!
  37. 37. aXe by Deque Labs Browser add-on deque.com/products/axe/
  38. 38. WAVE Chrome plugin or online
 http://wave.webaim.org
  39. 39. Keyboard test! rianrietveld.com/keyboard/
  40. 40. Change your point of view!
  41. 41. users over authors over implementors over specifiers over theoretical purity W3C HTML Design Principles
  42. 42. @rianrietveld slideshare.net/rianrietveld

×