Presented at RubyConf 2016. Ligtning Talk on common accessibility issues and solutions

1. Accessibility
Jen Pengelly
Excella Consulting
Arlington, VA
@jenpengelly

2. Why Web Accessibility Matters
• Make our sites more functional and usable
• We want our users to be happy
• Sometimes it is the law

3. Test it!
Skip Links
Keyboard Traps
Loss of Focus

4. Tools for Testing
• WebAIM (http://wave.webaim.org/)
• WAVE Chrome Extension (http://
wave.webaim.org/extension/)
• Legal requirements may require use of a specific
testing tool or standard

5. Contrast Issues
Typical Passing Ratio is 4.5:1

6. Alt Tags
Images need an alt tag
• Keep it concise (150 characters or less)
• But make it meaningful
• Decorative images can include an empty alt tag
(alt=“”)

7. Form Attributes
Labels need a ‘for’ attribute to make the input’s id
Other form elements or inputs (i.e. select) without a label
should have a title attribute

8. Turn Off CSS
• Ensure content is laid out in a logical and easy to
understand way when stylesheets are disabled.
• Minimize use of CSS to hide and show content if it
disrupts the logical flow of content
• Use partials or front end frameworks

9. Thank you!!
If you’d like to know more or want to share
anything with me, please find me!!
@jenpengelly