Lists

Lists let users easily scan content and create a structured, linear order. Lists should be bulleted or numbered to improve inclusive design. When screen readers find a properly marked list, they tell the user that there is a list and how many items are in it.

It is very important to properly mark lists. Use the list button in the text editor. Don't create a list by using only visual styling, such as a dash (-) , asterisk (*), or hard return to force text to the next line.

Items in a list can also be nested to show their relationships. Related items can go under one particular item in a list. For example:

  • Dogs
    • Golden Retrievers
      • English Golden Retrievers
      • American Golden Retrievers
      • Canadian Golden Retrievers 
    • Boxers
  • Cats
  • Birds

Best Practices

  • Format text as a bullet or numbered list using the list button in the text editor.
  • Do not use dashes, symbols, or graphics to make content appear like lists.
  • Create structure by nesting list items.
    • Use the indent button in the toolbar to nest lists.
    • Alternatively, highlight the item. Hit "Tab" (increase the indent) or "Shift + Tab" (decrease the indent) on your keyboard. 

Learn More