Design Hints and Tips
Designing for the web has several advantages over designing for print. There are no cost restrictions on using colour, the pages can be as long or as short as you wish and you can make changes later without the need for costly reprinting. On the minus side, it is more difficult to control what the reader actually sees.
Although Internet Explorer is very common, it's only one of several different internet browsers your readers may use to view your website. Unfortunately they don't all interpret the instructions that make up your website in the same way so the same page may look different in different browsers. In addition, your readers may be using a screen resolution, text size or font different from the one for which you designed, or they may even have the pictures turned off completely.
Keep it simple
The instructions for your website are written in a language called
HTML. It's safest to use the most straightforward version although the
amount of control it gives you over layout is fairly limited. More sophisticated
techniques give you more control but are not supported by all browsers
so, if you want to do something fancy, choose a method that works on
as many machines as possible. There are few things more off-putting
for a visitor than a message telling them to download a particular piece
of software before they can view your site properly.
The Importance of Speed
If your site doesn't download in a few seconds, your visitors won't
wait. They'll just move on somewhere else. Text downloads quickly. It's
pictures that take the time so use them wisely and only include them
if they really add something to the site. Using relatively low resolution
helps speed things up without noticeable loss of quality, and cartoon
type pictures with flat blocks of colour download faster than photos
as the files are easier to compress.
Animation can take ages to download and a moving picture on screen can be very distracting when you are trying to read text. So think hard before you include those dancing penguins. Are they really necessary?
Using colour and pictures
It's a good idea to give your site an overall feel which is reflected
in all its pages. One way to do this is with a consistent colour scheme
- the availability of millions of colours at no extra cost doesn't mean
you have to use them all. Choose a combination that reflects the feel
of your work. Barbara Cartland would probably have wanted pink but you
may prefer bright primary colours or a restful mix of creams and browns.
You can experiment with different colour combinations on our colour
page
Well-chosen pictures can also contribute to the site feel and give an instant indication of your area of work. Reddit the Frog gives our site a friendly appearance, and repeating him on all the other pages unifies the site without slowing it down as the picture only has to be downloaded once. If you write horror, you may prefer something scarier - maybe cobwebs, bats or a knife dripping blood.
To make your site more interesting, you can make a picture change as the cursor rolls over it or over an associated piece of text. You can also set up your site so the picture on the home page changes every day or on each visit.
Using sound
Sound certainly attracts people's attention. It can also drive them
mad so, if you opt to use it, make sure it turns itself off after a
short time rather than repeating endlessly. Visitors will tolerate longer
extracts from CDs and tapes if they have opted to hear them, but you
still need to keep them short enough to download fairly quickly. And,
of course, you need copyright clearance - music companies sue.
Because sound is so intrusive, many people turn it off, especially if the computer is in a living room, school or library. So think twice (at least) before you make sound essential to your site and, if you do, always provide a text version of any aural instructions.
Backgrounds
To make your site easy to read, you need a good contrast between the
text and the background. Although light text on dark looks striking,
it can be tiring to read a whole chapter like this. So, unless you have
compelling reasons to use a dark background, it's safest to opt for
a light one with dark text as it's more comfortable to read. But that
doesn't mean the background has to be white - cream and other light
colours work well. One of the worst combinations to use is red on green
- almost everyone finds this difficult and it's completely impossible
for anyone who's colour blind.
Textured backgrounds add interest but they can also make the writing less legible. The same applies even more to background pictures so use both with extreme care and only when the benefits definitely outweigh the drawbacks. If you do decide to do use one, set the background colour of the site to match the picture so visitors can read the text while they wait for the picture to download.
Text
Reading on screen is tiring so do all you can to help. Headings, short
paragraphs and bulleted lists make it easy to skim read. Limiting the
length of lines, instead of allowing them to run the full width of the
screen, cuts down the amount of eye movement needed and so does left
alignment of the text. This type of alignment also looks stronger than
centred text
On a more technical note, it's best to not to fix the text size exactly unless it's absolutely essential. This is partly because Macs and PCs interpret text size differently but, more importantly, because visitors with poor eyesight often choose to use a larger size to make reading easier. You can still have larger text for headings by specifying the size relative to the default setting in the visitor's computer (+1, +2 etc).
Navigation
It's important that your visitors can find their way around your site
easily with the minimum of clicks. 'Three clicks and you're there' is
a good rule - two clicks are even better.
Put the navigation buttons in the same place and in the same order on each page to help visitors who want to work their way through the whole site in order. Repeat the navigation at the end of each page to save them having to scroll back to the top, and avoid making pages which are dead ends with no way back to the rest of the site.
Plan for growth
It's far easier to change a website than a print publication, so your
site is likely to grow as you add new books and information. To keep
down the cost of doing this, try to plan the navigation system so it
can cope with extra pages.
Avoid frames
Frames sites divide the screen into one or more sections which work
independently. Although they have some advantages, these are usually
outweighed by the disadvantages. The major problem with frames is the
difficulty some search engines have in indexing these sites. They also
look particularly bad on smaller screens and can result in such a small
window for the text that visitors have to scroll backwards and forwards
to read each line.
Include metatags
Metatags don't appear on screen. They are words and phrases hidden
in the underlying instructions which help search engines decide what
each page is about. Missing them out drastically reduces your chances
of being listed, so potential visitors may not be able to find your
site.