Top 15 Website Design Tips

1. Use a consistent colour theme.

Getting the colours of your site correct is imperative because it has such a significant impact upon readability. The worst mistake any designer can make is to pick clashing colours that cause visitors to squint or possibly even develop a headache. One classic example stems from using bright red or yellow text on a black background, which is appallingly unattractive and very difficult to read unless you get the tones just right.

The best advice is to pick no more than 2 to 4 complementary colours, using one for the majority of your theme, another for link highlights and the rest to help any navigation (menus) or specific content standout. Naturally you can use different shades of your chosen colours too, so long as they don’t clash and we recommend using darker variants at the top. Having darker colours in the middle of your page, when the top is lighter, can look very out of place.

Finally you should also consider how these colours and shades will look on different monitors, many of which are sold with differing gamma, contrast and brightness levels. Try to test your site out with several displays (especially laptops, which often have brighter screens) to see if the colours aren’t too soft or bright.

2. Use consistent font themes and sizes.

Much like colour, it’s also important to maintain a similar font style and text size throughout your site. Try to avoid using lots of different fonts as it can look unprofessional (pick just one for most of your content), while small text sizes can be difficult to read at higher resolutions.

In addition, line-height (e.g. 14px) is often fatally overlooked and without it sentences may appear clumped and be difficult to skim over with your eyes. This is an excellent CSS setting to use and we highly recommend it.

3. Keep your content fresh and original.

Make sure your site isn’t left to stagnate just because it’s not gaining a lot of initial visitors; becoming properly indexed by search engines and directories can take up to 8 months! Hence it is imperative that the site contain relevant and updated content, which should include using visual highlights (e.g. underline and bold etc.) to help important details stand out as search engines are known to look at this too.

However, you don’t need to go overboard with adding new content until the site has become well established, just try to keep it fresh and reasonably up-to-date.

4. Make browser compatibility a priority.

One common mistake a lot of designers make is to develop their site with the aid of a single browser and assume that it will still display more or less correctly across all platforms. This is incredibly unwise as even standards compliant browsers have problems that can be exasperated when viewed by a rival product and you could end up locking potential visitors out.

Instead you should test your site against the most common three browsers (IE, Firefox and Opera) with every important code change or addition, this will help to spot and correct a rendering problem before it becomes too tedious to easily fix. Problems can also arise when you exclude older versions of browsers, though some sacrifices can be made so long as the basic functionality and navigation of your site is not compromised.

One particularly good example of a backwards compatibility dilemma is IE6, which at the time of writing has been replaced by IE7 for well over a year. Unfortunately IE6 had poor CSS standards compliancy, yet it’s still widely used and thus should not be excluded. One handy way to test how a site will render on older IE versions is with this free online tool:

http://ipinfo.info/netrenderer

Try to avoid solving all compatibility problems with general code hacks unless absolutely necessary as it can complicate your style sheet and isn’t terribly clean. There’s certainly something to be said for not trying to be too clever with your code; even older HTML tables still have their uses.

5. Don’t use too many adverts.

Advertising is often essential to a free sites economic survival, though plastering your page with masses of adverts and or the use of annoying pop-ups and other intrusive methods can be highly counterproductive. Overuse of adverts can degrade the quality and accessibility of your content and undermine all your hard work, making visitors less likely to stick around.

Furthermore, saturating a page with adverts can make the space less attractive for advertisers and may degrade their click-through (CTR) potential. So be sure to make space for a few adverts but try not to let it intrude upon the sites usefulness and readability.

6. Keep page sizes and content manageable.

High-resolution images and lengthy pages are all very well but they do have some very significant drawbacks. For example, using too many high resolution images will increase you bandwidth bills and slow page loading. Instead, make sure to compress such images (use GIF, JPEG or PNG formats – some are better for different content, experiment) and try to keep those you do use to a respectable size.

Likewise, pasting lengthy documentation into a single page can be unattractive and it’s far better to employ page separation, which simply describes the splitting up of content over several pages. This may increase bandwidth consumption by increasing pageviews (note: good for advertisers) but it will be easier on the eyes, especially since most visitors prefer to skim over content.

7. Cater for different screen resolutions.

Most visitors to your site will use a variety of different screen/monitor resolutions, which these days can be anything from 800w*600h to 2400w*2400h pixels or more; the width (w) is most important for web designers since humans read from left to right and not up to down.

Try to make your site fit as many resolutions and thus visitors as possible, which can be achieved by creating a liquid design around percentage (%) widths or by catering for the lowest plausible resolution that the content will fit into. Don’t forget to leave up to 22 pixels width spare in your templates for the browser windows scrollbars (ignore this if using percentage based widths as they will factor that in dynamically).

8. Optimise the relevance of TITLE and META tags.

Search engines pay a considerable degree of attention to page Title, Meta descriptions and to a lesser degree, Meta keywords. These are important descriptive elements that help search engines and other systems determine what content exists on your site. They typically appear in-between your pages top HEAD tags and may look a little like this:

<title>Mooo Land</title>
<meta name="description" content="Global supplier of mooo products and cameras" />
<meta name="keywords" content="moo products, digital camera" />

These three attributes should be as relevant to your site as possible, making sure to altering the input for different content pages. For example, let’s say I have a second page containing the details for a camera. Ideally, to make the most of this content, I should adjust the above tags on the new page accordingly:

<title>Mooo Land – Camera Name</title>
<meta name="description" content="Global supplier of Camera Name products" />
<meta name="keywords" content="Camera Name details, digital cameras" />

Typically it is important not to make either the description or keyword entries too lengthy; repetition of words should also be avoided as this could be considered SPAM and ignored (e.g. keep descriptions to roughly 150 characters in length and don’t use the same keyword more than 2 or 3 times).

Note that keywords can be almost ‘phrase like’ and it doesn’t hurt to put some into your description, but don’t go overboard and avoid using common words as keywords (e.g. ‘Internet’ on its own is too common).

9. Optimise your links (URLs).

The shorter and more human readable a link the better your chances that search engines will index them. Lengthy URLs are not only ugly and difficult for visitors to remember but some search engines will also find it hard to track and store them, resulting in less of your content being visible to a wider online world. For example, this kind of link is a bad idea:

http://www.test.com/test/index.php?section=234

Instead you should seek to reduce it down to something more manageable, such as:

http://www.test.com/test/kitten.html

Unfortunately doing this usually requires a healthy knowledge of Mod_Rewrite or a similar URL rewriting service, which is extremely complex; hence it’s usually better to make sure that any dynamic scripts your site uses have already been built to output Search Engine Optimised (SEO) URLs. However, a simple .htaccess file example of Mod_Rewrite based on the above link might look like this (it gets progressively more complex later, search the Internet for tutorials):

RewriteEngine on
RewriteRule ^test/kitten.html /test/index.php?section=234 [L]

In addition, if you ever have to remove a script then Mod_Rewrite can be used to redirect [R] any dead URLs to a new location. Likewise, once your links are sorted, you should consider building a simple sitemap file. Sitemaps contain all the major links on your site, sometimes including details such as the date last updated and link priority so that search engines can better index your site and see which are the most important sections.

There are plenty of free online tools to help you do this or one can be built manually for smaller sites. For example, an extremely simple text based SITEMAP.TXT (place in your sites root folder) file might start off like this.. (just links on new lines):

http://www.test.com
http://www.test.com/test/kitten.html

Finally, don’t forget to make sure that you use an ALT description tag for any images you use. Search engines will also index these and it is important not to underestimate their value.

10. Market your site.

It’s amazing how many developers get this one wrong and only add their page to search engines. There are a number of other things you should do, such as submitting your site to link directories (preferably with a Google PageRank [PR] of 3 or more). My personal favourite is this semi-free tool, which has a lot of free submissions, automates most of the work and also allows you to vary your sites title, description and keyword tags (i.e. too many repetitive details will get ignored by search engines as SPAM):

http://www.fastdirectorysubmitter.com

It’s also worthwhile investigating your competition and or similar sites to see if they have link pages. Many do and if so then it’s worth requesting a reciprocal link (you post one to them, they post one to you) to help boost your visibility further. Likewise it doesn’t hurt to publicise the existence of your site through press releases and newsletters, which should again be sent to the e-mails of sites containing similar content. If you have access to newsgroups then find a related newsgroup category and mentioned it there too.

However, during all this promotional work it is important not to over-advertise (SPAM) your page as that could become counterproductive and many people despite aggressive promotion. Finally, it could take nearly a year before some link directories recognise/add you, so don’t expect instance results. Building a readership takes time.

11. Use copyright (c) and privacy policies.

Make sure you use a simple copyright line at the bottom of every page, this doesn’t do much but it will afford some protection if anybody ever tries to steal or plagiarise some of your hard work. Next, you should consider writing some ‘Terms & Conditions’ for your site, especially if the content is likely to include consumer feedback, which might worry commercial companies.

Likewise, if your site collects or tracks any kind of visitor details, such as e-mails or IP addresses (used by forums, advertising and statistical tracking systems) then make sure to write up a privacy policy. This doesn’t have to include a commercial certification but it all helps to escape liability in the event of legal action (link this to a separate page at the bottom of your site near to the copyright line). Visitors also have a right to know how you intend to use their data.

12. Make the site interactive.

Social networking (i.e. Web 2.0) is a big deal these days so having interactive systems, where readers can interface with your site by creating their own content, is a must. Discussion forums, comment systems, newsletters and surveys etc. will all help to boost the profile, content and attractiveness of your page.

13. Check content with a word processor.

Put anything you write through a word processor with spelling and or grammar checkers enabled. Mistakes are natural and cannot always be avoided but they should be kept to an absolute minimum.

14. Use a simple domain name.

Pick a short, sweet and simple domain name that ideally doesn’t clash with others and try to avoid using hyphens. The simpler your domain the easier it will be for visitors to remember.

15. Use a clear and simple navigation system.

Make sure all of your sites sections are accessible from a clear and simple navigation/links system, avoiding clutter. This should be near the top of the page somewhere and stand out from the content. Having too much link confusion can make websites difficult to navigate and unattractive to visitors.

Source: www.host-review.co.uk