A practical checklist for responsive layout
Every audit we run turns up some version of this. Run through this the next time responsive layout comes up.
The measurable part of design is whether people can find what they came for and act on it without hesitating. Budget a little time for it every quarter and it never becomes a project of its own.
The checklist
- Design for the smallest screen first and let the layout grow
- Breakpoints should follow your content, not device names
- Test on a real phone, not just a resized browser window
- Someone is named as the owner
- There is a date to review it again
Why it matters
Design for the smallest screen first and let the layout grow. That sounds obvious written down. It is still the thing most often skipped. Write the reasoning down alongside the decision, because the reasoning is what changes first.
In practice
Consistency is the quiet half of design work: it rarely gets complimented, and its absence is noticed immediately. Three things worth confirming about responsive layout before you move on:
- Someone can say what the current setup is without going to look
- Breakpoints should follow your content, not device names — and you know whether that is true here
- There is a way to tell whether the last change to this helped
Most of the value here comes from doing the first two things, not all of them.