Goal
- Ensure the correct reproduction of masked content to be read by screen readers.
- Improve the accessibility of content for people with disabilities.
Implementation
Unless the content is intended to be made visible by user action (tabs, drop-down menus, etc.):
- Do not use the display and visibility properties to hide the content.
- Do not use the hidden HTML attribute to hide the content.
- Do not give the content an aria-hidden="true" ARIA attribute.
- Do not use the wmode parameter of a Flash object with transparent or opaque values.
Use:
- CSS properties to position the content outside the display area of the browser (position, text-indent) or to crop it (clip);
- the ARIA properties allowing a label to be associated with content (aria-label, aria-labelledby, aria-describedby);
- or, in the case of a form field label, the title attribute of the form
Find out more:
Control
In the generated code and in the CSS style sheets of the pages checked:
- Find, using a code inspector, content that would be hidden from display (apart from that intended to be made visible by user action)
- Check that none of this content uses the techniques indicated in the implementation if it is to be rendered in a screen reader.
Discover Opquast training and certification
The objective of these rules and the Opquast community mission is ‘making the web better’ for your customers and for everyone! Opquast rules cover the key major areas of risk that can negatively affect website users such as privacy, ecodesign, accessibility and security.
Opquast training has already allowed over 19,000 web professionals to have their skills certified. Train your teams, contact us
We offer a 1 hour free discovery module.