WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Aria role="listitem"

for

Number of posts in this thread: 4 (In chronological order)

From: PIUMI W
Date: Thu, Feb 06 2014 10:24AM
Subject: Aria role="listitem"
No previous message | Next message →

Hi,

I would like to know how JAWS reads ListItems marked with levels. When reading the following list, it does nt give any information about its levels. What is the advantage of using aria-level in a role=listitem. in terms of screen readers.. Thanks a lot in advance..

<div role="list">

<div role="listitem" aria-level="2"> Two </div>
<div role="listitem" aria-level="1"> One </div>

</div>


Thanks,
Piumi

From: Gunderson, Jon R
Date: Thu, Feb 06 2014 10:59AM
Subject: Re: Aria role="listitem"
← Previous message | Next message →

Piumi,

I think you want to be using aria-posinset and aria-setsize attributes.

<div role="list">

<div role="listitem" aria-posinset=³1² aria-setsize=³2"> Item #1</div>
<div role="listitem" aria-posinset=³2² aria-setsize=³2"> Item #2</div>

</div>



aria-level would only be useful if you were creating hierarchical lists.

Jon




On 2/6/14, 11:24 AM, "PIUMI W" < = EMAIL ADDRESS REMOVED = > wrote:

>Hi,
>
>I would like to know how JAWS reads ListItems marked with levels. When
>reading the following list, it does nt give any information about its
>levels. What is the advantage of using aria-level in a role=listitem. in
>terms of screen readers.. Thanks a lot in advance..
>
><div role="list">
>
><div role="listitem" aria-level="2"> Two </div>
><div role="listitem" aria-level="1"> One </div>
>
></div>
>
>
>Thanks,
>Piumi
>>>

From: Nathalie Sequeira
Date: Mon, Feb 10 2014 7:01AM
Subject: Re: Aria role="listitem"
← Previous message | Next message →

Hi Piumi,

> <div role="list">
>
> <div role="listitem" aria-level="2"> Two </div>
> <div role="listitem" aria-level="1"> One </div>
>
> </div>

why aren't you just using a proper HTML list markup?
This seems so much more cumbersome!
Thanks,
Nathalie

From: Gunderson, Jon R
Date: Mon, Feb 10 2014 9:56AM
Subject: Re: Aria role="listitem"
← Previous message | No next message

That is the preferred solution, always try to use the native semantics of
a mark up language when possible.

Jon


On 2/10/14, 8:01 AM, "Nathalie Sequeira" < = EMAIL ADDRESS REMOVED = > wrote:

>Hi Piumi,
>
>> <div role="list">
>>
>> <div role="listitem" aria-level="2"> Two </div>
>> <div role="listitem" aria-level="1"> One </div>
>>
>> </div>
>
>why aren't you just using a proper HTML list markup?
>This seems so much more cumbersome!
>Thanks,
>Nathalie
>>>