Web Design Tips for Print Designers

I have 3 quick tips that will make designing for the web easier for everybody involved!

1. Make your canvas bigger than the area you are designing for.

How does making the canvas larger help with web design? It forces you to think of the design outside of the fixed widths of your canvas. Probably one of the most common problems I run into with a designer who has never had to code their own creations is dealing with the 'unknowns'. How are design elements like photos and background colours handled? Do they simply end, do they fade out or do they repeat ad infinitum to the end of the page? These are the types of questions you have to ask yourself when putting together a design.

2. Design with guides.

HTML is a boxy language that essentially works from left to right, top to bottom. In your design software, pull down some horizontal guide lines around your major foreground elements. For example, logo, navigation and text. If you find that you've got some lines going through other foreground elements then you may find yourself doing more work to pull off the effect. Background elements are less important because if they need to be cut into seperate images, there will be no meaning lost.

3. Use a "pixel precise" application for your design work

Use Adobe Photoshop or Macromedia Fireworks for your design work. A 1 pixel line will be a 1 pixel line. Don't do your final design in Adobe Illustrator. You'll end up just creating more work for yourself... or for those that have to work with your designs.