What is the difference between these three for screen reader users?
views:
713answers:
2
+5
Q:
display:none vs visibility:hidden vs text-indent:9999 How screen reader behave with each one ?
+2
A:
There's a very good summary of how screen readers interpret these properties at WebAIM.
In a nutshell, visibility: hidden
and display:none
will hide text from screen readers just like it does from others. All other methods will be 'visible' to a screen reader.
anschauung
2009-11-18 12:44:37
But i downloaded NVDA screen reader software and it reads display:none content
metal-gear-solid
2009-12-13 09:04:08
Yeah, unfortunately screen readers are as inconsistent as sighted browsers when it comes to CSS. The standard is as described above, but there will always be a few that ignore standards.
anschauung
2009-12-13 16:34:32
+1
A:
refer: http://css-discuss.incutio.com/?page=ScreenreaderVisibility
display:none: will not be seen nor heard. *
visibility: hidden: will not be seen nor heard. *
text-indent: 9999: will not be seen but it will be heard.
- Most of the screen reader will not 'speak' display:none and visibility: hidden , but there are few screen readers like pwWebSpeak and HtReader which will read even these too.
Rakesh Juyal
2009-11-18 12:59:29
I tested with NVDA screen reader and it reads those elements which is hidden by display:none
metal-gear-solid
2009-11-18 13:22:30