Pillar: Lists

Lists are collections of content that are somehow related. When you include a list in your page content, this relationship needs to be conveyed visually, and it also needs to be conveyed to people using screen readers.  

Lists Best Practices 

  • Use the List Formatting Tool: 
    • Avoid fake lists such as inserting asterisks or dashes. 
    • Use the drop-down formatting menu to select built-in list styles. 
  • Select correct List Style: 
    • Use bulleted lists for unordered lists where sequence isn’t important. 
    • Use numbered lists for ordered lists. 
  • Format correctly: 
    • Maintain consistent indentation throughout the document. 
    • Use nested lists (sub-lists within a list) sparingly to avoid complexity. 
  • Check meaning: Ensure each list level adds necessary additional detail and enhances readability and user comprehension. 

Lists Examples 

Good example of Lists:   

Ingredients

  • 1 can (15 oz) of Corn
  • 1 1/2 c. Tomato Juice
  • 2 cans (15 oz each) Beans
  • 1 small onion
  • Garlic
  • 1 tsp each: cumin and paprika

Recipe Steps

  1. Dice the onions and garlic. Set aside.
  2. Saute cumin and paprika in 1 t. oil for 1 minute.
  3. Saute
    1. Add diced onions and saute 3 min. 
    2. Add the garlic to the onions and saute 1 more minute.
  4. Add corn, tomato juice and beans. Cook on low for 15 more minutes. 

Poor example of Lists:  

*Mercury 

* Jupiter 

* Saturn 

This might look like a list, but to screen readers, it's just three lines of plain text, each preceded by an asterisk.  The built-in List Style formatting was not used.

How to Apply Lists 

Where can I get support or further training? 

Faculty Learning and Support Opportunities

For faculty developing and managing website content, refer to:   

References 

W3C. (2024). How to Meet WCAG-Quick Reference.