Building Responsive Layouts As You Go

With each passing month, the priority to provide responsive layouts grows. Every new project I find myself bumping responsive views for mobile devices higher on the priority list, which means I’ve had the chance to evolve my approach.

Lately my favorite approach is to build responsive device-based layouts at the same time I build the normal desktop layout. I focus on a singular view or flow, and design each of the responsive layouts at that point in time. This is in contrast to building the entire application for one specific layout type (e.g. desktop min-width 1024px) then starting over again with the next layout type, and so on.

For example, I will take the login process and design/build all responsive layouts at the same moment before I move on to the reset password flow.

My main reasoning is catalyst. It forces me to think of responsive options and build them right away instead of telling myself I’ll come back to it. I do come back—I’m not lazy per se—but I tend to forget some of the deep thoughts and learning moments I had when designing the first layout option.

But I admit that may not be the optimal reason to decide on a responsive approach. I’m eager to learn more and watch my perspective evolve. So far my latest projects have been of the personal nature. I have yet to approach responsive layout design at a production level. My perspective may change due to code optimization concerns and speed of development. My colleagues might have insights or needs that alter my approach too. Perhaps after a while, I’ll discover something better.