Post on 23-Jan-2018
Everything you never dreamed to ask about accessibility of your WordPress Site
THE GOOD, THE BAD AND THE MYSTERIOUS
ELIANNA JAMES, I BREAK WEBSITES LLC
What’s the issue, really?Web designed for people who can see, hear, move a mouse, perform hand gestures and who think in fairly standard ways
What about the millions (estimated 20% of world population) that have some physical or mental limitations?
Assistive Technology can fill the gaps ( examples: screen readers/ magnifiers for blind/ visually impaired, keyboards and sip/puff technology for people with physical limitations)
All these techs have to “talk” to each other to work properly.
It’s a constant process as technology improves/ changes and new technologies are invented.
Use of internet and
© I BREAK WEBSITES LLC ELIANNA JAMES
Wordpress.org has an opinionWordPress Accessibility Coding Standards These are standards that WordPress features should meet for accessibility in order to be merged into core. All new or updated code released in WordPress must conform with the WCAG 2.0 guidelines at level AA. These basic guidelines are intended for easy reference during development, but do not cover all possible accessibility issues.
WordPress Accessibility Forum https://wordpress.org/support/forum/accessibility/
WordPress accessibility plugin https://wordpress.org/plugins/wp-accessibility/
© I BREAK WEBSITES LLC ELIANNA JAMES
The Good News re WordPressThemes designed for accessibility
Simple = Better
https://en.support.wordpress.com/accessibility/
A lot of choices
https://wordpress.com/themes/filter/accessibility-ready
Twenty Fourteen
2014 magazine theme
https://wordpress.com/theme/twentyfourteen
© I BREAK WEBSITES LLC ELIANNA JAMES
The Bad News (how well are we doing?)Web (and devices) are everywhere
Much of web development has paid little attention to the needs of people who use assistive technology; this is especially true with the more media heavy sites.
How do you see a photo if you are blind?
How do you hear a video if you are deaf?
How do you click a button to buy something if you can’t move a mouse?
© I BREAK WEBSITES LLC ELIANNA JAMES
Grey AreasAccessibility is a moving target as browsers, OS and assistive technology changes frequently
What is accessible to one person may completely be inaccessible to another
Cognitive issues - ADHD, Traumatic Brain Injury (bottom line - care, but not too much. One person’s solution is another person’s failure to comprehend)
Unofficial disabilities - ESL, chronic illnesses (96% of those people show no outward signs of their illnesses)
Conclusion: do the best you can. Take feedback very seriously. Get a friend or associate who uses assistive technology to test and evaluate.
© I BREAK WEBSITES LLC ELIANNA JAMES
How to check your siteWAVE Toolbar
Free
Super Easy to Use with Chrome
https://chrome.google.com/webstore/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh?hl=en-US
Super Easy to Use with Firefox
https://addons.mozilla.org/en-us/firefox/addon/wave-accessibility-tool/
DEMO
© I BREAK WEBSITES LLC ELIANNA JAMES
WordPress Plugins for AccessibilityJoe Dolson’s WordPress accessibility Plugin
https://wordpress.org/plugins/wp-accessibility/
Customizable.
Works with many, not all, themes
Add skip links. You can define the target location.
Add an outline to keyboard focus
Add a toolbar (high contrast, large print, grayscale views)
Long description to images
Enforce use of alt text
© I BREAK WEBSITES LLC ELIANNA JAMES
WordPress themes developed for a11yUp to date: 7/6/17:
https://www.kasareviews.com/accessibility-ready-wordpress-themes/
© I BREAK WEBSITES LLC ELIANNA JAMES
Mobile WordPress Themeshttps://en.support.wordpress.com/themes/mobile-themes/
Mobile ready theme
© I BREAK WEBSITES LLC ELIANNA JAMES
Adding accessibility bugsUsing your WordPress login go here: https://core.trac.wordpress.org/newticket
https://codex.wordpress.org/Accessibility
Search for an issue similar to the one you detected by testing.
If you have additional comments add them.
If the issue hasn’t been reported yet then create a new one.
DEMO
© I BREAK WEBSITES LLC ELIANNA JAMES
Accessibility tips for non-codersMelissa Jean Clark, WordPress website developer
https://melissajclark.ca/website-accessibility-tips/
If you want to dig deeper use WAVE by WebAim or aXe by deque
aXe - a FREE, automated accessibility test tool. (Recommended by the SelectWoo test team on github: https://github.com/woocommerce/woocommerce/issues/16003
Download the tool:
https://www.deque.com/products/axe/
© I BREAK WEBSITES LLC ELIANNA JAMES
Join the teamJoin the Make WordPress Accessible team
On Make WordPress Accessible you can find information about the team and the work they do.
How you can help:
write documentation on WordPress and accessibility;
test WordPress themes;
report accessibility issues in core and core themes;
fix accessibility issues by writing patches
If you want to know more, ask your questions in Slack or fill out the form at the teams contact page.
© I BREAK WEBSITES LLC ELIANNA JAMES
ResourcesMake WordPress Accessible: https://make.wordpress.org/accessibility/useful-tools/
Joe Dolson: https://www.joedolson.com/
Contact me for additional resources. I prefer LinkedIn invites and communicate via LinkedIn most of the time.
Any feedback is most appreciated and will make future presentations more useful.
elianna james - LinkedIn Profile
720-425-1001
© I BREAK WEBSITES LLC ELIANNA JAMES