Web Design Tips

Below are some things to remember when designing websites.

  • If your navigation is graphic, especially if it's an image map, include a text version for those people who have graphics turned off for faster browsing.

  • Keep the navigation above the fold, as in, I wouldn't have to scroll to find it. The same goes for other important parts of the page. Don't make me look too hard for what I want, or I might go somewhere else, where it's easier to find.

  • Keep the navigation all in one place. Too many times have I seen huge commercial sites with bits of navigation up the top, down the side, and at the bottom, repeating some links and not others, with no rhyme or reason. Even if you need to seperate bits of your navigation, do so with headers or submenus, as I have above. You could also use a <hr> line, or tables - separate them as necessary, but keep it all together.

  • Check the design on as many screen resolutions and different browsers as possible. It may look great on your 1280x1024 version 6 of IE, but how does the rest of the world see it? Read the compatibility tutorial for more info.

  • Include meta tags in your header. This will improve your search engine rankings. Make good use of your page title, so that when someone bookmarks the page, they'll know what it is 5 months later. Start off the title with your site name, so that it gets added to bookmarks in alphabetical order.

  • Check your loading time. The whole page, including both code and graphics, shouldn't take longer than 20-30 seconds to load fully on a 56k modem. Optimize your graphics if necessary.

  • Include the correct height and width tags of all images to speed up loading, and also a descriptive alt tag for those who have graphics turned off, or are blind and use a "talking browser."

  • Choose colors that portray the atmosphere you wish to envoke. Clean and professional, bold and cheerful, warm and friendly, etc. Use complimentary colors, like blue and orange, or purple and yellow.

  • Be consistent. If you have a set design throughout your site, make sure all the pages have the same design. Use the same fonts and styles throughout the site - for example: don't have dotted borders around some tables, and solid borders around others. Make them all either dotted or solid.

  • White-space is a good thing. Don't cram every fraction of the page with information, it will just look cluttered and too busy, which is confusing. Keep nice wide gaps between images and text, and make use of the <p> tag. Text broken up into small chunks is a lot easier to read than one long paragraph, and a lot less daunting.

  • Finally, always have a link to the home/main page.