From Print to Web, Getting Started

If you follow the web development blog circuit, you will have undoubtedly read Khoi Vihn’s recent article about making the leap from print to web design. If you haven’t read it yet, do so. It is a really great article and will help you get rolling. Much of what I am going to discuss in this writing is based on our experiences (which I have been meaning to write up for about 3 years now, thanks for the nudge Khoi!), so let’s get started.

Accept It. Then Give Up Some Control

One of the first things we usually discuss with any traditional print designer is that print and the web are different. Yes, they are obviously different mediums, but that is not the main difference.

When you develop for print (and I have done many print projects) you get complete control over the finished product. From font choice to kerning, page dimensions to ink coverage, you are the only one that sets those parameters. When you send your proof to the printer, and do your pre-press, you can make any last minute adjustments to the final product before it goes to print. Once printed that piece will live forever with the exact specifications you created and settled on during your design process. This is not so with the web.

Designing for the web means you will have inherently less control over the end product than you might be used to. Given all of the different possibilities you might find on a visitor’s computer, OS, installed fonts, screen resolution, web browser, screen gamma (how light or dark their display might be), just to name a few. One of the key things you will need to embrace is that designing for the web is much more fluid than anything you have ever done. Your web site will look different from computer to computer. It will look different and that is ok.

Learn the Basics

In my years of making my way into web development, I would buy every book that I could get my hands on. I would read them away from the computer and then race back to my desk late in the day and try out what I had learned. Mind you this was back in 1995, so there were only a handful of decent web development books, and most of them revolved around syntax, but that didn’t stop me.

As Visual Lizard progressed, we got asked to develop some print projects. I took them on like any starving artist would do by saying, "Sure!". I would then race to the local book store and buy any books on print design that I could find. I learned the basics of font manipulation, selection and how important letter spacing and line height are to the presentation and legibility of type on a page (coincidentally it is very important to type on a screen too!), what PMS stands for and how to use it. I learned about paper weights. I learned about the importance of pre-press checks and I learned how awful Quark Express was. Once I found Freehand, Quark was never talked about again. I have a great appreciation and love for print design and how designers create their print art. In another time, I would likely have been a print designer.

The single biggest thing you can do for making your way from print design into web design is learn a little about HTML and CSS. The basics of are very easy to learn. Learn to code it by hand. Don’t use a WYSIWYG editor like DreamWeaver or iWeb (in OS X).

Learning the very basics will help in several ways. Firstly, it will give you knowledge and understanding of some of the contraints you are forced to face in web design. This will translate into you feeling more comfortable with doing web design work. You will also begin to look at it as a seperate medium and not just a second rate, loose translation, of your print design skills.

Secondly, you will gain an understanding of what is possible under normal web development conditions. This will help you think around some of the basic interface design issues you will come across. Creating pixel perfect comps will become less important than determining how a visitor is going to interact with your search results, or where they will be thinking about looking when they want to return to the home page of your site.

Having this basic understanding is essential.

What Else Do You Need to Know?

The breadth of knowledge one can accumulate when it comes to web design is almost infinite (I’ll cover some more of the basic stuff in a future post). Trying to learn it all, or small parts of it completely, can be a lifelong endeavour. When moving from print to web, the only other small piece of advice I can give you about making the transition is to love what you are doing. If you don’t like the web, or find web sites just functional, but don’t find yourself curious about how they work, then web design is probably not for you.

However, if you find yourself constantly peaking at the source of the pages you visit, wondering how that effect was achieved or just looking at web sites and thinking to yourself that you could create a better design, then you are going to enjoy designing for the web.

Like anything in life, if you love it, it becomes part of you. Love the failings and love the successes. Enjoy crafting designs that aren’t rigid and you will go a long way!

If you have any questions, please feel free to ask. We are always happy to lend some advice to people interested in our field of work.

to blog