On web and print design
In the process of building websites, creative people used to working with print often end up having arguments with technical people. I have had a lot of these kinds of arguments. It is usually very frustrating for both sides, because the questions and answers tend to fly past without really meeting each other. This kind of conversation is characteristic of what techies call an impedance mismatch.In this case, it's the failure of language from one paradigm to be meaningful in the other. This is symptomatic of a basic underlying difference between the two paradigms. I'm going to lay out my thoughts about this here, partly as I hope to have these kinds of conversations less in the future, and partly as a kind of therapeutic release after five years of arguing with graphic designers. I promise to be nice.
From a technical point of view, print design is all about WYSIWYG (what you see is what you get). Designers of typesetting software and the operating systems and computers they run on spend much of their time and effort making sure that what you see on the screen is as close as possible to what will appear on paper. Manufacturers of printing presses spend a lot of money on ensuring that every copy off the press is the same. Much time and expense is incurred by professional graphic designers making sure that what clients get from the printers is what they expected when they saw it on the screen. All of this is a direct consequence of the assumption that each copy of the output should appear identical.
The world wide web is not in any way WYSIWYG. It is the opposite of WYSIWYG.
Every monitor is different in size and colour response. Every brand and version of web browser renders and flows text and images differently. Operating systems use different algorithms to hint fonts. Many systems don't even have the same fonts installed. Users have their screens set to different resolutions. Some users have braille terminals. Others use mobile phones. If you randomly select a bunch of output devices, chances are that each copy of the output will look different, sometimes radically so.
What graphic designers can take a while to really get is that this is a good thing. The aim of the worldwide web is to ensure that anybody with any device can find and read the information they want. People with bad eyesight should be able to make the text on their screen bigger. You should be able to access the information equally well whether you're reading it on a 2560 x 1600 30 inch Apple cinema display (I wish) or a handheld computer with a monochrome display. That's why when you see a message on a website that says "best viewed in Internet Explorer on 800 x 600" you can tell that whoever designed the site has failed to understand the web. They have massively restricted who gets to read their content.
If you've ever opened a Quark XPress file in a text editor, you'll see a load of gibberish. However, if you "view source" on a web page, you will be able to understand with not too much effort much of what you see - at least, you will if the site has been designed by somebody who understands the web. That's because a Quark XPress file encodes exactly what combinations of font and styles is used for each paragraph, the absolute position and dimensions of every element, data on the page size and text flow, colour profiles and much more besides.
HTML should contain none of this. HTML simply says "this is a heading", "this is a paragraph", "this phrase should be emphasised", "This collection of text and graphics should be grouped together in a block". It shouldn't specify what font to use, what the line spacing is, what the absolute widths of the different blocks are, or what point size to use for the fonts.
This is for two reasons: firstly, the author of the HTML has no idea what device it will be displayed on; secondly, many of these options should be left to the user to choose. When a user resizes their browser window, the page should completely re-flow to fill the available space. He or she may not have the same fonts as you. Point sizes are meaningless because if I am looking at this page on a 17 inch CRT and you are looking at it on a 12 inch LCD the fonts will appear 33% bigger on my screen, even though they are set to the same resolution. Not even the browser, let alone the designer, has any way of knowing.
The simplicity and power of HTML comes at a cost. Every browser will render the same HTML differently. There are ways around this, but most of them are now illegal, complicate and obscure the HTML, and will in any case become obsolete the moment another browser, or a new version of an existing browser, is released.
The essence of web design is expressed in the way good web designers do testing. They fire up browsers in radically different systems. They don't expect the site to look the same on a new Mac with a cinema screen and an old PC laptop with a text-only browser - how could it? But they do expect it to be usable and clean in both.
Good designers understand and leverage both the possibilities and limitations of the web. They follow web standards to ensure that sites can be viewed on the largest possible range of platforms and that they don't break the law. They know that they have the opportunity to spread their ideas to millions of users worldwide on an incredible diversity of devices. This is only possible through the sacrifice of WYSIWYG, and the embrace of simple, flexible design which gives control to users.
Jez Humble
Director,
Urban Guru Ltd