Behavior comparison

Table vs Tree view

Decisive difference

Table lays out flat rows and columns read in document order; Tree view exposes nested nodes with expand and collapse.

TableChoose Table if the user compares values across rows and columns without a parent-child structure.
Tree viewChoose Tree view if items belong to parents and the user drills down through levels.

See the nine dimensions See the sources

Decision

Family question

Should people read tabular data, interact cell by cell, or expand a hierarchy?

Nine dimensions

Dimension	TableTable	Tree viewTree view
Trigger	Reading starts in the caption and headers; embedded controls keep their own normal activation.	Tab enters the tree; arrows move focus and expand or collapse parent items.
Modality	Non-modal document structure, not a composite widget.	Non-modal composite widget for a hierarchical collection.
Placement	Inline with its caption and column or row headers aligned to the represented data.	A vertically ordered hierarchy whose indentation and disclosure state expose parent-child relationships.
Interactivity	Cells are read in native table structure; any link, button, or sort control is a separate tab stop.	Managed focus, expand/collapse, optional selection, and activation are separate and visibly distinguishable.
Focus	Focus remains on the activated sort button when rows reorder; reading cells never gain managed widget focus.	Use roving tabindex or aria-activedescendant consistently, and keep visible focus distinct from aria-selected or aria-checked.
Dismissal	A table is document content and is not dismissible.	The tree is not dismissed; Left Arrow collapses an open parent, and Escape is not a required tree command.
Accessible role	table > (thead \| tbody) > tr > (th \| td)	tree > treeitem + group
Use case	People compare values across rows and columns	People navigate a true parent-child hierarchy
Mobile behavior	Preserve header relationships and offer a deliberate overflow or alternate layout instead of visually reordering cells.	Use generous disclosure targets and consider progressive drill-down when deep indentation leaves too little room.

Table vs Tree view

Decisive difference

Table lays out flat rows and columns read in document order; Tree view exposes nested nodes with expand and collapse.

TableChoose Table if the user compares values across rows and columns without a parent-child structure.
Tree viewChoose Tree view if items belong to parents and the user drills down through levels.

See the nine dimensions See the sources

Nine dimensions

Dimension	TableTable	Tree viewTree view
Trigger	Reading starts in the caption and headers; embedded controls keep their own normal activation.	Tab enters the tree; arrows move focus and expand or collapse parent items.
Modality	Non-modal document structure, not a composite widget.	Non-modal composite widget for a hierarchical collection.
Placement	Inline with its caption and column or row headers aligned to the represented data.	A vertically ordered hierarchy whose indentation and disclosure state expose parent-child relationships.
Interactivity	Cells are read in native table structure; any link, button, or sort control is a separate tab stop.	Managed focus, expand/collapse, optional selection, and activation are separate and visibly distinguishable.
Focus	Focus remains on the activated sort button when rows reorder; reading cells never gain managed widget focus.	Use roving tabindex or aria-activedescendant consistently, and keep visible focus distinct from aria-selected or aria-checked.
Dismissal	A table is document content and is not dismissible.	The tree is not dismissed; Left Arrow collapses an open parent, and Escape is not a required tree command.
Accessible role	table > (thead \| tbody) > tr > (th \| td)	tree > treeitem + group
Use case	People compare values across rows and columns	People navigate a true parent-child hierarchy
Mobile behavior	Preserve header relationships and offer a deliberate overflow or alternate layout instead of visually reordering cells.	Use generous disclosure targets and consider progressive drill-down when deep indentation leaves too little room.