Joy Of Code web design online training

Old World, New World

By Bud Kraus
friendly@joyofcode.com
Joy Of Code
Creator And Instructor

Summary

The difference between designing for print, a fixed medium and the screen, a liquid canvas cannot be overstated. Miss these differences and you will miss the opportunities to leverage the values of electronic publishing.

So one day, in the middle of a lecture I was giving on web design at Pratt Institute in New York City, I get distracted with an idea which has become my Old World, New World rant. I stumble on one huge idea that made me realize, "I got it." An epiphany.

Put simply, the Old World is Print, a world of fixed dimensions. One where space is divided by absolute sizes - inches, centimeters, fonts expressed in points. A world that can be completely controlled by creatives and designers. A world where 10,000 brochures are printed and they are all clones of each other.

A world adored by control freaks. A world without users.

The Electronic Canvas

This space, the electronic canvas, is the New World, the world of Computer-Mediated Communications. This world is proportional and scalable. Little involves absolute size. Measurement is relative.

Every display device -- monitors, large projection screens and handhelds to name a few -- feature very different display parameters. Take the computer monitor. What one sees on screen will be controlled by the operating system, the type and size of the monitor, the browser itself and, most important, the display driver being used.

If you think of your screen as a canvass then the display driver (software built into an operating system) controls how big or small that canvass is. The electronic canvas has stretching - or some say liquid - properties. A 640 X 480 display driver renders a canvass which is 640 pixels (picture elements or a unit of screen measurement) wide by 480 pixels high. A display driver that is 800 X 600, is 800 pixels wide by 600 pixels high. Another driver, one that many people favor is 1024 X 768.

The smaller the display driver numbers the bigger things will appear on the screen. Go ahead, play around with display driver settings. On the Windows platform, get to Display controls via the Control Panel or by right clicking your mouse on the Desktop. In the Display window select the Settings tab. Note which driver is being used then go ahead and experiment by changing that setting. Once you have a different driver selected (this is not hard to do) go surfing.

What you'll find is that web pages look very different using different display drivers . Some pages are well designed - in my humble opinion - because no matter which driver you use the page looks great as it scales to the size of the canvass (which is controlled by the display driver). But you'll find more pages that look good with only one driver but waste screen real estate (space) because of an overuse of fixed fonts and other absolute sizing layout properties which tell you one thing - the designers of that page are trapped in the Old World.

Take a look at an inspirational read, The Myth of 800x600, by James Kalbach. He has an M.A. in Information Science and is the Head of Information Architecture at Razorfish, Hamburg. I couldn't say it any better and he's a nice guy too!!

Design Philosophy

Think I'm talking philosophy? You better believe it. See John Allsop's "A Dao of Web Design" which looks at design through the prism of the Tao Te Ching.

Now don't get me wrong. I understand all to well the issues web designers and developers face in setting a typography that one can live with in the New World. Corporations have branded identities which need to be protected. If you say "don't set your font size to 12pt (point) because it makes little sense in this environment. Rather, set it to 100% of the user's font size preference they will look at you as if you are from Mars.

This Old World, New World paradigm is no trivial matter. Whole corporate structures have been successfully built upon the Old World model. Take a well know company I did some work for whose roots are in book publishing (it doesn't get more Old World than that). They were building an online bookselling service and they were hellbent on making their web pages look like flyers and brochureware, something they had a lot of experience with. It not only looked awful it was completely hard coded, that is unscalable to the user's preferences. It looked bad in ANY display driver. But it was their corporate tradition, it was how they thought, how they were organized that caused them to show the world that they did not understand the New World. And yes, all this user interface stuff has a huge effect on relations with users and whether their experience will be satisfying and lead to some intended result.

The Universe Of Relativity

Compare that with how Amazon and eBay look and function and you'll see examples of consumer centric companies that know how to deliver great online experiences. They understand the operating environment of the online world. They understand this medium and work with it and not against it. And that means knowing that this is a universe of relative sizing and proportionality - relative and proportional to preferences set by users in their browsers.

I've gone a bit long here and I don't expect you to get this all at once. These ideas lay at the foundation of my web design Workshop which are practical and conceptual. Don't fret or worry if this all does not come together in one second. It takes time. You may even struggle with it depending on your background. Me, I never came from the Old World so it was easier but it still took time for these ideas to sink in.

There is much more to learn and as you do more of this will make sense if it hasn't already.

Top Arrow