Designing for 375 pixels first
The narrowest common phone is the honest test of a layout. Everything wider is a bonus.
By Ada Demir
1 min read
Open your site on a phone, in the sun, with one thumb. That is the real design review.
Start narrow
At 375 pixels there is room for one idea per row. Anything that survives there will rearrange itself gracefully on a wide screen; the reverse is rarely true.
The usual suspects
- A long URL or a code line that refuses to wrap
- A table wider than the screen
- A fixed width somebody typed in a hurry
Each one creates the sideways scroll that makes a page feel broken. overflow-wrap: anywhere and a table that scrolls inside its own box fix most of them.
Check it every time
A layout that worked last month can break with one new post. Make the narrow check part of the build, not a thing you remember on launch day.
