webgarden.ca

You may have some wonderful, creative and rule breaking ideas swimming around in your head as to how you want your website to look. But, before you start laying out your site in photoshop, you need to determine, if in fact, these ideas make good design sense.

Although the web is filled with endless possibilities of different layouts, only a few of those work. I will start with the first and foremost: Left Column Navigation, and continue with the remaining over the next few posts.

1)Left Column Navigation – a classic. This is a site where main content sits below the header, and the left column is narrow (25% or so) and the right content is wide (75%) The navigation is not necessarily inside the left column, it can be just below or above the header, spanning the entire page. This layout is kind of like your favorite pj’s. It is comfortable and well used. This layout is a safe bet for almost any project. Unfortunately, since this layout is so popular, and been done so many times, it tends look unoriginal.

Here are a couple of examples of Left Column Navigation:

http://www.thinkgeek.com/

http://www.bluefur.com/aboutus/

http://www.rainbow.ca/

Good design is determined by 2 points: usability and aesthetics. Some website designers get caught up in the cool graphics, or crazy fonts and forget about the end user. In contrast, some programmer’s get so caught up in user testing that they forget about the presentation of the site.

Design is about communication, if it works well, but is ugly or doesn’t fit in with your brand, no one will want to use it. Conversely, if the site is beautiful but isn’t usable or accessible,  people will not be able to use it.

Webgarden combines the elements of good design with site functionality to work as a unit. The final outcome of every successful website is summarized below:

• Users are pleased by the design but drawn to the content
• Users can navigate intuitively and easily through the site
• Users recognize each page as belonging to the site