Skip to main content

Home All hubs and collections Form Shape, anatomy, and visual rhythm Typography Hierarchy, legibility, and type as meaning Color Perception, contrast, and hue psychology Layout Grid, space, and compositional structure Content Voice, clarity, and writing that earns attention Accessibility WCAG, inclusivity, and design for everyone Interaction Mental models, feedback, and feel Motion Duration, easing, and purposeful animation

Home / Layout / Checklist

Layout

Before you ship

A practical checklist for layout and spacing. Work through it before handing off or publishing a design.

0

of 16 checked

Grid and Spacing

All layout uses a consistent column grid
All spacing values come from a defined scale
Gutters are consistent throughout and appropriate for the content density

Visual Balance

The layout has a clear focal point and does not split attention equally across multiple areas
Visual weight is distributed so that neither side or region of the layout is overwhelming
Whitespace is used actively to group and separate content — not just to fill gaps

Responsive

The layout has been designed mobile-first and tested at 375px, 768px, and 1280px
Breakpoints are based on where content breaks, not on specific device sizes
No content is cut off or overlapping at any tested viewport width
Touch targets are at least 44×44px on mobile viewports

Information Density

The density of the layout matches the needs of the audience and task
No screen is showing more information than a user needs at that point in the flow
Progressive disclosure is used for complex content — details are revealed on demand

Content Fit

The layout pattern chosen suits the primary content type being displayed
The layout works with real content — it has been tested with short, average, and long content
Images and media are constrained to the grid and do not break the layout at any size

design hubs Design is not decoration.

Home Form Typography Color Layout Content Accessibility Interaction Motion All Articles Progress Search Principles Conflict Matrix Guide About Contact Privacy

© 2026 Paul Divers. All rights reserved.

Keyboard shortcuts

Show shortcuts: ?
Search: CtrlK
Previous article: ←
Next article: →
Close: Esc