Accessibility Questions: Nested ordered list as navigation breadcrumb

Jonathan Hung jhung.utoronto at
Mon Jun 21 18:55:21 UTC 2010

Hi everyone,

A navigation breadcrumb is typically a sequence of text links implying a
hierarchical relationship between breadcrumbs. A logical implementation in
HTML would be to use an ordered list, however there are two approaches to
doing this:

1. A flat ordered list.
2. A nested ordered list.

Example: Item 1 > Item 2 > Item 3

Approach 1 - Flat List: <ol><li>Item 1</li> <li>Item 2</li> <li>Item
Approach 2 - Nested List: <ol><li>Item 1</li> <li><ol><li>Item 2</li>
<li><ol><li>Item 3</li></ol></li></ol></li></ol>

Question 1: Which of these approaches would be preferred with respect to
accessible navigation? The nested list approach carries more relational
information, but may be unnecessary.  Seems to me that Approach 2 is better
suited for a menu system and not necessarily for flat navigation.

Question 2: Is there an alternative implementation that should be


- Jonathan.

Jonathan Hung / jhung.utoronto at
Fluid Project - ATRC at University of Toronto
Tel: (416) 946-3002
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <>

More information about the fluid-work mailing list