Five mistakes teams make with focus indicators
It comes up on almost every project, usually later than it should. These are the ones we run into repeatedly when we audit focus indicators.
Most of it is correctness rather than charity: use the right element and much of it happens automatically. Most teams find the first pass takes an afternoon and the maintenance takes minutes a month.
What to watch for
- Treating it as a launch task rather than an ongoing one
- Assuming someone else already owns it
- Removing the focus ring breaks the site for keyboard users
- A custom indicator is fine, no indicator is not
- Never checking whether the fix actually worked
Focus-visible gives you the best of both. It is worth being explicit about, because assumptions differ quietly. The practical test is whether someone new to the project could tell, in a minute, that it had been handled.
What to do next
How to tell if yours is fine
The cost of retrofitting accessibility is several times the cost of building it in. Three things worth confirming about focus indicators before you move on:
- Someone can say what the current setup is without going to look
- Focus-visible gives you the best of both — and you know whether that is true here
- There is a way to tell whether the last change to this helped
Pick the one that would hurt most if it failed, and start there.