Whenever content on a web page or in a digital document can be described as a list of something, it should be created as a list using the list features provided by the authoring tool.
Overview
Most authoring tools provide support for unordered lists (bulleted) and ordered lists (numbered). Some also support description lists (also known as definition lists), which are lists of terms paired with descriptions or definitions.
For users of assistive technology like screen readers, proper list markup is essential. When a screen reader encounters a properly marked list, it announces “list of X items”, allowing users to understand the page structure at a glance. This helps users navigate more efficiently and provides the option to skip past lists if they don’t need that information. Without proper list markup, screen reader users won’t be able to recognize when content should be grouped together and won’t know how many items they’re about to hear, making navigation much more difficult and frustrating.
Why this matters
When content is organized as a list, proper list markup communicates structure and context that sighted users perceive visually. Assistive technology users cannot see visual grouping, so semantic markup is essential:
- Screen readers announce the number of items in a list (e.g., “list of 5 items”) so users know what to expect
- Users can navigate between list items using keyboard shortcuts, skipping from item to item efficiently
- Users can jump out of lists entirely if they don’t need that information
- Proper markup helps structure documents and makes content easier to navigate and understand
Fake lists created with manual dashes, asterisks, or line breaks lose all this functionality. Screen readers can only understand content that is semantically marked as a list.
Types of Lists
- Unordered lists (bullets): Used when the order of items doesn’t matter – such as a list of features, ingredients, or options
- Ordered lists (numbers): Used when the order is significant, such as steps in a procedure, rankings, or priority lists
- Description/definition lists: Lists of terms paired with descriptions or definitions, commonly used for glossaries, FAQs, or specifications
Techniques
HTML
- Use <ul> for unordered lists and <ol> for ordered lists
- Enclose each list item in <li> tags for unordered and ordered lists
- Create nested lists by placing a new <ul> or <ol> inside an <li> element
- Never fake lists using manual numbers or bullet characters and line breaks – always use proper semantic list markup
UGA CMS (WordPress) and Other Rich Content Editors
- Use the toolbar buttons for creating bulleted and numbered lists rather than typing bullets and numbers manually
- The indent button in the toolbar creates nested lists; clicking it indents the current item to create a sub-list
eLC (eLearning Commons)
- The rich content editor includes ordered and unordered list options in the toolbar
- Click the list button and then choose bullet or number format
- Use toolbar buttons rather than manual formatting to ensure proper semantic markup
Word, Google Docs, and Other Document Authoring Tools
- Microsoft Word: The Ribbon contains Bullets, Numbering, and Multilevel List buttons
- Google Docs: The toolbar includes similar list creation buttons
- Use proper list styles and formatting options, not manual bullet characters or numbered text
- Use the increase/decrease indent buttons to create and manage nested lists
Common Mistakes to Avoid
- Using line breaks with manual bullet characters (bullet, -, *) instead of proper list markup – this breaks accessibility
- Using numbered paragraphs or fake numbering instead of proper ordered list formatting
- Failing to nest sub-items as proper sub-lists using indent/nesting features
- Using list formatting for non-list content (such as for visual layout purposes rather than semantic organization)
WCAG 2.1 Success Criteria
- 1.3.1 Info and Relationships (Level A): Assistive technologies depend on proper markup to convey the structure of lists
Getting help
If you have questions or need assistance, the Digital Accessibility Services Hub (DASH) is available to support colleges, schools, and administrative units as they build sustainable accessibility practices.
- Contact DASH at [email protected] for consultations, training, or technical assistance.
Accessibility is a shared responsibility, and every step you take makes UGA’s digital environment more inclusive.