Breakpoints are for reflow, the rest is fluid
A lot of the foundational systems that we take for granted in web design have been updated as UX design has come into its own. That doesn’t mean there isn’t still a lot of work left to do. Our responsive naming conventions are an area that may need a little love.
I’ve recently been in a couple of conversations around responsive design that centered on how to name our various breakpoints. In both cases things came back to Bootstrap canon. Anyone who ever poked around in the Bootstrap LESS files back when it was the only framework that mattered would recognize these variables:
@screen-sm, @screen-md, @screen-lg
In a more recent conversation with an IT team I was faced with a proposal to add another t-shirt size to our ever growing breakpoint support list. On reflection, I had a few reservations. My reservations weren’t based on the time required to build another full iteration of components. Instead, I found myself concerned with what a continuation our old school bootstrap interpretation of responsive design represents: a technically expedient nomenclature that doesn’t account for the mental model of the user.
Right or wrong? That’s really a matter of responsive framework philosophy. I kind of have one. As you may have guessed, I’m about to explain it.