A collection of tips, guidance and practical suggestions in developing accessible websites
Hiding content from view with visibility: hidden
in many cases prevents the screenreader from reading the content, so content styled this way is inaccessible. This technique is not appropriate for hiding content on screen because no screenspace is saved by styling this way – the visitor is left looking at a blank region the size of the hidden content.
In a number of cases visibility: hidden
is used in conjunction with positioning the content offscreen (position: absolute; left: -999em;
). This is unnecessary since positioning content off the viewport is sufficient to hide the content, and the visibility: hidden
makes the content unavailable to screen readers.
There’s no reason to use visibility: hidden
. Positioning the content offscreen is safer and has far less accessibility implications. If you fee that visibility: hidden
is appropriate for your requirements, I strongly recommend revisiting the requirement and finding an altogether different solution.
In order to sign up for an account to Google Chrome they employ these word of hidden visibility and tell you to describe it. This is impossible and unnecessary. Then they give you no way to contact them to dispute the fact that it cannot be read. Then they give you an option to listen to a handicap version of this hidden visibility. Its absolutely creapy sounding and you can’t understand anything it says anyway. It just creaps you out and again you have no way to contact Google to tell them this so you end up not being able to sign up to google chrome.