WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Links as headings

for

From: Sailesh Panchang
Date: Sep 19, 2014 11:51AM

Hi Rakesh,
That's why I said that's not correct markup. And as a user, when I see
aset of links one after the other marked up as h4 etc. I suspect
there's more to it and guess that they may be expandable!
It is right to use aria-expanded (along with a visual cue to convey
state) but if the links make up a group, they should merely be marked
up as a llist with no headings.
The expanded content may have a separate heading using h<n> and be
within a region.
Sailesh
On 9/19/14, Rakesh P < <EMAIL REMOVED> > wrote:
> In this example <h5> holds a link and if these links have expand
> collapse functionality they can be headings, but I am little
> uncomfortable when the links are collapsed.
> When the links are collapsed having aria-expanded state is used
> screen readers may read as follows.
>
> heading level 5 link 1 collapsed.
> heading level 5 link 2 collapsed.
> code for this will be.
> <h5><a href="link1.html" aria-expanded="false">link 1</a></h5>
> <h5><a href="link2.html" aria-expanded="false">link 2</a></h5>
> In this case I have two level five headings with no section content .
> When the same links are expanded as code below, I am comfortable
> having headings.
> <h5><a href="link1.html" aria-expanded="true">Link 1</a></h5>
> <p>some content or links</p>
> <h5><a href="link2.html" aria-expanded="true">Link 2</a></h5>
> <p>Some content or links</p>
> Any thoughts on this.
>
> Thanks & Regards
> Rakesh
>
>
> On 9/17/14, Weissenberger, Todd M < <EMAIL REMOVED> > wrote:
>> Some of our partners are using heading levels on certain groups of links.
>> It might look like:
>>
>> <h4>Links</h4>
>> <h5><a href="">Link</h5>
>> <h5><a href="">Link</h5>
>> <h5><a href="">Link</h5>
>> <h5><a href="">Link</h5>
>>
>> Any comment on this practice?
>>
>> T.M. Weissenberger
>> Web Accessibility Coordinator
>> University of Iowa
>> <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >
>> 319-384-3323
>>
>> >> >> >>
> > > >