Essential web design tips.

Essential and important design tips? Well the list is endless, but see below for the core tips we would recommend. The essential tips are the things you must know about, especially if designing for someone else. These tips will save you time and wasted effort.

Remember, you don't have to implement them all. If it doesn't work for you, just leave it out. Bear in mind that some really cool sites are riddled with poor HTML!

• Having said that, learn to use HTML correctly. Even if you use a WYSIWYG editor, a core knowledge will help you sort out the unexpected problems that will inevitably arise. Try to hand code your site in Notepad. If you can do this, you will be able to locate errors extremely quickly. Handy if you're previewing a site to a client!
• Close those opened tags. This is especially important with tables, where a single unclosed TD tag can throw the Netscape browser completely, rendering your page blank or useless.

• Spend time, and PLAN your site. Know exactly what you are going to do before you type anything. This is essential if you are producing the site for somebody for a fee. If you set yourself a timescale based on an hourly rate, the longer you take (through poor planning) the less the rate is worth.
• If you're planning a consistent look to your site, do yourself an enormous favour, and build a template. Add temporary 'blah blah' text to cover as many options as possible including, heading(s), paragraphs, text highlights, links etc. Build, then tune your style sheets to display these texts to your satisfaction (or HTML tags if you're not using style sheets). When it's all to your satisfaction, THEN add your content! This will save you a huge amount of time.
• You've built a templated site, added content to 100 pages, and now you want to make a major change. Doh! Don't go through each page finding and changing the offending bit by hand. Search for, and download a 'multifile find and replace utility' from the Net, than make all those changes in an instant.
• Invest in a scanner. Apart from scanning images, you can scan text then use optical character recognition (OCR) software to convert it to a text file. Now just paste it into your pages where it's needed. Many scanner are now bundled with free OCR software. This will save you many hours of typing.

• Stick to a few good fonts, remember less is more. If you use a font in graphics, use it consistently throughout the site.
• Stick to a few good colours too, remember less is more. If your site has sections (like ours), use consistent colours throughout the sections.
• There is more than one browser. Fonts typically display smaller on Netscape than Internet Explorer, and smaller again on Macs. Bear this in mind, or use a browser detection script and have it load a specific browser optimised style sheet. See our javascripts section for one of these scripts.
• You don't have to fill the whole screen with text and graphics. Use 'white space' effectively, and allow elements to breathe!
• Use ALT tags properly for those who browse with images turned off. Some search engine spiders use the ALT tags to help rate sites, so use them wisely, include your keywords and increase your ranking.
• Your page title is one of the most important elements in search engine submission. So title every page, use keywords in the title (preferably in the first few words), and try and give every page a different title.
• Always use size attributes with images. The browser can then build the page before it's downloaded the image, and will display the text for visitors to read while waiting

• It's important to test your site extensively off-line, then extensively on-line before announcing yourself to the world. Have friends test your site and take note of, and act on, their comments!
• Think like your customer. If you build a graphics site, think what you would like to see on arrival, and implement it.
• If you're setting up a business site to sell a product, try to avoid banners on your home page. They do nothing but entice your visitors away. You end up losing potential sales before visitors have had a chance to see what you've got.
• Provide a way back to your home page on every single page of your site, via a logo, icon or a simple text link.
• Don't overload your pages with hundreds of choices. Surfers have notoriously short attention spans, and if they can't find what they want quickly, they will go elsewhere.
• If you can afford it, spend the money and register a domain name. It looks professional, and as Confucius said "the longer it take me to type in address, the shorter my interest in destination..". Well perhaps he didn't.
• Seen a great style idea! Steal it! Use the Document source/Source option in your browser to get the pages code, and rip out the bit you like! Don't steal the content though, it's copyright.

• Preformatted text can be very effective, and downloads faster than tables or frames. If you can use the PRE tag, do it.
• When your page is complete, remove all of the extra spaces and blank lines from your HTML. Your file size will be smaller and therefore faster to download. Remember that putting extra (spacebar) spaces between items to space them out doesn't work, as the browser ignores the additional spaces and treats them like one space. If you want to space items this way, use the ' ' No Breaking SPace extended character, or for larger gaps use a 1x1 pixel transparent gif, stretched to the size you want!
• It's important! I'll say it one more time. Test your site. Test your site. Test your site. Test your site. Ok ok.. enough!