Web Site Basics by Margot B
If
a page doesn't load in 8 seconds you lose 1/3 of
your visitors. Limit your text and limit the length
of your lines. Use around 65 characters per line.
Long lines are hard to follow. Dashes and bullets
increase readability while bold or italics can make
key points stand out.
Black
text on white background works well on Web sites.
On some screens the black and white contrast is
far too strong and tires the eyes so then the background
should be off-white. If your text is white, for
example, make your background image dark. Text on
a background with patterns is difficult to read,
the text color may blend in, making part of the
text impossible to see and read. If an image must
be used as background it should not disrupt reading.
Make sure the text color contrasts so it is easily
read.
San
serif fonts work best, and are created to be very
readable at small sizes and on most screens. Use
different sizes and colors for headings, subheadings
and paragraphs and give plenty of space in between,
to avoid monotony. Use as few stop words as possible
[e.g. and, to, when, etc]. A Web page should have
a primary heading describing very briefly what the
page is about. It should also have secondary headings
for each important section. Use HTML tables to divide
a long page into two or more columns.
Some Web sites don't use up all of the available
space. Building 'liquid' designs fixes this problem
by making the layout fit the screen. They expand
or shrink to the available, no matter what browser
window size or resolution the user might be using.
To do this, specify the width in percentages [e.g.
100%] - the copy inside the table will expand along
with it.
Music,
images, flash, splash, JavaScript will increase
download time. Flash files are especially hard on
bandwidth consumption. 25% of visitors leave instead
of clicking on the splash page and entering the
site.
Limit
yourself to no more than 5 or 6 images per page,
keep image files 12K or smaller in size, and convert
to .gif format. Reduce the amount of colors in the
image. Compare file sizes between the tweaked image
and the original, in NetMechanic's free Gif Optimizer.
Image editors, such as PhotoShop, have an option
to save an image for the Web.
Frames take up a lot screen space, are distracting
and Search Engine robots do NOT read pages with
frames! All they see are the outlines of the frames,
the <frameset>. They don't see any links,
so assume it is a dead page.
Text
color should contrast well with the background.
Test your site in a variety of browsers for free
at http://www.anybrowser.com/ScreenSizeTest.html.
It
is common for something to cause the site to disappear,
so make a copy and keep it current.