Reading time: 5 minutes
It is all about vocabulary, isn’t it? The godfather of responsive web design introduced the term laziness at the web conference An Event Apart in his talk “Laziness in the Time of Responsive Design”. But what does Walt Disney have to do with it, why did Marcotte suggest the term laziness that has a rather negative connotation and is there really a hamburger crisis?
Well, Walt Disney managed to elevate animation to an art form and from his animators he expected that they produce drawings that are an illusion of life. Two of them, Frank Thomas and Ollie Johnston, articulated the twelve principles of animation in the book An Illusion of Life and thus created a vocabulary which was the basis of a philosophical framework. It enabled them to talk about whether or not they achieved their shared set of goals to deliver a caricature of realism.
It Is All about Vocabulary
Marcotte suggests in his talk that there should possibly be more focus on building frameworks that are closer to such a framework instead of the conceptually heavy frameworks that focus on the idea of a page as a holistic entity and the canonical view of designs that are articulated in 12 columns. Rather than concentrating on layout, columns, rows or pixel widths of different sized screens, he thinks that as designers and developers they need to work with their teams, clients and organisations to create a vocabulary that supports responsive design. It should help to figure out how different pieces of the designs are adapted to different screen sizes but also to clarify why these decisions are made.
With regard to different screen sizes, his suggestion is to stop thinking about designs as mobile, tablet or desktop but rather think of a network of content presented on the web. The number of operating systems, device classes and input modes (e.g. touch) has been increasing over the last years and there is no end in sight for such challenges and for new challenges nobody can even anticipate today.
However, the users do not care about the designers’ challenges but expect that responsive interfaces work natively with new models enabling them to travel the web and publish their content.
Go Forth and Be Lazy
Marcotte explains that his reaction to these challenges is the one of laziness. He explains, that the common notion of laziness is that it prevents you from producing a product of better quality. However, he thinks that considering the challenges maybe laziness could be a little bit of a help rather than a hindrance. In his opinion, the industry should think about how they can “intelligently let go of the need to perfectly control the end-user experience”. They may even be able to do more by looking for opportunities to remove complexity from designs. Why describing the grid system in HTML when describing it in the CSS provides more flexibility? Marcotte recommends the additional use of tools like nth-child and/or flexbox for the creation of “more flexible and more device agnostic layouts” that feel at home on any sized screen.
Is there a Hamburger Crisis?
Basically, the users should believe that they could not have a better experience regardless of the device they use. Additionally, the cognitive load on the users should be reduced according to Marcotte. He states that “the ability to conceal navigation is absolutely critical”.
However, in his opinion, the industry probably has a little bit of a hamburger problem. Again, it is about vocabulary because he does not refer to (possibly) unhealthy food but to the menu symbol that is used on many websites. Marcotte is worried that users may be confronted with all the “crap” the web designers did not really care about during a re/-design process when they click on the hamburger. He does not believe that popular patterns necessarily need to be used by default just because everyone else uses them.
The Future of Navigation
Navigation systems are often very complex because they were built as desktop first artefacts. Generally, systems should feel at home on any sized screen but Marcotte emphasises that they should start designing mobile first nevertheless (and this claim is still valid). He mentions progressive reveal as an interesting, alternate approach for the creation of navigation systems which brings us back to vocabulary again. Marcotte seems to refer to progressive disclosure. When this strategy is applied, only information that is necessary at the point of interaction is displayed. Specialised options are only displayed if the user asks for them.
And this brings Marcotte back to laziness about which he talks from an implementation standpoint. According to him “designing with progressive enhancement, designing from a device agnostic standpoint is one of the laziest ways you can build interfaces for the web today.” And: “We can look for opportunities to conserve our effort a little bit more, maybe we can have a little bit more fun with our responsive design.”
So, what are my take-aways from this talk?
- Vocabulary is awesome (as a linguist I have always known that).
- Responsive design is awesome from a user’s point of view (even for a linguist)
- Responsive design is hard to understand from a technical point of view (at least for me as a linguist) which is why I had the courage to be lazy and leave out the more technical aspects from Marcotte’s talk.
- The term laziness in connection to responsive design is used as a buzzword to attract attention but I think it means much more. First and foremost, I think it refers to effectiveness. But it can also be associated with simplification, usability, adaptability and even fun (which brings me as a linguist back to vocabulary).
Awesome, isn’t it?
© Photos: Alexandra Wurian