Web Design Tips

(From the tutorial, Web Design Tips & Tricks For Beginners)

There are so many things one can do with a website - for example, you can add fancy Javascript, gorgeous photographs and lots of neat graphics, interactive tools, and more… but just because you can do something, doesn't mean you should. Design a site that serves its purpose, whether that's to generate leads, make a sale, get feedback from customers, or anything else. Here are a few general tips:

1. Be Consistent

Keep your navigation the same on all pages. If your navigation bar is always on the left, then keep it there all the time. All the links on your navigation bar should always be in the same order (and with the same text) so that it's easy for your visitors to figure out.
Make sure your graphics are consistent. For example, don't use 5 different logos and 10 different button styles.
Pick a color scheme and stick to it. Don't change colors on every page - it's confusing. Keep all your titles, links, backgrounds, and so on the same color on every page.

2. Make it Easy on Your Visitor

Navigation should be clear and easy to follow. For example, group together links to pages on related topics. Your visitor should be able to find what he or she is looking for, quickly and easily.
Choose a background that's easy on the eyes. Avoid harsh colors and noisy backgrounds. Black lettering on a white background is easiest to read.
Add some white space, separators, headlines or subheadlines to your page to make it easier to read. It's tiring on the eyes to read a web page that's one long paragraph.
Don't use horizontal scroll bars. No one wants to have to scroll from left to right in order to read a web page.

3. Keep Graphics Simple and Clean

Don't use unnecessary graphics. Graphics that emphasize or highlight a point are great; get rid of the rest. Remember, the more graphics you have, the longer it takes your page to load - a visitor who's tired of waiting can easily click away to a different site.
Always specify ALT, WIDTH and HEIGHT for images. If you do use graphics, make sure these are included. ALT will allow people who turn off graphics (or who have text-only browsers) to enjoy your page; WIDTH and HEIGHT will help to speed up your web page's loading time.
If you have lots of images to display, use thumbnails. Some websites may legitimately need to display a lot of graphics (for example, a website showing work from an interior decorator). If you need to show a lot of images, use thumbnails - these are smaller versions of your graphic which are enlarged when someone clicks on it with their mouse.

4. Don't Use Every Cool Trick You Can Find

Don't use Flash just for the sake of it. Flash is a sort of "movie" you can play on the Internet. It requires something called a plug-in, which is just a special program you have to download and install on your computer. Most people won't bother to download something just to view your site. Flash is also slow-loading, and can cause problems for some viewers. If you want to use Flash, give the user an option to either view your site in Flash or view it in plain HTML.
Forget the fancy graphics. There is nothing more annoying and distracting than flashing icons and animated images running, bouncing, or otherwise beckoning to you from the screen. Use animation sparingly - only to draw attention to something important on your page, if at all (of course, this doesn't apply to sites whose livelihood depends on having a graphics-intensive site…).
Steer clear of FRAMES, unless you know how to use the NOFRAMES option. Once again, they may look neat but not all browsers support them. Search engines, a major source of traffic, can also have difficulties reading websites improperly designed with FRAMES.
Try to minimize the use of browser-specific tags. Certain HTML tags can only be used in specific browsers. Browsers which don't understand these tags will end up either ignoring them or displaying them as text.
The simpler your HTML, the more likely it is to be displayed properly on all browsers. Every browser will display your web page a little differently. The simpler you can keep it, the better the chance is that your site will be displayed on different browsers as you intended it to be.

5. Check Your Site on Different Browsers

No two browsers will display your page the same way. The most popular browser is Internet Explorer, but Firefox in particular is gaining in popularity (there are many others as well, including Opera and Google's own browser....). Make sure you at least check your web page on IE and Firefox. A couple of handy tools that can help you are AnyBrowser and NetMechanic.

PREVIOUS: Introduction
NEXT: 12 Useful HTML and Javascript Tricks (Part 1)

Please contact us to request reprint permission.