Should You Hide Certain Types Of Content From Screen Readers?
The answer to the question outlined above is “Yes.”
Just about all of the content that you display on your website should be available to screen readers. But, there are certain types of content that should be hidden.
Right before we go over the content that should be hidden, there is one thing to note: the only content that should be hidden from screen readers is content that will improve the experience of your disabled users.
What Content Should Be Hidden From Screen Readers?
A wide variety of different content should be hidden from screen readers. But, again, this is only if hiding the content will improve the screen reader experience.
Some of the most notable content that should be hidden from screen readers is as follows:
-Superfluous links that clutter the screen reader’s output.
-Repetitive text that clutters the screen reader’s output.
-Logos and icons that do not need to be present to understand your website’s content.
-Images that do not need to be present to understand your website’s content.
-Extraneous content that doesn’t translate well to braille or speech.
If the above is present on your website, then it is worth hiding it from screen readers. Other content, though, as long as it is important, should not be hidden and, as such, should be accessible to screen readers.
How Can You Hide Content From Screen Readers?
The best way to hide content from screen readers is to:
-Using the “display: none” feature in CSS.
-Using the “hidden” attribute in HTML5.
-Using the “aria-hidden=’true'” attribute in WAI-ARIA.
Regarding the latter, this is the Web Accessibility Initiative – Accessible Rich Internet Applications markup language.
Some of these tools work better than others.
If you would like to hide content from every user, then CSS and HTML should be employed. But, if you just want to hide certain types of content from those who use screen readers, then you can use the “aria-hidden” attribute.
