Fundamentals of Web Design

web design fundamentals
Luc Legay / Flickr / CC BY-SA 2.0
Things You Need to Know BEFORE You Build a Website

There are things that you need to know before you begin to build a website – things that will determine the success (or lack thereof) of your site. There are quite a few “rules” that have been drilled into my head, and those “rules” and design basics are what I will be filling you in on, in no particular order, as truthfully, they are equally important.

Failure to follow just one of these guidelines may not kill your business, but I can guarantee you that some users will be so annoyed by your site that they will leave and never return – and of course, they’ll tell their friends how “painful” it was for them to try to find their way around your site.

Advertisement

Simplicity

As cool as you think a dozen graphics or a big Flash presentation on your homepage look, most people hate it! Simple designs load faster, have more clarity in content and are easier to navigate.

Reduce the clutter

You may think that putting more information on one page makes it easier for your users (the people who will be visiting your site) to find the info they’re looking for all in one place – FALSE! In the world of web design, less is more! A lot of content on a page will do nothing more than confuse or annoy the user.

Avoid horizontal scrollbars at all costs

Numerous user testing has revealed that we HATE to scroll horizontally. Vertical scrolling is to be expected, but you need to size your page so that in a typical sized browser window, a user doesn’t have to scroll horizontally.

What’s the purpose of your site?

Why do you want users to navigate to your site? What are you trying to achieve?

The purpose of your site should be very apparent from the homepage. Users shouldn’t have to view your homepage and go “Hmm…I wonder what this site is for?” – it should be clear from page one. If people aren’t sure what purpose your site serves, they’re not likely to return.

Uniform appearance – consistency

Every page of your website should essentially look the same. Of course, every page is not going to be exactly identical, but the overall design should remain consistent throughout the site.

For example, if your homepage has a blue background and the navigation bar on the left, your remaining pages should NOT have a bright green background with the navigation bar on the right. It’s inconsistent and confuses users thinking ”Am I still on the same site?”

Homepage links

EVERY page of your site (excluding the homepage, of course) should have a link back to the homepage. This gives the user a place to “start over” if they get lost, and it lets them know that if they click on the wrong link, they’re only one click away from familiar territory.

Site ID’s & Taglines – know how to use them

Your Site ID is typically your logo, which most commonly should be found on the top of the page (many users like Site ID’s that are located in the upper left corner), and your Site ID should also remain consistent throughout each page of the site – and it’s good practice to make your Site ID link back to your homepage.

What’s a tagline and why do I need one? A tagline is one sentence (many designers place this under the logo/Site ID on the homepage – consistency of the tagline throughout the site is not necessary) that clearly defines your purpose or mission – sort of a company slogan.

The tagline just gives a little insight into what the site is about. For example, suppose a website’s tagline is “The People’s Media Company.” Many taglines are copy written, so keep this in mind if you see a good one you’d like to “borrow.”

Everything needs a purpose

Having a successful site isn’t just about attractive visual elements – it’s about communicating the purpose. With that being said, EVERY element needs to have a purpose. If you have a plumbing site, you don’t need a picture of a tree – the tree serves no purpose – stick to visuals that are related to plumbing, but not so many that you clutter the site.

Functionality: design vs. usability

Yes, it IS possible to have a site with a good design that is also very usable, but you have to be reasonable to achieve this. If there’s a cool animation that you’d like to use on your site, but it seems to “confuse” the scene, opt for usability instead of design. Remember, you want your site to be “pretty,” but more importantly, you want it to be usable.

View your site with a critical eye

Remember that not everyone is a web designer, and not everyone surfs the web with ease like you do. Never make assumptions – “Well, I know how to do that so I’m sure everyone else will too.”

Depending on the type of site, you may have a very diverse audience. You may have experienced web users or elderly folks who just learned how to send an email viewing your site. You need to accommodate for all types of users – including impaired users.

You also need to preview your site in multiple browsers – each browser is configured a little differently, therefore, the same page may appear slightly different in each browser.

USER TESTING

An old saying in web design is “Code a little, test a little.” In other words, in the process of building your site, you should design a little and then test it out on a couple of folks (preferably from your target audience).

Why? Let’s say you’re designing a 100-page site. You just finished it and you’re ready for user testing with potential members of your target audience. You use 10 people to test your site design, and 7 out of those 10 people have an extremely difficult time navigating around your site, understanding the purpose, etc. You’re now out of all those hours you put into designing the site because you didn’t test earlier during the design process, you must now redesign the site and hope for a better outcome.

Had you conducted a small user test 10 or 15 pages of the site, you would have known that your navigation system didn’t work for members of your target audience. ALWAYS conduct user testing, even if you can only afford to test it with 2 people.

These are important guidelines to remember when designing a website. Think of how you feel when you go to a site that’s horribly confusing, or whose navigation is inconsistent or doesn’t take you where you want to go. You hate it, right? Keep that in mind throughout your design process, and remember to test frequently. Your test subjects will let you know what needs to be fixed before your site goes live.

Advertisement

Norman Anthony Balberan

Anything out of the ordinary (?) Utopian dream, crashed and merged with unstable consequences causing mayhem...

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.