WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Best way to hide headings from visual users while keeping them in the outline

for

From: Dave Merrill
Date: Apr 22, 2013 11:52AM

I don't think I saw a response to my question about whether elements set up
with role="heading" aria-level="2" would be part of the actual outline that
a reader saw and offered as navigation points.

Is that how it works?

Dave Merrill


On Mon, Apr 22, 2013 at 10:52 AM, Birkir R. Gunnarsson <
<EMAIL REMOVED> > wrote:

> One option to be aware of, though it only works for screen readers.
> You can make an element such as a paragraph ora div into a heading by
> using ARIA
> use attributes role="heading" aria-level="a value from 1 to 6".
> This way screen readers interpret the element as a heading (with level
> indicated by the level attribute), but visually or ssemantically it is
> not a heading otherwise.
> see
> http://www.w3.org/TR/wai-aria/roles#heading
> (aria headings)
> Cheers
> -B
>
> On 4/22/13, Jared Smith < <EMAIL REMOVED> > wrote:
> > http://webaim.org/techniques/css/invisiblecontent/
> >
> > This provides a pretty good summary of the techniques. There is also a
> > newer CSS clip technique that is being used that works similar to
> > off-screen content. The key is that display:none or visibility:hidden
> > will (usually) hide content from all users, including screen reader
> > users.
> >
> > It doesn't matter if the styles are applied directly (inline) or via a
> > class.
> >
> > Jared
> > > > > > > >
> > > >



--
Dave Merrill