Use the Spell Checker!

Check your text for obvious shpelling misstakes and general bloopers! Nothing takes away from the message of a web page more than poor spelling and bad English. Remember that most word processors default to American spelling. Just because the spell checker says color doesn't mean you have to spell colour the American way. (Unless of course you are American - then please disregard that last comment!)

Use Narrow Columns

Don't spread your text across the full screen - a screen width of 1/3 to 1/2 your screen is enough.

Newspaper columns are narrow for a good reason. Ever notice how long it takes you to read a report produced in 10 point type with text stretching full across an A4 page? The eye finds it difficult to travel back to the beginning of the next line - especially if it is a long distance relative to the gap between lines. This is a major logistic problem for the eyes and the brain controlling them. Errors begin to creep in. The reader's eyes get tired and the brain switches off so you find yourself re-reading the same stuff over and over again.

So with your web pages keep the width of your text lines short - a third to half of the screen at most using standard font size. You can go a bit wider if you are using larger type sizes.

How to Keep Your Text Column Narrow.

Blockquote

The simplest method is to use blockquotes before and after your text blocks:

put your body of text here - the line will be indented on the left and the right hand side.

Have a look at the source of this page to see how we indented this line.

3x1 Tables

A three column by one row table can be quite effective in laying out your text. Most web editors will allow you to create a blank table. By using only one of the columns for your main text you can control the width of your text. You can use the remaining columns for menu items or shorter links.

Use White Backgrounds

Set your background to White in preference - use colour fonts and small graphics to provide contrast and variety.

You should set a white background even when you are using a background image - lots of people switch off graphics when browsing to speed up the world wide wait.

Be careful with dark-coloured backgrounds

Although sometimes white on black can be good.

Be aware that not every monitor will reproduce your nice pastel. Similarly what is a pleasant colour backdrop on your system may be a muddy shade of brown on someone elses lower spec system - it may even make your text illegible.

Don't Overdo the Italics and Block Caps

Avoid italics for any significant amount of text - as you can see they don't read easily on screen especially in smaller font sizes. What might be very effective in print is not good at all on screen even with a very good monitor.

Don't produce big blocks of text in block capitals - USE THEM SPARINGLY FOR EMPHASIS. In preference use colour or bold face for emphasis.

Use the 'View Source' Option

Examine how other people put their pages together especially when you come across something that looks really well. Use the View Source option on your browser menu. Plagiarism is the sincerest form of flattery!

Different Browsers see Different Things

Remember that not everyone is using the most up to date browser so test your pages on older versions also.

There are distinct differences between Netscape and Microsoft Internet Explorer and the official HTML versions. Keeping your page design simple will avoid many of these compatibility pitfalls.

Not everyone is lucky enough to be using a big 17" monitor with 800x600 graphics. Remember that people will get irritated with a lot of left right scrolling and will hit that back button very quickly if you annoy them.

Frames

Avoid frames unless you really know what you are doing!

Photographs and Graphics

Go easy on the large photos and graphics. Any graphic or photo bigger than 20k in size must be considered carefully. Will the time taken to load it put people off and persuade them to hit that back button on their browser?

Photos are best saved as jpg format files - all the modern graphics editors will save in JPEG format. Graphics are best in GIF format - it's very compact - again no problem saving files in this format.

Always put a width and height tag in your img src tag:

<IMG SRC="graphic.gif" WIDTH="24" HEIGHT="24">

This ensures that text will appear before the graphic finishes loading as the browser knows how much room to leave on the page. Otherwise you cause unnecessary delays.

Remember to include all your graphics with your web site package when forwarding it to info@castlebar.ie. It is very easy to forget that your editing package is picking up graphic logos, buttons, photos, etc. from standard directories on your PC or Mac. Right-clicking the image will reveal where it came from - checking its properties will tell you what folder it's hiding in. Place it in your main working folder and make sure that it loads OK and is visible in the browser.

Check all your Links

Make sure that all your links work before uploading your page or e-mailing it on to info@castlebar.ie. Place all your files in a single directory - if you like, use a single subdirectory called 'images' for your photos and graphics. Then check everything using your browser. Ideally check it with both Netscape and Microsoft browser.

Naming Your Main Page

Your main page should be called index.html. Using this default name prevents surfers from viewing the complete contents list of your web directory. It also allows you to shorten the URL of your site as it is not necessary to include index.html in the URL. For example, if you are the tennis club the following is your URL on www.castlebar.ie

http://www.castlebar.ie/clubs/tennis_club/

The last slash is necessary. You can dispense with the http:// if you are typing the address directly into your browser but it must be included in the text of any links to your URL in your pages.

The Long versus the Short

Some web sites drive you crazy when the Internet is busy and download times are down to a mere 200 bytes per minute. After waiting and waiting for a single screen page to appear (usually heavily loaded with dancing and singing graphics but very little information) - you find that you have to follow a link to a series of small but equally slow-loading pages which may or may not have the information you require. If it's information you are after, as opposed to admiring someone else's design skills, this can be very frustrating. Come back on a Sunday morning when things are quite please.

On the other hand some pages may have 200 k of text in a long scrolling page - usually full screen width and difficult to read even when you haven't had six pints the night before. At least you can start reading while it loads but the interesting bit is always at the bottom so you have to wait. Lots of people just don't like scrolling pages.

As usual there is a balance between the two. Make sure your home page loads quickly - make it small in bytes - say less than 15k in fast-loading text and perhaps another 20 to 30k in graphics in total. Give people something to read while the graphics are loading. This page has ~12k of text and the animated line graphic is 5k in size but loaded 13 times as a divider (caching increases the loading speed here) - plus 3k for the little ring graphic.