9
kiki
102d

Took a web accessibility course somewhat recently. Here’s the list of typical accessibility problems according to those who use assistive technologies, from the most common to the least common:

1. CAPTCHA
2. Buttons and links that don’t work
3. Lacking/incorrect alt attribute
4. No input labels
5. Sudden layout shifts/content changes
6. Lacking/wrong headings
7. No keyboard access
8. Too many links
9. No skip link in header (https://en.wikipedia.org/wiki/...)
10. Lacking/broken search
11. Complicated and/or long forms
12. No closed captions for videos
13. Bad grammar
14. Bad contrast
15. Custom checkboxes
16. Custom dropdowns
17. Font size

I never knew CAPTCHA was THE worst offender. I also never knew that font size was perhaps the least problematic aspect.

Comments
  • 3
    Where did you get this course?
    Relevant to my Interests.
  • 4
    No keyboard access? Can't imagine.

    Sudden layout shifts grinds my gears indeed.

    Captcha, ha, fuck aws. They're crazy
  • 1
    Also interested where you took it
  • 1
    Idk if it's a browser bug but sometimes dropdowns close before the click gets handled
    Combined with no keyboard access it makes it literally impossible to use
  • 0
    @devRancid while terribly annoying, it's statistically insignificant according to assistive technology users, either because it's uncommon or because it's not infuriating. I think it's the former.
  • 3
    @retoor The keyboard issue usually happens because devs re-implement native browser functionality in half-assed JS.

    Like, and I've seen that in the wild, making a div with onclick handler that changes the document URL - instead of using a fucking anchor tag.
  • 1
    Honestly in terms of issue frequency, the most I usually see in my audits are color contrast and interactive controls without accessible descriptions. Side note: I really fucking wish WCAG would put a separate minimum font size rule in their upcoming versions. They group it into the contrast criterion unfortunately so people can get away with small fonts in certain scenarios legally :(
  • 2
    @shovethisrant My take is, make everything including layout font size relative instead of py based, never set the font size in px (i.e. don't fuck with whatever the user has set to be his 100%), and ideally don't go below 100%.
  • 1
    @Fast-Nop for sure - also, a lot of people neglect to test that it’s also accessible on different zoom levels - headings/text cutoff, can’t reach any controls, etc…
  • 1
    @shovethisrant Browser zoom is the easy part, but go into the browser font size setting and increase the default from 16px to e.g. 32px without zoom, that's where good website CSS shines over bad one. :)
  • 1
    @Fast-Nop killing it! All the right answers
Add Comment