WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Best practice for steering to screen reader-only stylesheets

for

From: Jared Smith
Date: Jul 17, 2008 4:50PM

On Thu, Jul 17, 2008 at 4:28 PM, Tech < <EMAIL REMOVED> > wrote:

> When I designed my fluid grid with a fixed header and a scrolling body, I
> assumed it would be simple to hide the extra header meant only for sighted
> users, from screen readers (and vice versa).

There is not a way (that I'm aware) of to display content in the page,
but have it ignored by a screen reader. I also can't think of a reason
why you would ever want to do this. If it's important enough to show
to sighted users, why not allow screen reader users to read it.

> So I figure the only option is a link for "Goto Accessible version," which
> I've never done before.

It's probably not a good idea to create a separate version when the
main page can probably be made accessible. It's also a direct Section
508 violation (if you're concerned about such things). Please explain
what you're trying to accomplish.

> Do I put it
> right after the body tag, and hide, with display:none, which can still seen
> by readers, or must it remain visible?

Most screen readers will not read content styled with display:none or
visibility:hidden. The following article shows how to hide content
visually but allow it to be read by a screen reader -
http://webaim.org/techniques/css/invisiblecontent/ This should be used
VERY sparingly and only when purely visual information would be useful
to screen reader users. For example, on the WebAIM site we use it to
identify the beginning of advertisement. Visual users can visually
identify the advertisement blocks, but screen reader users may not
know they are ads until after they read them.

> Are there any bulletproof ways of detecting a reader, that I've never heard of yet?

No.

Jared Smith
WebAIM