Mark Boulton: In Between

Orde Saunders' avatarPublished: by Orde Saunders

Mark Boulton was speaking about page edges on the web and the lack therof at Responsive Conf, these are my notes from his talk.

How do you draw a picture of a person moving around? When ever we draw something there are edges. We don't define our content by the frame.

Cannons: defining your composition by the the frame it is in. There are cannons of page construction which attempt to create repeatable beautiful layouts.

On the web the edges are there but they aren't knowable.

"We broke the web" - no we didn't. Before we "broke" it the web was all text and a read-write medium. It wasn't defined as being fluid, it just was. It was designed to facilitate communication. It was 25 years ahead of its time so we made it comfortable - like a newspaper or a book. We wanted control. Everyone has a plan until they get punched in the face - responsive design was that punch in the face.

We don't have pages and we don't have edges in the way we think we do. When did RWD become multiple page design? We're reverting to a set of 320px, 768px, 1024px layouts and putting everything into those breakpoints.

What does content out, mobile first design mean? Add fluid first to this list. We need to force this discomfort - go out and design a fluid website.

Progressive enhancement is more than just JavaScript. Create breakpoints for user experiences. If your users are mostly using tablets then focus your design on tablets. Macro breakpoints are when something big happens to the experience. Micro breakpoints are used to tweak the design.

CSS abstraction. We're tempted to abstract too much too soon. Big push to create pattern libraries and hope it comes together later. By separating our CSS into different files for big media queries we force our thinking into those files. We need to build fluid first and then put in the breakpoints.

RWD is disrupting organisations. It's breaking well trodden paths and comfort zones. We need to start feeling comfortable about feeling uncomfortable and working fluid does that.


Comments, suggestions, corrections? Contact me via this website