There are probably thousands of different models of computer monitors in use today, all capable of displaying different screen resolutions. This makes designing a website something of a challenge. The dimensions of a website are defined in pixels, which relate to the pixel resolution of the computer monitor.
In the not-too-distant past, the majority of computer monitors were 800x600 pixels. The maximum width I would make a site would be 775 pixels (allowing for scroll bar on the browser) or somewhat less than that if I wanted a little background to show on the sides of the site. Current statistics (March 2008) show that only 7% of monitors are now this size.
78% of monitors are now 1024x768 pixels or greater, and I normally make sites 955 pixels wide to optimize for this monitor size, which allows a little background to be seen on the sides of the site. People with a larger monitor would see more background, and the minority with the 800 x 600 monitors would have to scroll to the right to see the content at the right of the site.
Other considerations:
The above describes a "fixed width" site - i.e. the page is created at a fixed width and it will display at that width regardless of the size of the browser it is viewed on. It is also possible to create a "stretched" or "fluid width" site, which will display at the full width of the browser, no matter what size the browser is. This method is favored by usability proponents, who claim that this gives the viewer control - they get to decide what size to make their browser and so how they will view the site.
As designers, we are less in favor of giving viewers control, we want them to view the site the way we designed it. I have a 1920x1440 monitor and if I maximize my browser and view a stretched site, a huge swath of text stretching across the screen is not a pretty site, not to mention impossible to read.
A technique that is currently popular in web site design is to create a stretched header (and usually footer) with a fixed content area in the center. This site uses this method.
When a web page is viewed, the fonts specified in the web page code are called up from the viewer's computer. If the font is not found on their computer, the browser will substitute its default font. For example, if we specify "Neuzeit" 99% of viewers are unlikely to have that font, and will instead see the site in Times New Roman - not at all what we had intended. For this reason we normally stick to a small set of fonts that are known to be found on the majority of computers, so that we can best control the viewer's experience of the site. The fonts commonly used on websites are:
The header area of the site (normally containing the company logo/site name and sometimes a tag line or other introductory text) are often done as images, in which case any font can be used. Please convert type in headers and other "image" areas to outlines before sending the file to us.
It is possible to use images in other areas such as menus or headings, but keep in mind that this is detrimental to search engine optimization (search engines "see" text, they don't "see" images). There is a new technique that employs Flash and Javascript to allow specialty fonts to be used for headings, while still retaining search engine optimization and accessibility of the site. If you are interested in using a specialty font for headings, let us know when you place your order (and include the font).
Still not sure if our service is for you? Please use the form below to send us any questions you have.