Content is not a list but it is marked as such.

Link to Content is not a list but it is marked as such. copied to clipboard
Rule ID:
semantic-list-used-for-presentation
User Impact:
Moderate
WCAG :
1.3.1.f

Rule

Semantic HTML elements MUST be used according to their semantic meaning, not to create a visual effect.

Background

People who can see are able to look at a screen and get a sense of how the page is structured and its contents. People who are blind depend on a screen reader for this functionality. If content on a page is marked up as a semantic list for visual effect, but the content is not in fact a list, screen reader users will have a difficult time understanding the page content because it will be read to them as a list.

Fix this issue by removing list markup and using CSS to create the desired styling effects.

How To Fix

In order to fix this issue:

  • Use native HTML elements for their intended purposes.
  • Use CSS to create desired styling.

Don't do this:

  • Use list markup on content that is not a list.

References