Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
What would be the appropriate WAI ARIA treatment for hidden elements (hidden by CSS), such as loader images / ‘please wait’ text etc.? I would like to avoid these being read out by screen readers when initially hidden.
Use CSS
display:noneorvisibility:hidden; both of these are widely supported by all major screenreaders. Note that if you’re already using these – then you’re done! There’s no need to use aria-hidden in addition to these.Be wary of other ways of hiding things: using large negative offsets/margins or zero heights/widths may work in one or two browser/screenreader combinations, but not all. So, for example, if you hide an element by animating its height to 0, be sure to set display:none or visibility:false at the end of the animation.
Here’s some sources with this info: