Some web professionals say that The Web Needs a Native .visually-hidden. I respectfully disagree, particularly as a matter of priority.
A visually-hidden CSS class, as it’s often named, is used to visually hide textual content from sighted users but expose it to screen reader users. This is a common practice in web development, too common in my opinion. Another name for the class you’ll come across is “sr-only” (which I believe stemmed from Bootstrap but was modified in version 5). The properties of the class are complex and implemented in different ways.
So technically, this may be true—a native HTML attribute for the same functionality would be somewhat useful. But it’s not anywhere near the importance of other, more foundational needs. My point is that, in the big picture, a native visually-hidden should be much, much lower on the priority list. So low that it’s a bit discouraging to hear folks requesting it.
What the web really, greatly needs is the following:
- Web developers who practice semantic HTML.
- Designers who don’t want to customize every single UI element.
- VPs who prioritize usability and accessibility.
- Designers and VPs who prioritize usability and accessibility over the latest visual design trends (which most of the time cause accessibility problems).
- A lot less adverts, pop-ups, notifications, and other UI shyte.
These fundamental needs will go tremendously further for usability and accessibility than any HTML attribute, ARIA attribute, automated testing tool, Figma plugin, etc.
Also, as web professionals, we don’t want to encourage the use of visually hidden text but discourage the use — in favor of universal design, creating the same design and experience for all users. This will also save a lot of time and hassle during the SDLC.
Further reading:
- Visually hidden content is a hack that needs to be resolved, not enshrined by Scott O’Hara (added 21 March 2023)
- Inclusively Hidden by Scott O’Hara
- The WebAIM Million
- The anatomy of visually-hidden by TPGi
- The State Of Usability In 2023 by Smashing Magazine
- Competing Popups Are an Increasing Menace by NNGroup
