Web Design vs. Print Design and the WIRED Interactive Magazine

John Reeve | June 16th, 2010 | , , ,

Print Design vs. Web Design Back in March I was sitting in Ballroom C at the Austin Convention Center watching Scott Dadich, Creative Director at WIRED Magazine, demonstrate the rebirth of WIRED’s digital magazine — a Flash-based facsimile of the print magazine designed to run on the Apple iPad. Before I go any further, let me disclaim that, first, I love the design of WIRED magazine, and second, I love the design and development put into the WIRED web site. They have both addressed their respective mediums with intuitive and well-designed content. As Scott began flipping through the pages of the interactive magazine on the giant tablet projected onto the screen behind him, I was equally impressed… for the first five minutes.

The digital rebirth of WIREDs interactive magazine on the iPad was fine and pretty, but something about it didn’t feel right. The emphasis was being placed on the bells and whistles used to deliver the content, and not the content itself. Zoom this, pinch that, spin, expand, contract. Then I realized, we’ve been here before. When the web made its big debut in the mid to late 90s graphic designers reacted to it with disdain, cleverly disguised by embracing the web with image heavy web sites. Various Adobe products would allow any designer to chop Photoshop design into a million tiny pieces and reconstruct it on the web, giving them pixel precision control over a medium that wasn’t intended to permit pixel precision control. Communication Arts jumped into the fray and began awarding its coveted spots in the Interactive Annual to web sites with the most “interactivity,” which translated roughly to a clickable screenshot. And now here was Adobe, teaming up with WIRED magazine, trying to do it all over again by using Adobe InDesign, Air, and Flash to wrangle in the web. Not content with the web being the web, the interactive WIRED magazine felt like a throwback to the 90s.

Print Design vs. Web Design

Graphic designers, especially those from a more traditional print design background, have been trying to manacle the web since the beginning. HTML and CSS seem too limiting for designers who are used to having complete control over their medium. As the demonstration of the WIRED magazine app continued, my hunches were confirmed by several points being made (and some not being made).

Scott defended the interactive app, stating “design matters as much as content. Better design results in a better reading experience, deeper engagement, and a more connected consumer.” Yes, but WIRED has put design before the content, as evidenced by their dependency on Adobe products to publish the app.

WIRED commissioned a typeface, called Exchange. Why? Because the closest thing to what they wanted was Georgia, and that wasn’t good enough. Scott pointed out that kerning pairs, especially those present in Georgia, are lost on the web. The typeface they commissioned has over 10,000 kerning pairs. I had been dumbfounded before by print designers who wanted complete control over the widows and orphans on their web site. But kerning pairs on the web? Is that level of control really necessary?

Where are all the web designers at?

I noticed there were no web designers or developers on the panel, nor were they mentioned in the process of designing and developing the interactive app. Nope, that was all done by the WIRED print team and the Adobe development team. I sensed there was, and is, a rift between the WIRED print designers and web designers. The visual discrepancies between the magazine and the web site make this point evident, however, Scott clinched it when he said that he is not happy with type on the web, and that the tablet finally “gives them back control.” He also told us how, at WIRED, the print design and web design and development teams are split, physically separated by a hallway referred to as “The Great Hall of China.”

I am not the only one who’s noticed. A recent blog post from INTERFACELAB entitled Is This Really The Future of Magazines or Why Didn’t They Just Use HTML 5? points out:

…there is a massive opportunity to reinvent the concept of a magazine — yet we end up with something akin to what the web was like in the mid to late 90’s. This basically boils down to a print designer’s vision of what the web should be like — but in this case it’s a print magazine person’s vision of what an interactive magazine should be like.

Can’t we all just get along?

I have a degree in graphic design and was educated entirely from the perspective of print design. I first started designing and developing for the web in 1994, while I was in school. I’m glad I did because it was a good supplement to my education and training as a print designer. I watched my fellow students try to force their creative ideas from Photoshop onto the web, only to be defeated by smaller monitor resolutions and slow downloads. I’ve watched Communication Arts award magazine pages to web sites devoid of HTML and CSS year after year. And I’ve watched many print designers struggle with the web, refusing to secede control to the medium.

The web is not a medium that will afford print designers the control they’ve grown accustomed to. So what can print designers do to embrace the web? I’ve got a few tips for print designers who want to become better web designers:

  1. Learn the basics of HTML and CSS
    The more you understand the medium the better a designer you will become. An understanding of the printing process can help a print designer when budget limits them to a two-color design. They can use contrast, overlays, and paper color, to creatively exploit their limitations. Knowing how the web works is a lot like that.
  2. Don’t put design before content
    It’s a battle you will never win. Your readers are interested in the content first. Design is a distant second. If you don’t believe me, go to your local newsstand and try to pick up a copy of Ray Gun. What’s that? It’s out of print? As long as you are there, pick me up a copy of Popular Science, would you?
  3. Give up control
    Print designers and web designers, myself included, are some of the most egotistical and stubborn people to work with. It’s necessary at times to produce good work, but it can get in the way. On the web, it gets in the way. The sooner you are able to give up control and come to terms with the fact that the web site you designed and developed isn’t going to look exactly the same on everyone else’s monitors, the sooner you will get past the blockages that are holding you up from becoming a great web designer.

Photo credit: Tunruh

7 Responses to “Web Design vs. Print Design and the WIRED Interactive Magazine”

  1. MAC Design Inc. says:

    Nice post about web design vs print design. This is very informative. Thank you for sharing.

Leave a Reply

Intervals Blog

A collection of useful tips, tales and opinions based on decades of collective experience designing and developing web sites and web-based applications.

What is Intervals?

Intervals is online time, task and project management software built by and for web designers, developers and creatives.
Learn more…

John Reeve
Author Profile
John Reeve

John is a co-founder, web designer and developer at Pelago. His blog posts are inspired by everyday encounters with designers, developers, creatives and small businesses in general. John is an avid reader and road cyclist.
» More about John
» Read posts by John

Jennifer Payne
Author Profile
Jennifer Payne

Jennifer is the Director of Quality and Efficiency at Pelago. Her blog posts are based largely on her experience working with teams to improve harmony and productivity. Jennifer is a cat person.
» More about Jennifer
» Read posts by Jennifer

Michael Payne
Author Profile
Michael Payne

Michael is a co-founder and product architect at Pelago. His contributions stem from experiences managing the development process behind web sites and web-based applications such as Intervals. Michael drives a 1990 Volkswagen Carat with a rebuilt 2.4 liter engine from GoWesty.
» More about Michael
» Read posts by Michael

Videos, tips & tricks