Found a simple trick for making forms work better for screen reader users

I was testing a checkout form last week and realized the error messages weren't being read aloud at all. Adding aria-describedby to link each field to its error message fixed it in about 10 minutes. Has anyone else found a quick fix that made a big difference for accessibility?

2 comments

2 Comments

diana555d ago

Wait, seriously just adding one attribute fixed it that easily?

paul_burns5d ago

Good lord, yeah, that's usually how it goes with CSS. One missing attribute can break everything. But @diana55, what specific attribute was it? I'm always curious about these "one-line fixes" because half the time it's something like a missing `position: relative` on a parent or a typo in a class name (been there). I've spent hours chasing bugs that were just a forgotten `display: block` on a button element. Makes you feel both relieved and stupid at the same time.