Great tips for designing great websites


Website Design is very interesting just like designing a beautiful house or a cool car like the Ferrari sports car. There is a kind of joy that comes with creating something knew and beautiful. Hence, to do this you must have aesthetic sense. In line with helping you do well as a website designer, I want to give you tips that will be of value to you.

To begin designing when it comes to creating websites, having the right software program can make a tremendous difference in how well your project looks in the end. I recommend Dreamweaver. Coffee Cup or Kompozer would do to. With these apps, you can create, manage and upload your files from within the application to your hosting account using the inbuilt FTP feature.  Also, go for good photo editors like Photoshop. Good graphics help spice up your designs too. Having said these lets proceed to the tips that will help you in your designs.

Design Tips and Ideas for creating good designs for websites

Below are great tips creating stunning websites that will make you a toast in the industry. Read on so you don’t miss a thing

Adhere to simplicity:
As a designer, you must adhere to creating a clear and intuitive navigational system when  creating a website. Nothing is likely to frustrate your visitors more than not being able to find their way around a website or to find what they are looking for. The aim of including a clear navigation system in your designs is to ensure visitors can easily get to all the main sections of the website from every page in the site. You can do this best by placing at the top or side of every page a set of links – called a navigation row or navigation bar –  to each main section. If the pages are very long, consider including a navigation bar at the bottom of the page as well. The reason for including navigation links is to save viewers of a website the stress of using the “back” and “forward” features on their browser or having to scroll all the way up to the top of the page, one that can make them get lost easily if not losing interest entirely.

Be consistent with design elements:
Good websites work best and look great when the designs are consistent. In designing a page your aim must include helping viewers distinguish information displayed on the finished project based on their design, location and prominence. You must also do well to ensure that you are consistent about how you design similar content elements. As you lay out your page elements also keep related items to each other.

Make sure similar elements follow the same design parameters, such as font size and style, banner size, and page background colour. If you use too many different elements on a page or on the same Web site, you'll leave visitors to the site confused in the end. Strive for consistency in your designs -- except when you're trying to give the sites viewer some surprise. This too should be done sparingly.

Maintain a colour scheme:
Every organisation has a colour. Like wise individuals have colours, they find appealing and that represents them. Hence as a designer, you will do well to find this out. If it’s an organisation and they have a logo, that’s a nice place to start when choosing a colour for the page design. Limit your colour selection to three and don’t go changing them on every page like I pointed out above when I wrote on consistency with design elements. Note strongly that colour choices also improve or defeat readability of whatever information that is displayed on a page. Hence, use colours that will make text reading easy for viewers of the final website pages.

The major colour schemes include:
Red, yellow and white
Blue and white
Red, grey and white
Blue, orange and white
Yellow, grey and white.
But to spice things up you can choose to apply colour gradients to your design. But if you are not too sure of how to combine colours, you can visit a website you like to see how they combine their colours. If you don’t have any, in particular, you can visit websites like freewebsitetemplates etc that have templates you can work with – free and premium ones.

The beauty of white spaces:
Don’t cram your pages by using too much graphics, banners, frames etc. it’s also advisable to use graphics that download fast. Also give page viewers some control on the front page and then let them narrow their quest for the information they need as they progress through the website. Some designers recommend no more than four to eight links and no more than three images on any page.

You might think that I am trying to dissuade you from making your design beautiful by letting you know that too much info especially on a homepage can be a distraction. But the truth is that one of the best design features you can add to a page is nothing at all. White space is not always white; it's simply space that you haven't crammed full of text or images. It can be of any colour, but most effective if it's the colour or pattern of your background. A crammed web page when compared to one with white or unused spaces  resembles a room full of clutter compared to a well arranged one. White space gives the eye a rest. Imagine the strain of reading line after line of text without a break. You can use white space to separate one type of information from another and to focus the viewer's attention where you want.

Three Clicks  Rule:
Every good website design must meet the three click rule. The three click rule simply refers to your links not exceeding three paged links. Let me explain. When you include say career info on a website you are to design for a company, you should do so in such a way that the number of clicks from the homepage doesn’t exceed three. Hence, to access the career page the viewer should just click the career link or button to view the job description page and next click the "apply now"  button. Thus, he only clicks twice to find what he’s looking for. The three clicks rule holds that no important piece of information should ever be more than three clicks away from anywhere on your website. The most important information should be even closer. Information, such as contact information, should never be more than one click away as well.

Background should not obscure information:
When designing a website if you use any colour other than white or if you use images already designed in other applications like Photoshop or fireworks you should select colours or use images that do not make for easy reading for the viewer.  When choosing a background if you opt for dark blue for instance use bright texts; not black texts on dark blue background or yellow on white, wrong choices indeed. A visitor would hardly read anything.

Make searches easy for everyone:
Site Map and Search feature is an indispensable feature for any good website. Irrespective of size or complexity, as a designer you should include these features into your design. It is better to prepare for site expansion rather than react to expansion – just like you would not opt for a single room apartment when you and your spouse know a baby is on the way hence requiring space for a growing family.
The Web Designer's Idea Book, Vol. 2: More of the Best Themes, Trends and Styles in Website DesignWeb Design All-in-One For Dummies 
If a website comprises of about fifteen pages it is expected to have a site map to give its users easy access to all parts of it. As a website gets larger, providing easy access to all the information on it may get harder and harder. A site map, which is an outline or a diagram that illustrates the hierarchy and content of the site and includes links to the most important pages in the site, becomes a great solution.

However as the website continues to grow the sitemap may become complicated, hence the need for search feature. This helps the user to just search using keywords to get just any information on the website related to what he’s looking for. You can either specify whether the search is restricted to the website’s content or if it include web contents as it were.

Make external links open in new windows/tabs:
If the website you are designing will contain external links to other websites, it is best to make the links open in a new tab or window. This will help prevent visitors being lost to other sites as it were. An example can be given thus: assuming I want to design a website that features choice tourist destinations and shopping sites online I would not want those websites to open in the same window as mine. This is because as they continue they may get less interested in mine having been distracted by something else, or they may get lost having visited many pages afterwards. Hence the importance of making links open in new tabs or windows so that your website will still be in the view of the visitor even though they go on to view external sites your links directed them to.

Beware of noise or distraction:
How would you feel downloading a web page in the quite of a shared office space only for music to blast through the speakers? You would feel embarrassed isn’t it? Hence, in designing a website give the viewer control. Let them choose when to listen to music or watch a video. Avoid auto play function for videos and music as much as possible.

Also too many popup windows is a no-no for any website. Though they are useful if you want to display an important ad or info, it can be annoying when misused. Alongside pop-ups, animations like flash ads, revolving globs etc can add life to a website. But like every thing in existence too much of their use is irritating to most people as they find it difficult to focus on what they want to read. Imagine a red light flashing nearby while you read. What happens to your ability to focus?
 Web Development and Design Foundations with XHTML, 5th EditionWeb Development and Design Foundations with XHTML (4th Edition)
Create animations that repeat only a few times: Many animation programs enable you to set the number of loops (the number of times the animation repeats). I recommend that you let an animation run for three loops, and no more. Your visitors can always reload the page if they want to see the animation again or replay if that feature is included just like you see on most Google Ads. For those who use apps like Motion Artist to create flash animations read my post on motion artist – to see how you can also achieve the “play-delay” sequence if you want to spare visitors from having to reload the page – here.

The above are tips you must bear in mind as you design any website for your clients.

If this article inspired you or if it was interesting, why don’t you do me a favour by sharing with those that matter to you – friends, colleagues and family – either by retwitting this post or URL on Twitter or sharing on Facebook

Also, join us on face book or follow me on twitter

Also, don’t miss our future posts anymore. Subscribe to our email post feeds or add them to your browser.

Comments