Posted by admin


Screen Resolution and Design

Screen resolution has always dictated the way websites have been designed. The designer treats the area of the visible screen much like a canvas, the design needs to fill and look correct within the space.

The resolution that is most popular has the height of 1024 pixels and width of 768 pixels or (1024×768) as it is most commonly referred to. To understand screen resolution we need to understand the two monitors that are available on the market:  A flat panel style monitor or LCD (liquid crystal display) monitor and a CRT (cathode ray tube).

LCD monitors are unique due to this kind of monitor having a native resolution, native resolution. The native resolution is dictated by the size of the monitor and all LCD monitors should be run at their native resolution to ensure 100% clarity. Wide screen monitors are becoming more and more popular allowing more work space and a better DVD viewing experience.

Here are some examples of monitor size and native resolution:

15 inch LCD Monitor 1024×768
20 inch LCD Monitor 1280×1024
20 inch LCD Widescreen Monitor 1680 x 1050
23 inch LCD Widescreen Monitor 1920 x 1200

To allow an enjoyable web experience web designers should aim to fit their design within a resolution of 1024×768. Vertical scrolling is acceptable within this resolution but if the webpage has to scroll horizontally, this can be a frustrating experience for the user. To allow room for scrollbars and any browser space that may occupy this area, web designers like to design no larger than a total of 1003 pixels wide to make sure the webpage will look its best on the wide variety of screen resolutions browsing the internet today.

Screen resolution needs to be taken into consideration when designing to make sure elements such as navigation structures, response forms and content will be clearly visible without the user needing to scroll. If the user is forced to scroll to view this vital information there is a risk of it not being viewed.