Can the web look like print? Why Not
This topic may sound familiar to people who have been reading my blog for a while. I’ve posted about most, if not all the component technologies I’ll be speaking about below. I hope I can change the context of the discussion enough not to bore you to death.
Unless it’s necessary I will not write code, this is meant as an idea generator. Either I’ve already written about the technology or I will do so in a separate post.
I keep coming back to Jen Simmons SFHTML5 talk on web layouts. Partly because it takes me back to my beginnings as a web designer and because it challenges me to rethink the way I approach design and development.
This is a two pronged memory for me.
I still remember when the web was beginning and we had no fancy CSS to do things. We were lucky to have <font> and <center> tags to, somewhat, style the content. All content was purpose built or, if the publisher needed to, there were a few templates here and there but, even then there was a newness and freshness to the designs…
In the description of the slides for the presentation, Jen writes that:
In the early years of the web, there was a lot of variation and experimentation with where to put content on a web page. Then, it seems, we all settled into a handful of patterns and stayed there for over a decade. It wasn’t until the arrival of responsive design that new ideas for page layout started appearing. Now with new CSS properties for layout landing in browsers, we may be about to see a bigger renaissance in layout design patterns. How can we better use the space inside the glass rectangle? What layout innovations could help users better find and focus on what they want?
And then I've seen how the web has become stuck in a rigid layout systems. What is known as “the holy grail” became the predominant design layout and it has gotten too rigid, designers are playing it safe and we’re loosing the creative spark that should drive all good design.
Andy Clarke has presented this ideas in his blog, at the Beyond Tellerand Conference (see video below) and, most recently in Smashing Books’ Real Life RWD.
Technology is good and doing data driven research is not a bad thing but over time we’ve come to rely on data to drive decisions that, in my opinion should be creative decisions. Also note that I’m refering to web content… I believe apps require a different set of re
That’s why I keep asking myself if the web can’t do what print can. Print seems a lot less constrained in what they can and cannot do than the web is. Fortunately that seems to be changing.
For the longest time designers have been told that the web is not print and shouldn’t be treated as such. My question has always been why not? What makes the web such a different medium?
There are new specifications and APIs being finalized by the W3C and WHATWG that make art directed web content more interesting and more like print and other art directed content.
In 2013 Chris Coyier wrote Art Directed Articles. Still a Good Idea? in CSS tricks. There, Chris describes the idea as:
The idea of an "art directed article" is that it is designed specifically for the content of the article. It might share some characteristics from the parent site (it probably should), but lots of design elements change to suit the specific article. Layout, colors, type, backgrounds, images, interactions... all custom just for the article.
I’m not advocating that all web content be art directed but we should have the freedom to use these new features and create layouts that really help users interact and understand with the content.
Ebooks in the other hand lend themselves particularly well to be art directed. Particularly when working with fixed layout (FXL) ebooks you have a much tighter control over the layout and content so why not treat each project as a bespoke project? Granted, it reduces the number of projects you can work on at the same time but, personally, I’d rather go for quality over quantity any time.
In future sections we’ll discuss some of the tools that would put the web closer to printed documents.