E-mail List Archives
Thread: list or headings?
Number of posts in this thread: 8 (In chronological order)
From: Rick
Date: Tue, Mar 05 2024 11:32AM
Subject: list or headings?
No previous message | Next message →
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
From: tim.harshbarger
Date: Tue, Mar 05 2024 11:41AM
Subject: Re: list or headings?
← Previous message | Next message →
I would suggest going ahead and using a list. While normally you might not use a list for a single item, I think it is OK to have a list of a single item when that list is dynamic and may show different number of items. You could make a case that even when the list has just a single number, it may indicate to someone using a screen reader that the list is dynamic and may show 1 or more items under different states.
From: Dean.Vasile
Date: Tue, Mar 05 2024 11:51AM
Subject: Re: list or headings?
← Previous message | Next message →
Hey Sir!
Although, it technically is not good practice, I often see "list of one item", and I don't usually have problems navigating.
Deque, is notorious for doing this.
That's my two centsð
Have a great day!
From: Steve Green
Date: Tue, Mar 05 2024 4:16PM
Subject: Re: list or headings?
← Previous message | Next message →
If a list is always going to contain one list item, then making it a list is probably not a good choice. But I don't see a problem if the list will contain an arbitrary number of list items that may sometimes be one.
Steve Green
Managing Director
Test Partners Ltd
From: Barry
Date: Wed, Mar 06 2024 12:04AM
Subject: Re: list or headings?
← Previous message | Next message →
I like lists because, as you say, they let me know how many items to expect. I don't mind that it's one unless it's a whole page of lists of one item, which I have come across. One extra consideration that lists are good for is consistancy. If another page on the app uses the same format, but has multiple items in the list, then it is good practice to use a list in your page.
Cheers
Barry
From: Mark Magennis
Date: Wed, Mar 06 2024 3:58AM
Subject: Re: list or headings?
← Previous message | Next message →
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 ADDRESS REMOVED = > on behalf of Rick < = EMAIL ADDRESS REMOVED = >
Sent: Tuesday 5 March 2024 18:32
To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
Subject: [EXTERNAL] [WebAIM] list or headings?
[You don't often get email from = EMAIL ADDRESS 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
From: Birkir R. Gunnarsson
Date: Wed, Mar 06 2024 5:50AM
Subject: Re: list or headings?
← Previous message | Next message →
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 ADDRESS 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 ADDRESS REMOVED = > on behalf of Rick
> < = EMAIL ADDRESS REMOVED = >
> Sent: Tuesday 5 March 2024 18:32
> To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
> Subject: [EXTERNAL] [WebAIM] list or headings?
>
> [You don't often get email from = EMAIL ADDRESS 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%7Cc198742078074483d17f08dc3d42a14c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638452603586627463%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata=PEE6gXNkxkyG6xx3Ybo4Vz8OuTtGgt7y0CB8%2F60biPc%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%7Cc198742078074483d17f08dc3d42a14c%7C50361608aa23494da2332fd14d6a03f4%7C0%7C0%7C638452603586637530%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C0%7C%7C%7C&sdata=xBMDw2m4%2BamAAhQMZ19uZM6tNxQoQKTf9muzowEYq3Y%3D&reserved=0<http://webaim.org/discussion/archives>;
> > > > > >
--
Work hard. Have fun. Make history.
From: Mark Magennis
Date: Wed, Mar 06 2024 6:41AM
Subject: Re: list or headings?
← Previous message | No next message
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 ADDRESS REMOVED = > on behalf of Birkir R. Gunnarsson < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday 6 March 2024 12:50
To: WebAIM Discussion List < = EMAIL ADDRESS 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 ADDRESS 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 ADDRESS REMOVED = > on behalf of Rick
> < = EMAIL ADDRESS REMOVED = >
> Sent: Tuesday 5 March 2024 18:32
> To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
> Subject: [EXTERNAL] [WebAIM] list or headings?
>
> [You don't often get email from = EMAIL ADDRESS 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.