Choose a layout

Choose a layout after exploring the data and establishing the questions the page should answer. A layout organizes the reading and interaction flow; style controls its visual treatment and components provide controls and supporting content.

Pick by the page’s main task

This list and the sidebar put general dashboard choices first, followed by specialized layouts. The order is a recommended starting point, not a ranking of design quality. A specific task can make a later option the best fit. Reuse an established layout when extending an app.

Layout	Pick it when
Top-down funnel	Each row moves from summary to breakdown to underlying records.
KPI-led	Readers need headline numbers, then charts explaining them.
Table-first	Records, precise comparisons or a scorecard are the main content.
Bento	An overview combines views of different sizes and importance.
Card grid	The same card structure repeats across metrics or items.
Master–detail	Readers pick an item from a list and inspect it beside the list.
Long-form	Readers follow an explanation in sequence by scrolling.
Hub	The page primarily routes readers to other pages.
Showcase	Artwork and one selected item are central to the experience.
Map-led	Geographic patterns are the main question; check the map limitations first.
Ops wall	Status at a distance; unattended, always-on operation is unsupported.

Add supporting pages when needed

• Detail opens one item’s information from an overview.
• Compare puts two to four items side by side with aligned views.

Settle the layout before implementation

Open the selected guide to choose its variant. Check the space required by chart labels, controls and records at desktop and narrow widths. Choose proportional scaling or tiered reflow through Layout and responsiveness; do not mix strategies accidentally.

Then choose the style, chart forms and components. Record the choices in the page brief.