WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: list or headings?

for

From: Mark Magennis
Date: Mar 6, 2024 6:41AM

From Rick's description it seems that each list item will start with the name of a project which is also a link and this is followed by some metadata about that project - dates and numbers - some of which may be links. So I would think the project names should be headings since each one heads a chunk of info and functionality related to that project. I would be inclined to use both heading and list markup.
From: WebAIM-Forum < <EMAIL REMOVED> > on behalf of Birkir R. Gunnarsson < <EMAIL REMOVED> >
Sent: Wednesday 6 March 2024 12:50
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] [EXTERNAL] list or headings?

List makes a lot of sense here. It sounds like each project name
should be a button and the one currently selected should have its
aria-pressed property set to true, or else you use aria-current="true"
on the list item for the current project.
No problem with lists containing one item unless it's a hardcoded list.
I personally don't see issues with using headings outside of the main
content if they benefit navigation. For instnace, I don't see the
point of an h2 heading at the start of the page noting the start of
the header section, it's the top of the page, but I recommend, as a
usability, having an h2 "footer" heading at the start of the footer
section of a webpage (same content that is marked as a banner
landmark).
I agree, as a general principle, to avoid excess headings on the page
though, if a page has too many headings it gets distracting.
A heading should mark at least two paragraphs of content.

On 3/6/24, Mark Magennis < <EMAIL REMOVED> > wrote:
> Rick,
>
> What do you think is the problem of using both - a list where each list item
> starts with a heading? I know you said you don't like using headings outside
> of the main content area, but why don't you like that?
>
> Mark
> > From: WebAIM-Forum < <EMAIL REMOVED> > on behalf of Rick
> < <EMAIL REMOVED> >
> Sent: Tuesday 5 March 2024 18:32
> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
> Subject: [EXTERNAL] [WebAIM] list or headings?
>
> [You don't often get email from <EMAIL REMOVED> . Learn why this
> is important at https://aka.ms/LearnAboutSenderIdentification ]
>
> Hello:
>
>
>
> I am creating a web application and one of the pages allows a user to view a
> list of project links that can be clicked to populate the main content.
>
>
>
> The page begins with a banner and main navigation landmark which occupy the
> entire page width. Under this is a secondary navigation landmark on the left
> where the projects are listed. To the right of this is the main content
> landmark.
>
>
>
> The project navigation region begins with a filter mechanism to filter the
> list of projects. Hence, the list could be empty or only contain one item.
> Each project entry consists of a link to the project details (which, when
> clicked, will be shown in the main region) and some additional lines of text
> like completion date, number of members, etc. Some of these additional
> entries may also be links.
>
>
>
> I am wrestling with whether to use headings or an unordered list for the
> projects list to facilitate easy screen reader navigation. The list has the
> added benefit of informing a screen reader user of the number of entries. It
> has the disadvantage of for a single item, it is a bad practice to use a
> list. However, changing to some other method for this case would pose a
> change to a users expectation, so I would continue with a list of one item.
>
>
>
> I could also use headings, but I personally do not like headings in any
> region except the main region. If headings are used, they would all be at
> the same level for each project without a heading at level 1 as a main
> heading, since the main section will contain a heading at level 1 to begin
> the section.
>
>
>
> Your thoughts?
>
>
>
> Rick Blair
>
> Senior Principal Digital Accessibility Program Manager
>
> Schneider Electric
>
>
>
> > > https://nam12.safelinks.protection.outlook.com/?url=http%3A%2F%2Flist.webaim.org%2F&data%7C02%7CMark.Magennis%40skillsoft.com%7Cc5caa8f8c4554fcad0bf08dc3ddbfd1c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638453262279815373%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata=d%2FR8hnmvL45fegGfibokLs%2FbUdnivmZKFL%2FaEu4tOg4%3D&reserved=0<https://nam12.safelinks.protection.outlook.com/?url=http%3A%2F%2Flist.webaim.org%2F&data%7C02%7CMark.Magennis%40skillsoft.com%7Cc5caa8f8c4554fcad0bf08dc3ddbfd1c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638453262279823243%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata jUExzGztavKsElEFL8BevziSOsnIhDQHVcClxzyRs%3D&reserved=0><http://list.webaim.org/>;
> List archives at
> https://nam12.safelinks.protection.outlook.com/?url=http%3A%2F%2Fwebaim.org%2Fdiscussion%2Farchives&data%7C02%7CMark.Magennis%40skillsoft.com%7Cc5caa8f8c4554fcad0bf08dc3ddbfd1c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638453262279826596%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata=BNYjtvNo0aoeJxfRpuKzlDKt6cPafjVgnlzlv%2BlV8I0%3D&reserved=0<https://nam12.safelinks.protection.outlook.com/?url=http%3A%2F%2Fwebaim.org%2Fdiscussion%2Farchives&data%7C02%7CMark.Magennis%40skillsoft.com%7Cc5caa8f8c4554fcad0bf08dc3ddbfd1c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638453262279829914%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata=pvP0uyN%2FOaNc9qnlMSisIUikNDLePl6x4%2BEyparZZ%2FQ%3D&reserved=0><http://webaim.org/discussion/archives>;
> > > > > >


--
Work hard. Have fun. Make history.