WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible browse lists

for

From: glen walker
Date: May 7, 2020 4:58PM

Using proper list nesting is the first step. If you have a <ul> nested in
a <ul> nested in a <ul>, then the screen reader can convey the number of
list items in each list and some screen readers will tell you the nesting
level, which is really helpful.

Having headings could help but you'd have to decide if the heading is a
link itself. If the headings are just static text, then the links under
that heading would be a separate sublist. Something like

<ul>
<li>
<h2>first group</h2>
<ul>
<li><a href=".">link a</a></li>
<li><a href=".">link b</a></li>
<li>
<h3>first subgroup</h3>
<ul>
<li>
<li>
</li>
</ul>
</li>
<li>
<h2>second group</h2>
<ul>
<li><a href=".">link c</a></li>
<li><a href=".">link d</a></li>
</ul>
</li>
</ul>


On Thu, May 7, 2020 at 11:18 AM Kirsty.Baker < <EMAIL REMOVED> >
wrote:

> Hello
>
> I'm working with a developer to update a repository website which includes
> different ways of browsing to access the content. Here's an example from
> one of the browse pages, where each heading would link to a list of
> documents relevant to that heading. These browse lists are often quite long
> and this is just an extract:
>
> Faculty of Arts and Social Sciences (FASS) (10229)
>
> * Arts and Humanities (2965)
>
> * Art History (390)
> * Classical Studies (440)
> * English & Creative Writing (896)
> * History (620)
> * Music (398)
> We are trying to come up with an accessible way to present these browse
> lists, particularly thinking of any improvements we might be able to make
> for screen reader users to make the hierarchy of the categories clear. Does
> anyone have any thoughts on how to create an accessible browse list like
> this one? Would it be appropriate to add headings to these categories - or
> would that not be a good idea because there is no content below the
> headings?
> Many thanks
> Kirsty
>
> > > > >