Navigation Treeview Example
- -About This Example
-Caution!
-Before considering use of the Tree View Pattern for site navigation, it is important to understand:
--
-
- Correct implementation of the
treerole requires implementation of complex functionality that is not needed for typical site navigation that is styled to look like a tree with expandable sections.
- - A pattern more suited for typical site navigation with expandable groups of links is the disclosure pattern. -
-
- The below example demonstrates how the Tree View Pattern can be used to build a navigation tree for a set of hierarchically organized web pages.
- It illustrates navigation of a mythical university web site that is comparable to the navigation illustrated in the
- Example Disclosure Navigation Menu.
- As noted above, the disclosure pattern is better suited for most web sites because few sites need the additional keyboard functionality required to support the ARIA tree role.
-
- This example relies on the browser to compute values for aria-setsize, aria-posinset, and aria-level.
- The ARIA specification for these properties states that browsers can, but are not required to, compute their values.
- So, some browser and assistive technology combinations may not compute or report correct position and level information if it is not explicitly declared.
- If testing reveals gaps in support for these properties, override automatic computation by explicitly declaring their values as demonstrated in the example of a File Directory Treeview Example Using Declared Properties.
-
Similar examples include:
- -