Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Good intentions gone bad

Good intentions gone bad

JSHeroes 2024

Eva Ferreira

May 23, 2024

More Decks by Eva Ferreira

Other Decks in Programming


  1. Not another “This is how you do a11y” talk Good

    intentions gone bad. @evaferreira92
  2. WARNING This is a work in progress. I will, most

    definitely, keep on messing up. @evaferreira92
  3. 5 lessons 1. Accessibility personas 2. Simplest things first 3.

    People mean well 4. Test, test, test! 5. Accessibility ownership
  4. Simplest things tend to have the biggest impact. I went

    ALL IN into aria and screen readers
  5. I wrongly prioritized screen readers over keyboard navigation Begin your

    a11y journey with simple and impactful changes. @evaferreira92
  6. Simple, impactful • Color contrast • Semantics • Keyboard navigation

     Outlines  Skip navigation links @evaferreira92
  7. Sometimes simple is not that simple “Code debt just called;

    it wants your happiness back.” @evaferreira92
  8. Prioritize 1. Big impact, easy to solve 2. Mix with

    small impact, easy to solve Ideal for Fridays 3. Big impact, hard to solve 4. Small impact, hard to solve @evaferreira92
  9. Rules for alternative texts • The alt attribute is compulsory

    • It can be empty if the image is decorative (alt=“”) • Do not be redundant • If it has an action, describe the action, not the image @evaferreira92
  10. The SEO in the room And the story of how

    every image had the same alt text. @evaferreira92
  11. Test users’ stories • Can a user with keyboard navigation

    - create an account? • Can a user with a screen reader - add a product to the cart? • Can a user watch this video - using captions? @evaferreira92
  12. WCAG • Set of rules created by W3C a long

    time ago. • Standard in the industry • What gives the foundation for a11y laws all around the globe • Different success criteria depending on target audience, target country, type of company, etc. @evaferreira92
  13. Automated tools • Add these to your pipelines • CI/CD

    should fail when requirements are not met. @evaferreira92
  14. You don’t need to be always right. Aim for making

    new mistakes instead of repeating old ones. @evaferreira92