Designing for Various Displays

One challenge you will face when designing for the Web is keeping your design looking consistant on various machines. Every user will have a different hardware setup and a page that looks good on your computer may look radically different on another. The display of a computer plays a large part in the success of your design.

Here are some common monitor sizes and their platforms:

Macintosh
512x384
640x480
800x600 ==common on older I-macs
832x624
1024x768 ==common on newer I-macs and laptops
1152x870
1280x96
1280x1024
1600x1200

PC
640x480
800x600 == common on older desktops and laptops
1024x870 == common on most desktop systems
1280x1024
1600x1200

You should design for a user with an 800x600 pixel display resolution. This way you can ensure that users with newer machines will have the same experience as users with older machines. To design for an 800x600 pixel display resolution make sure that your page never exceeds 800 pixels in width. Start out with a header graphic that is 800 pixels wide and has a resolution of 72pixels per inch(default for images displayed on computers).

We will get to how to create this graphic in a later tutorial, for now lets look at how you must change your print design color concepts and ideas to display properly on the World Wide Web.

Continue on to Part 3 of this tutorial ==>