Home Categories Design Tutorials Tutorial

What makes a great web design?

3.7/5.0 (3 votes total)
Rate:


March 31, 2006


When I was a young and inexperienced web designer, I was once asked what made a great web design. I blithely responded with something like "lots of cool graphics and moving objects!" I cringe when I remember this particularly dreadful moment in my life. My real concern, however, is with aspiring web designers today. I am an avid participant in online discussion forums and hear and deal with this issue plenty.

Web design is a true art. Web site success stories are hatched after strong considerations over content placement, graphics and template design are thoroughly scrutinized. This process may (in fact, it should) take time to complete; days, weeks and perhaps even months depending on the complexity of the site.

The question of what it takes to create a great web site must be taken into context. Search engines, for example, most likely wish to create a faster loading site, perhaps compromising the amount of graphics. Media companies, however, most definitely place higher credence on the design, including graphics and other visual enhancements.

Therefore, the question here is largely subjective to the type of site it is applied to, and I will keep these considerations very general and appliable to all types of sites.

The greatness of web design

A true analysis of great web design should not only consist of graphics and objects. In fact, it may be the least important issue in this argument. Web design is great when it works for the site's purpose, addresses customer needs well and furnishes a positive visage for the product, service or person the site is serving.

CONTENT PLACEMENT

Content placement plays a role into what qualifies as great design. It is no surprise that content is placed in a prominent location on the page, and this particular element is not the problem. Font sizes should be kept large enough to be easily read by the Internet population (size 2 is nice, but size 1 can be used with proper line spacing). The text should contrast well with the background of the page. Web designers have more freedom over font color when placed upon a white background.

CONTENT ORGANIZATION

A very important element in web design is often overlooked when designing a site, and that is content organization. Create major section titles and provide all relavent content and links within those titles. Implement a clear barrier between the major sections on the site, and also consider placing each title on a separate page.

On Stevesdomain.net site, for example, I separate each major section by page. I have placed all articles within a single page, articles.php. Additionally, I have placed all information about this site on another, separate page at about.php and contact information on the contact.php page. This schema is clear as day and easy to navigate through.

TABLES

Tables are the essence of many designs, and that is more than understandable. Web designers should strive to keep nested tables to an absolute minimum. Further, consider slicing your tables up, vertically. One long table will require more load time than multiple tables will aligned vertically.

IMAGES

Now we arrive at images, perhaps the most controversial part of web design. Read carefully, because this is important: graphics do not make a web design. In fact, the overuse of graphics detracts from what the web site was built to provide. Graphics are enhancements, not elemental objects of a web site. Use them to enhance and not to built. A rule of thumb is to aim for a 10 second maximum load time of any page.

ORIGINALITY

Straying from the how for a moment, let us examine the what. A good web design includes originality. Originality requires thought, consideration and creativity, which is what makes web design a fun endeavor for a lot of us. Giving your visitors a unique perspective on a web design is refreshing in this world of predictability.

ONE-TO-ONE SITE DESIGN

Want a one-to-one relationship with your visitors? You may have noticed sophisticated, database backed web site designs equipped to serve each visitor independently. By supplying the site with your preferences, you can alter the design, including the content and sometimes the color, with a simple click of the mouse. This type of sophistication is certainly not mandatory, but it does offer food for thought.

Do not forget coding standards

A great web design is not just visual. It should include standard, effecient coding practices. For example, the HTML BODY tag's deprecated attributes "marginwidth, marginheight, leftmargin and rightmargin" are often written within code to explicitly set the margins, in pixels, of the web site.

Instead, CSS can be used to accomplish the same task, and the code is interpreted like it should in all standards-compliant browsers. Setting the margin of a web site to 0 using CSS might look something like this:

body
{
margin: 0px 0px 0px 0px;
}

This is a shortcut method of writing something like this, more intuitive, implementation:

body
{
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}

Or in PHP, instead of referencing a variable from the URL with it's name, preceded by a dollar sign (ie: $Var), reference that variable via PHP's superglobal array $_GET[Var] or $HTTP_GET_VARS[Var].

For more information about standards in particular areas of web development, refer to some of these particularly useful online resources:

• CSS - http://www.w3.org/Style/CSS/
• HTML 4.0 - http://www.w3.org/TR/1998/REC-html40-19980424/
• General issues - http://www.alistapart.com/index.html
• PHP - http://utvikler.start.no/code/php_coding_standard.html


Add commentAdd comment (Comments: 0)  

Advertisement

Partners

Related Resources

Other Resources