Designing a Web User Interface – and Doing it Right

The web, as it is today, is full of web sites. No surprise there. Some are popular, some aren't. Some make money, while others don't. And some of them, are made by people who think florescent teal text on a neon green background won't make your eyes bleed. Unfortunately, there's no easy way for us to just run all of these people off the web; so instead, we publish educational e-zine articles to help make sure these things don't happen.

At the risk of being completely cliché, the basic layout of a web site is crucial. Personally, I like to first make some sketches before I even start implementing a design. Regardless of your strategy as the webmaster, you'll want to identify some basic web site segments such as areas for a logo, menus, page content, sponsored text links (if applicable), and whatever pretty stuff will be needed to balance it all out. However simple it might seem, this simple process is a major pitfall for even experienced designers - and not an affordable mistake to make.

The Navigation System

Your navigation is perhaps the most crucial piece of your site – if people can't find your pages, they may as well not even exist. Many studies on graphical user interface (GUI) design suggest that the average person scans web page in an "F-shaped" motion, scanning twice across the top of the page, and once down the left. With this in mind, I shouldn't need to say that your menus belong on the left of your page, the top, or in both places; and on all pages.

A menu should be as categorized as possible. If lots of deep-level pages exist, it's a good idea to use a 'tree-like' structures along the top of each page as seen in big web directories – which will not only help visitors find their way around your sites, but also search spiders. There's no one agreed-upon number of links for a menu, but personally, I would say that more than 6 is too many, so try to organize as much as you can.

The Content

The content area of a web site should be just that. A grayscale watermark here and there can be neat, but the key is that content stays enjoyable to read, so crazy effects in this area should be kept to a minimum.

The average surfer's attention span is about that of a circus monkey – so web content is always best delivered in short fast-paced paragraphs. Whenever possible, bold, italics, horizontal rule tags, images, or whatever else can be devised to break from that chore of reading for the average person, will be appreciated, whether consciously or not. Studies show that sponsored advertising works best within your content, but don't make it so your poor visitors in 480x640 resolution are forced to essays of 2cm-wide text.

The Other Stuff

After the two key features of our site are squared away (this being a menu, and content, in case I lost your attention), you can begin thinking about the pretty stuff. Colors, shapes, and symbols all have their own subconscious interpretations – the extent of which stretching far beyond the scope of this article, but careful consideration should be made.

Try sticking to no more than 3 basic colors that fit well together, and collectively deliver the message you want your site to have. Consider, is your site a "round site", or a "square site"? Both styles of layout have their place and will deliver a very different message to the surfer.

Conclusively, this is just a starting point to begin in your journey of web design, but it's important nonetheless. A good basic layout will place your site miles ahead of the average site, and once it's decided upon, it's not always easy to change, so design wisely.

Corey Northcutt works with an affordable hosting provider known as Ubiquity Hosting Solutions (http://www.ubiquityhosting.com); where he derives extensive experience in working with other webmasters as a community leader.