WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Off-screen form label not read by Screen reader

for

From: Jared Smith
Date: Aug 2, 2012 11:08AM


Nawaz-

There were a few issues with the code you provided. Of primary note is
that the Middle Name label was associated with the Last Name text box.

Once the code issues were fixed, I still experienced the same behavior
in NVDA and Firefox of the hidden label not being read (though the
ARIA label is correctly read). In debugging I found that this is due
to the use of the overflow:hidden style. When this style is removed,
the labels read appropriately. This is most certainly a bug because
overflow should have no bearing on whether content is read. Of note is
that the labels do read correctly in NVDA with IE, so it may be a
Firefox issue rather than NVDA.

This style is a standard part of most off-screen text styles. We've
recommended using it for about a decade
(http://webaim.org/techniques/css/invisiblecontent/) and I found in my
last code search that these exact styles were being used in many 10's
of thousands of web sites.

Jared