Menu

Optimization points in responsive web design

Mark Boulton argues that we need to think further than breakpoints in responsive design, and also spend time figuring out the “optimization points”. From The In-Between:

I think we’re missing a trick for using breakpoints to make lots of subtle design optimisations. […] Content-out design means defining your underpinning design structure from your content, and then focusing on what happens in between ‘layouts’. This approach of optimising your design by adding media queries (I like to call these optimisation points rather than break points, because nothing is broken without them, just better), means you are always looking at your content as you’re working. You become more aware of the micro-details of how the content behaves in a fluid context because your focus shifts from controlling the design in the form of pages, to one of guiding the design between pages.

He shares some examples and also links to more resources on how to accomplish this. One good example of this subtle optimization approach is Responsive Typography, a concept by Marko Dugonjić where the size of the typography displayed on the screen is based on the viewing distance of the reader, calculated via webcam.