What You Should Know About Designing for The Web

by Sean James - Web Developer (Web Solutions of America)

Graphic designers, as well as aspiring designers, with little or no web design experience often have a difficult time transitioning to the web. When designing for print, the designer will have almost total control over the appearance of every aspect of the finished product. The web, however, is a different medium from print and trying to attain a similar level of control over the layout is simply not possible. Trying to do so will ensure that some visitors to your web site will not be able to properly view, or interact with, your web page. This may also have a negative effect on your ranking on various search engines, such as Google, Yahoo, etc.

HTML is a “coding” language that controls the positioning and arrangement of graphic and textual elements on a web page. HTML instructions will be written, or “coded”, to control the color and size of fonts, paragraph breaks, image placement, etc. (An HTML document only contains written texts and symbols that will appear to be jibberish to the average non web designer) When a web browser opens this HTML document, the browser reads the coded instructions within the document and translates it into a web page containing the intended layout that can be read by everyone. In effect, the web browser sets the rules on how it thinks your layout should be translated to the web. The problem resides here.

Since different web browsers may interpret the same HTML code a little differently, a designer’s carefully designed layout may seem different from browser to browser. This then raises the question of “how does one avoid this from happening?” A good web designer will be aware of most browser incompatibility issues and with this in mind, design a layout that will not fall victim to them. In addition to browser incompatibility, there is also the issue of the web viewer’s equipment.

In print design the designer can choose from a variety of fancy fonts and select images of the highest resolution for a sharp, detailed looking layout. A web page is only viewed from a computer screen which only has a low resolution of 72 dpi compare to a printed layout which may be as much as 1200dpi. As a result, the same clarity you’ll get from an image on paper will not be on a web page. When it comes to font selection, the web designer is only limited to what fonts are available on the viewers computer at the moment they are viewing the web page. This means if a designer uses a very unique font, that font will not display on the viewers computer unless the viewer just so happens to have that same font installed on his or her computer. So to have all viewers see the same fonts, the designer should use regular default fonts that ships with every computer, or create a graphic image of any unique fonts in the layout. (This is not recommended for body copy) Controlling the total viewable area of the page layout is also an issue, since individuals may have their computer monitor set at different viewing sizes. For example, one person may have to scroll their browser to the right to see the left side of your layout, or scroll down because all can be seen in the browser window is the top banner of the layout; while another may have the layout floating in a see of background color. Good web designer practice has always been to have an up to date knowledge of what computer size setting most viewers are using and design accordingly.

It’s very often that individuals have a great idea for a web page design but fail to understand that the process of designing for the web is a lot more restrictive than designing for a printed brochure or magazine layout. To ensure that your ideas are properly translated to the web it’s best to consult with an experienced web designer, or take some time to do a little web research.