C:\Wpwin8\doc\work\solutions\website updating

UPDATING
UPDATING
YOUR
WEBSITE
Sam Partington
revised June 2004
Introduction
CONTENTS
Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
How does the Web Work? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Why and When to Update . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
Software Packages Available . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
How to Update a Website . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Opening, Closing, Saving and Exiting . . . . . . . . . . . . . . . . . . . . 10
Creating a New Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Renaming or Deleting a Page . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Page Settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Paragraph Spacing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
I have written this booklet so that when I make a website for someone he or she will be
able to keep it running and update it themselves. This booklet is primarily designed for
those with very little experience in updating websites, although it should be useful also
for those with more experience.
To ensure that it provides as much useful information as possible, this booklet assumes
that I have not given you any help or site-specific advice about editing. However, it is
my policy to provide such information – so don’t be surprised if you don’t need all of
the information in this booklet.
The Sam Solutions website has a specific section for those for whom I’ve made a
website. You can find it at www.samsolutions.co.uk/update-etc.htm
Don’t forget that I’m available to help out with website updating or any other Internet
/ computer issues for just £7.00 per hour. If you like, I can look over the updates you’ve
done on your site and help you improve your updating skills further.
I would be very grateful to receive any comments or queries you might have about this
booklet. Please feel free to e-mail me on [email protected].
Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Lines . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
How does the Web Work?
Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
It seems that everywhere we go nowadays we are bombarded with Internet related
information. Website addresses are appearing on everything from billboards to packets
of cornflakes and from radio commercials to aeroplanes. But what exactly is the web?
What’s the Internet? Is there a difference? Do you have to be a computer-nerd to understand the answers?
Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Lists . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
Text Settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Frames . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Design Tips . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Browser and Screen Considerations . . . . . . . . . . . . . . . . . . . . . . 21
More Advanced Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
Publicise your Updates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Domain-Names and Hosting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Uploading your Website . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Website Promotion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Glossary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
I can start by assuring you that the answer to the last question is ‘no’. The basics of the
Internet and the web are really very simple. To put it in a nutshell, the Internet is
essentially a huge number of linked networks of computers throughout the world. These
computers are connected by phone-lines. The ‘World Wide Web’ is the actual webpages stored on the computers that make up the Internet. (See – easy!)
When you connect to the Internet you will almost certainly access it via your ‘Internet
Service Provider’ [ISP]. ISPs in the UK include LineOne, AOL and Freeserve. When
you connect to the Internet via an ISP your computer will begin by calling the ISP’s
computer using your modem and phone line. A connection between the two computers
is set up (hopefully) and then all information which you get from the web is sent to you
via your ISP’s computer. When you request a page (by clicking on a link, typing in an
address or whatever) that request is passed through your ISP’s computer and will
eventually arrive at the computer where the site you are looking at is stored. That
computer will then send the information back to you. Computers which are permanently
4
connected to the Internet and which store websites are called ‘servers’ (see the Domains
and Hosting section later on).
Although you might not think it, all basic webpages are made up of plain text (they’re
sent as binary numbers but that’s another story). This text is written in what is called
Hypertext Markup Language [HTML] and you can see it by right-clicking on a webpage
in your browser and selecting ‘View Source’ or alternatively selecting ‘view source’
from the ‘View’ menu if you’re using Netscape Navigator.
TIP: Viewing the source of a page is a useful thing to do if you want to find out how a fancy coding
trick has been done.
Once this text gets to your
browser (such as Internet
E x pl ore r or Ne t sc a p e
Navigator) the browser reads
the text and interprets each bit
to discover how to present and
lay out the page.
the source code for a page (viewed in Notepad)
I m a g es , soun ds an d
mult i m edi a a r e stored
separately from the page, and
the HTML simply contains
references to them so that the
browser can find them and put
them into the finished page.
Websites
are
basically
The first (and most obvious) reason is that unless you update your website the information on it is going to become out-of-date and inaccurate. Another important reason is
that if the content of a website changes regularly then the website will be more
interesting for its visitors. Visitors are far more likely to return to a site which will have
new or updated content each time they visit and are more likely to trust the information
they find if they can see that a site has been updated.
A more technical reason for updating is that some search-engines (see the section on site
promotion below) will give your page a higher ranking if it has been recently updated.
A higher ranking means that your site will appear nearer the top of the list when
someone searches for it.
Now you know that updating is important you’ll be wondering how this all relates to
you. When should you update your site?
The obvious times when you will need to update your site are occasions when information has become out-of-date. For example, you would alter information when a product
or service’s price or details change, when a new product is added to your stock or when
an old product is no longer for sale.
However, you know that accuracy is not the only reason for updating. Keeping your
visitors interested is also very important. I would recommend making some sort of
update to your site at least once a week. Remember that some updates are very quick
and simple and it should not be a problem to make a simple update every few days.
Updating need not involve your spending hours creating entire new sections for your
site. There are many simple ways to keep your site up-to-date and interesting:
C
a
collection of linked pages and images / multimedia.
C
There. That wasn’t so painful after all. If you want to find out more about how the web
works, you can visit The WhatIs description at http://whatis.techtarget.com
/definition/0,289893,sid9_gci212370,00.html. You can find out about the history of the
Internet at http://library.thinkquest.org/11373/history.html
C
C
C
The rest of this booklet will also explain more about a number of the above concepts
including HTML, servers and browsers.
C
Why and When to Update
A common misconception is that once you have a website up-and-running you can
simply sit back and watch the visitors arrive. Unfortunately this is not the case. As
more and more websites are created updating becomes more and more important. There
are a number of reasons for this:
5
If your site has a links page or similar, spend a few minutes finding a new site to
link to (and check that your current links are still correct).
If your site has a resources page, keep your eyes open for useful resources to
include or link to.
Have a tip of the day/week (or similar) relating to your business.
Allow your visitors to send you content for the site (for example, product
reviews, comments or tips).
If you have a Frequently Asked Questions [FAQ] page then add a new question
to it. You should certainly add a new question and answer to it if someone emails you with a relevant query not already covered.
Include occasional articles on your area of business.
The above is just a small selection of the many ways in which you can keep your site
updated. It is likely that you will decide that you want to do some more major updates
as well as just minor changes. For example, you may decide to add a new page to your
site. It is worth considering more major upgrades if they will make your site more
interesting.
6
Read on to find out how you can begin updating your site.
For example, you could say that Microsoft Publisher was a WYSIWYG Desktop
Publishing program, as a page you print with Publisher will generally look like the page
displayed on screen.
Software Packages Available
One option is of course to code your webpages yourself. However, there are many
packages which will create your HTML code for you. I may have already helped you
to choose a web-editing package but if not, or if you’d like to try out some others, then
the following information may be helpful.
Website creation packages fall into two main categories: HTML editors and WYSIWYG
editors (another bizarre web acronym!). HTML editors are programs which help you
write the HTML code itself. When running an HTML editor, the main section of the
screen will contain the code for your page. The text may be colour-coded to help you
understand it.
The editor will allow you to select various elements which you would like to put into the
page. You will generally select these elements from a menu or similar. When you
select an element (such as a table) you will be prompted to select various attributes for
the element (with a table the options would probably include border thickness, number
of rows and columns and so on). Once you’ve selected your options, the code for the
selected element will be put into the page. You can of course enter your own code or
modify code which the program inserts for you.
WYSIWYG editors generally
look and work in a similar way to
that of your Word Processor or
Desktop Publishing program, and
you edit the pages in a similar
way.
When you insert an
element (a line, a link, a table or
whatever) it will appear on the
screen as it will appear when you
view the page in a web browser.
When using a WYSIWYG editor
the main part of the screen is
taken up by a view of your page.
WYSIWYG programs available
include:
C
C
C
C
HTML editing packages available include:
C
C
C
HotDog Pro (shareware): http://www.sausage.com
Coffee Cup HTML editor (shareware): http://www.coffeecup.com
HTML-Kit: http://www.chami.com/html-kit
HTML editors make
editing webpages a lot
easier than coding by hand.
However, WYSIWYG
editors take it that one step
further.
a screenshot from the WYSIWYG package DreamWeaver
Dreamweaver: www.macromedia.com/software/dreamweaver
FrontPage: www.microsoft.com/frontpage
AOLPress: www.daviestrek.com/software/aolpress (free)
Net Objects Fusion: www.netobjects.com
You may find that your computer already has FrontPage Express (a cut-down version
of Microsoft FrontPage) installed, as this comes free with some versions of Microsoft
Office and Internet Explorer. The Netscape web-browser includes Netscape
Communicator, which is another useful WYSIWYG editor.
A useful resource when comparing WYSIWYG editors is Webmonkey’s review at
http://hotwired.lycos.com/webmonkey/01/39/index4a.html. However, it was written in
2001 and so will not refer to the newest versions of some software.
WYSIWYG stands for
What You See Is What You
Get and, put simply, means
that what you see on the
screen is what the finished
product will look like.
This term does not only
apply to webpage creation.
7
the site navigation view from Microsoft FrontPage
8
Some website
e d i t o r s
(especially
WYSIWYG
programs) have
a number of
facilities for site
m a n a gemen t .
For example,
some include
fa c i l i t i e s t o
u p l oa d you r
saving as HTML in WordPerfect
pages to the
Internet (see section on Uploading below). Other facilities which may be incorporated
into a package include automatic link-editing (so that when you rename a page all pages
which link to it will alter to take this into account), automatic navigation-bar creation
and so on.
Many Word Processing and Desktop Publishing [DTP] packages such as WordPerfect,
MS Word and Publisher allow you to export as a web-page. However, I strongly
recommend using a specific website creation program, as a wordprocessor or DTP
package may spoil the code I have written for your site. To save in HTML format, you
will probably need either to select Export as HTML (or similar) from the File menu, or
select HTML as the file type from the Save As dialogue box (see above). However, this
varies from package to package.
More Advanced Tip: Word Processing and Desktop Publishing packages usually export pages with
a lot of unnecessary code which slows down page-loading and is generally unnecessary. If you have
basic knowledge of HTML, open the page in an HTML editor or notepad and remove the unnecessary
code. (I also recommend doing this for pages created by a Web-Authoring package as they often
include unnecessary code too.) For example, Word will usually put XML code into your page which
will contain information about the document (creation date etc) but will not be displayed on screen.
I recommend you remove this. However, doing this is not essential.
More information on editing code yourself can be found in the How to Update section
of this booklet.
The important thing is that you will know what is possible and will understand any
options you are given by your editor. Most programs will have keyboard shortcut or
toolbar icons which can be used in place of the menu choices I mention.
Before explaining the elements you may want to know a couple of very basic things
about HTML. Every element and layout instruction in HTML is written as a tag. These
tags are always enclosed by <triangular brackets> Most tags come in pairs where the
first tag announces the start of an element or specific bit of formatting and the second
one tells the browser that the element or formatting-command has finished. Ending-tags
start with a forward slash (/) inside the triangular brackets. For example, to write some
text in bold I would use the following code: <b>Text here will be in bold
as it is included within the bold tags</b>. An example of a tag
which does not need to come as part of a pair is the <p> tag which inserts a paragraphbreak. HTML is not case-sensitive.
If you would like to learn more about HTML, there are a number of tutorials available:
C
C
C
C
HTML goodies: http://htmlgoodies.earthweb.com/tutors
Webmonkey: www.webmonkey.com/authoring/html_basics
HTML tutorials by John C. Gilson: http://www.bfree.on.ca/HTML
Dave’s HTML guide: http://www.davesite.com/webstation/html
Now, on to the basics:
Opening, Closing, Saving and Exiting
If you can open, close and save documents in your Word Processor then you’ll be able
to do the same with a webpage editor. You will find the open, close and save commands
in the ‘file’ menu and they will almost certainly be
represented by icons on the toolbar. In the same
way, you can cut, copy and paste using the
commands from the ‘edit’ menu or the toolbar icons.
(See image)
Your editor may have a ‘Save All’ option. This will
save all open pages.
How to Update a Website
In the following section I have decided that rather than giving you a basic tutorial for
each of the main website editors I will instead show you what can be done and a basic
idea of how to do it. This will enable you to pick up and use almost any website editing
package easily. The suggestions on how to perform each operation may not work in
every editor but should give you a basic idea of what to do.
If you are using your website editor’s site-management view (or similar) then this may
present you with a list of files in your website. You can open these by double clicking
on them.
The Exit option will be found in the ‘File’ menu and
you can also exit by clicking on the uppermost X icon
clicking the ‘HTML’ tab shows you the in the top right corner of the window.
page’s code.
9
10
If you use a WYSIWYG editor then it will have a ‘view HTML’ or ‘View Source’
option. This allows you to see the code for your page and will normally be found in the
‘View’ menu. Alternatively, some web-browsers allow you to access the code by
clicking on a tab.
or changing! Your website editor may have a facility to show you which pages link to
which others, or which pages contain ‘broken’ (non-working) links.
Page Settings
Creating a New Page
Creating a new page will usually simply be a matter of selecting ‘New’ from the ‘File’
menu. If you’re working in a page-editor then this will present you with a blank page
which you can then save. If you’re working with the site-management part of your
editor, then this may simply add a new entry to the list of files. You can then doubleclick on it to open and edit it.
It is possible that I will have provided you with a template to use to ensure that your new
pages look the same as the others on your site (such consistency is very important). If
this is the case then you should make a new page by opening your template page and
selecting ‘Save As’ (not ‘Save’) and saving it with a new name. You can then work on
this newly saved page. Alternatively you could create a copy of the template file using
‘Copy and Paste’ in Windows Explorer or in your editor’s site-management facilities.
This copy can then be renamed as whatever you want and edited as normal.
It is important to note that folder and page names are case sensitive. This means that a
page called MyPage.htm is not the same as mypage.htm. You should decide upon a
standard (I usually choose all lowercase) and stick to it.
Renaming or Deleting a Page
If your website-editor has a site-management section, you should make all changes to
files (e.g. renaming, deleting, moving) in this rather than through Windows Explorer or
another program. This will allow your editor to keep track of your pages (it may even
update your links automatically).
To rename a page, right-click on it in the file-list and select ‘Rename’ from the menu
which should appear (you could also look for a ‘Rename’ option in the File menu). If
your website editor doesn’t update your links automatically, then don’t forget that you’ll
need to edit every page which links to your renamed page so that the link points to the
file’s new name.
To delete a page, single-left-click on it and press the Delete key on the keyboard (not
Backspace). Alternatively, look in the File menu or right-click and look for a Delete
option in the submenu if one appears. Don’t forget that once a page is deleted, other
pages of yours will still contain links to it. These links will obviously need removing
11
To access the settings for a page open in a WYSIWYG editor you will generally simply
need to right-click on the page and select ‘Page Properties’ or similar. Alternatively,
you may access the settings box by selecting ‘Page Settings’ from the ‘File’ or ‘Format’
menu. If editing the code by hand, these elements will be changed by editing the
attributes in the <body> tag.
The most important page-setting is Title. (This is not the same as your pages’s
filename.) The title shows up in the browser’s header-bar when someone visits your site,
and allows them to see at a glance what your page is about. It is also very important for
Search-Engines (see below). A page without a title (or worse, with a default title such
as “new page 1”) will not look very professional. Use a descriptive, relevant title
instead. For example, for the ordering page of Bob’s Gizmos a title like “Bob’s Gizmos
– Ordering” would be good. Even better would be one which included descriptive words
about Bob’s Gizmos (eg “Bob’s Gizmos – original and creative gifts for all the family:
Ordering page”).
Another of the basic page-settings is background-colour. This will normally be selected
from a palette of colours. The background colour will apply to the whole of the page
where it is set. You can also set a background image for a page. If an image is smaller
than the page size then it will be tiled to fit. This means that the image will be repeated
as many times as necessary to fill the page. Bear in mind that images take time to load
and a large image will slow down your page-loading dramatically (see below for more
advice on image editing).
Tip: You should always set a background colour, even if you are including a background image.
This means that the page will look okay whilst the image is loading. If you want a white background
then you should set the background colour to white rather than just leaving it (even though the page
may look white in your editor) as otherwise the user’s default background colour will be used which
may be something completely different and thus cause your page to look odd or become unreadable.
For the same reason, you should also set a colour for text and links rather than leaving as default.
In the page-settings box, you can should also be able to alter the colour of three different
types of link:
Standard link colour: this is the colour of your links before the user has clicked on them.
Active link colour: this is the colour that a link will be if it points to the page the user is
currently visiting.
Visited link colour: this is the colour that a link will be if a user has already been to the
site or page that the link points to.
12
You will also be able to alter the standard text colour for your page. You will be able
to highlight certain sections of text within your page and change their colour to
something different so do not worry that by selecting a colour for text in your page
settings you will then not able to change text colour later on.
Tip: Make sure that your links stand out from the rest of your text so that users know where to click.
Tip: If you want to change the default colour for text on your page, do not select all the text in your
editor and change the colour that way. That will produce unnecessary code and lead to problems
later. Change the standard text colour through page settings instead
You may also have the option to set a sound or music clip which plays when your page
loads. Bear in mind that these clips can be quite large and can drastically slow down
page-loading. I would also strongly advise against including sound or music which
plays when a page loads as this annoys many users and many people may think that your
site is unprofessional if it uses these. You could instead provide a link to the sound or
music clip so that the user can play it if they wish but not if they don’t.
Paragraph Spacing
The default paragraph spacing on the web is 1.5 lines (as in this booklet). However, you
can have single paragraph spacing (<br> tag). This is often accomplished by holding
down the [Shift] key before pressing [Enter] or by selecting ‘Line Break’ or similar from
the ‘Insert’ menu.
Links
Links are what differentiate Hypertext (the text in webpages) from ordinary text as they
mean that by clicking on a piece of text or an image you can be taken to a different
document or a different part of the page.
There are two types of links: local links and external links. Local links link to a page
in your own website. So if you had a page called one.htm and you wanted to link to it
from another page in the same folder, you would only need to have ‘one.htm’ in the
link-address. If the link was in a folder called ‘business’ and that folder was a sub-folder
of the folder that the page you were putting the link on was in, the link would say
‘business/one.htm’. However, with a webpage editor you do not need to worry about
that. The editor will let you browse around your folders until you find the file you want
to link to and will then make the link for you.
www.something.com.
You could be more specific and link to http://
www.something.com/stuff/business/europe.htm. Please note that links never end with
a full stop (.) Therefore
the address for Sam Solutions would be
“http://www.samsolutions.co.uk” and not “http://www.samsolutions.co.uk.” If you ever
see a full stop at the end of any address then just assume that it is marking the end of a
sentence. You should not leave off the http:// at the beginning of addresses or the link
will not work.
To create a link in your webpage you begin by selecting the text or image which you
want to make into a link. Select the text either by clicking before it and dragging the
mouse pointer (with the left button held down) so that the entire section of text is
selected (blocked) or by holding down the Shift key and using the arrow keys. To select
an image in a WYSIWYG editor simply click on it (you may need to double click).
Once the thing which you want to make into a link is selected you may be able to rightclick on it and select ‘Insert Hyperlink’ or similar. However, in some editors you may
need to select ‘Hyperlink’ from the ‘Edit’ or the ‘Insert’ menu. Once you have done this
you will be prompted to specify the place you want to link to. Either type an address or
page name or use the ‘browse’ button or similar.
Another type of link is called an anchor. You may hear these referred to as ‘bookmarks’
although I recommend using the term anchor as it avoids confusion. An anchor link is
a link to a particular place on a web page. When the user clicks on it, they will be taken
to the relevant part of the page.
To create an anchor link you first need to place an anchor (the anchor-link destination)
on your page. To do this simply go the to the section of you page where you want to put
an anchor and select ‘anchor’ or ‘bookmark’ from the Insert menu (or possibly from the
Edit menu). You will then be prompted to give your anchor a name.
You then create a hyperlink as normal but when it comes to entering an address you
instead enter the anchor name prefixed by a hash [#] (see illustration). So to link to the
anchor called ‘detail’ I would enter #detail as the address. Some editors will allow you
to select the anchor name from a list of all anchors on the current page or offer a
separate box where you can type the anchor name. If you are entering the anchor name
into a box specifically called ‘anchor’ or similar then you will almost certainly not need
the #. Try it and see.
External links link to a page on a website other than your own. For example, you may
want to have a link on your website to http://www.samsolutions.co.uk. These links are
created in the same way as local links except that rather than browsing around for the
file you will type in its address. You are not restricted to simply entering an http://
13
14
You can link to an anchor on
another page by entering the
page name or address
followed by a # and the
anchor name. For example,
to link to the anchor
‘section2’ on the page
one.htm I would enter the
address as one.htm#section2.
For images, GIFs and JPEGs (more info in the How to Update section) can be opened
in every browser except for the text-only ones. BMP files are also fairly standard but
people using a Mac or an operating system other than Windows may have trouble. PNG
(see below) is becoming a more popular format.
If offering downloads in a format for which your users may not have the program then
it is polite to offer a link to a place where that program or an appropriate viewer can be
downloaded. For example, viewers for Microsoft office documents are available at
http://office.microsoft.com/Assistance/9798/viewerscvt.aspx
linking to an anchor in FrontPage – note the #anchor in
the ‘URL’ box and the fact that ‘anchor’ is selected from
the ‘Bookmark’ list. (anchor is the anchor’s name in this
case)
If you want to make a file
available for download then
it is often a simple matter of
putting a link to that file on your page. If you are linking to something which the
browser can’t open, simply clicking on that link will give the user the option to
download the file. Otherwise, if you are linking to something which the browser can
open, you will need to ask your users to right-click on the link to it and select the
relevant ‘Save’ option.
Bear in mind that not all users have the same software. Therefore you should make sure
that they’ll be able to open your downloads. One way to help with this is to provide a
link to a download of a program which can open the file. However, it is also worth
considering using a standard format for your file. The following are a few standard filetypes (some of which can be embedded within a webpage or displayed in a browser):
ASCII text (.txt) can be opened by anyone with notepad, a browser or even with DOS’ built-in editor.
Every computer can read .txt files and this is a good format for plain text.
Rich Text Files (.rtf) are a common standard for exchanging documents as they support bold, italic and
almost everything else you’ll need for simple formatting. Windows users can open rtf files with Wordpad
or their Word Processor.
To save a document as .txt or .rtf it is simply a matter of selecting that file-type from the
drop-down list entitled ‘File Type’ or similar when saving a document with your word
processor. Bear in mind that with .txt all formatting will be lost and with .rtf you may
lose advanced formatting.
If you want to offer a document which has more advanced formatting than RTF allows
then you could offer it as a Word document as many people have Microsoft Word.
However, you should ideally offer it in other formats (e.g. WordPerfect) as well. One
obvious solution to the multiple formats problem is simply to offer the document as a
web page!
Adobe’s Portable Document Format (.pdf) is quickly gaining popularity.
www.adobe.co.uk/epaper. for more information.
Visit
15
Tip: Don’t forget that, unless they know a specific page’s address, the only way visitors can
navigate your site is by following links. You should therefore assume that if a page isn’t linked to
by another page, users don’t know it exists. It is also good practice to provide sufficient links to
enable your visitor to view your site without having to constantly use their ‘back’ button.
Lines
Horizontal Lines (<hr> tag) are very useful for breaking up text. Your editor may
allow you to specify the width, alignment and thickness (size) of the line. Like many
HTML elements, the width of the line can be as a percentage of the page-width or as an
absolute value in pixels. A percentage width is entered simply by entering a number
followed by a % (e.g. 50%) whereas entering a number on its own will give the line a
width of that number in pixels.
The default setting is 100% width, centre-alignment and a thickness of 1. <hr> doesn’t
have a closing tag.
Images
Images have the power to enhance your page’s look but should be used with care. When
using images, bear in mind that they will take time to load, especially for users with
slower modems or connections. Also bear in mind that some users use text-only
browsers, and some browse with images turned off. Therefore I recommend that you do
not rely solely on images (buttons) for navigation, and that you provide textual
hyperlinks also.
Images on the web come in two main formats: GIF (Graphics Interchange Format) and
JPEG/JPG (Joint Picture Export Group). Standard GIF files can have up to 256 colours,
one of which can be set as transparent. This makes them ideal for use as buttons and
simple pictures. However, if you would like photo-quality images displayed on your
website, you should use JPG files as these can contain up to 16 million colours. Bear
in mind that the more colours an image has, the bigger the file will be. With simple GIF
files, you can often set them to have only 64 colours (or perhaps even fewer) without any
16
loss of quality. As well as this, you should remember that some people’s screens will
only be able to, or set up to display 256 colours or less. Some browser and screen
settings will mean that your images can only be displayed with an even smaller number
of colours.
TIP: When altering the number of colours in an image, reduce the number in stages. So if your image
is currently set to 256 colours and you think that you can get away with 32, first set the number of
colours to 128, then 64 and then 32. This will result in a clearer, better quality image.
TIP: If your images are designed to be displayed on screen, your can use a graphics package to
reduce their resolution (the number of dots per inch) to 72dpi without any loss of quality. Experiment
with even lower resolutions to reduce file size.
When using images, I recommend that you include an alternative text representation (the
alt=“text here” attribute). This text will be displayed whilst the image is loading, and
if the user has images turned off, they will see this text. Also, in some browsers, the user
will see this text in a little yellow box (tooltip) when they move their mouse pointer over
the image. Text-to-speech programs for the blind also read the alt text to help interpret
images. Your HTML editor should let you specify this text. I also recommend that you
specify the height and width of your image to speed up the loading of your page.
can set the alignment of the entire table and give it a caption (the caption will appear just
above the table).
You can also set cell-padding and cell-spacing. To set these you will probably need
either to right-click on the table and select ‘Format Table’ or select ‘Format’ or ‘Format
Table’ from the ‘Table’ or ‘Format’ menu. Cell-padding increases the size of the cells’
borders whereas cell-spacing adds space inside the margin of your cells, pushing the
contents towards the middle of the cell.
For individual columns you can set width (you may have to select all cells in the column
and then use a cell-width option) and you may be able to set the height of rows. You
can also set the alignment of whole rows. Doing this will give every cell in the row the
alignment you select.
Individual cells have a few special settings. You may come across colspan and rowspan.
Colspan allows the cell to span across more than one column whereas rowspan spans the
cell across more than one row:
Cell A has a Colspan of 2:
TIP: If you’d like your image to be displayed at a size of 100 x 100 pixels but your image is currently
200 x 200 pixels DO NOT set the height and width to 100 x 100 in your webpage editor. If you do,
the full 200 x 200 image will be loaded and then resized by the browser. This sort of thing drastically
slows down your page-loading. Instead, you should resize the image in your picture editor.
CELL A
GIF images can be animated and many paint programs will allow you to created
animated GIFs. Alternatively, there specific programs for animating GIFs. However,
although animations might look pretty they should be used with great care. Animations
do slow down page-loading and are thought of as unprofessional by many users.
Cell A has a Rowspan of 2:
There are other ways of incorporating more professional animation into your page. See
the Advanced Elements section below.
CELL A
PNG (Portable Network Graphics) is a graphics format which is gradually becoming
more widely used and supported. For a quite technical overview of PNG visit http://
www.w3c.org/Graphics/PNG
Your editor may allow you to edit your table in this way by selecting two or more cells
and right-clicking and then selecting ‘Merge Cells’ or ‘Join Cells’. Alternatively you
may find this option in the ‘Table’ menu.
Tables
Tables in HTML work in basically the same way as tables in a word-processed
document. To insert a table you may need to select ‘Table’ from the ‘Insert’ menu, or
alternatively your editor may have a separate ‘Table’ menu which will have an ‘Create
Table’ (or similar) option. There are a number of attributes which you can edit for your
table:
THIS CELL SPANS TWO ROWS AND TWO COLUMNS
For the table as a whole you can change the border-width and table size (a percentage
or absolute size). You can also set the background colour and image if you wish. You
17
18
In the same way that you can join or merge cells you can also split them. Try selecting
the cell you want to split and either right-clicking and selecting ‘Split Cell’ or else
selecting ‘Split Cell’ from the ‘Table’ menu.
TIP: Wise use of column and row spanning can reduce the amount of code in your page thus
decreasing load time.
select ‘Font’ or ‘Format Font’ from the ‘Format’ menu, or right-click on it and select
‘Properties’, ‘Format Font’ or similar.
You can edit the following properties of text: bold, italic, underline, strikeout, subscript
and superscript font and alignment.
For individual cells you can also set vertical and horizontal alignment of cell contents.
TIP: If text is underlined, your users may expect it to be a hyperlink. For this reason, underlined text
is uncommon on the web. Text can be made to blink but users don’t like this.
TIP: You can set cells as Header Cells (<th> tag). These cells will be displayed differently from
the other cells. Usually browsers will display the text in header cells as bold although you can alter
this setting using style sheets (see Advanced Elements section below).
TIP: Bear in mind that if you set your text to a font which the user does not have, the browser will
attempt to substitute a font which may be unlike what you intend (often the browser’s default font).
Therefore, be careful when using fancy fonts.
TIP: Tables within tables are called nested tables. These might sound flashy but will slow down page
loading and may not look as you expect depending on the user’s settings. You can usually achieve
the same effect by splitting cells.
You can also write text in one of HTML’s standard styles. These may have different
names in different editors but are commonly known as the following:
Lists
Lists are very useful for breaking up text and highlighting key points. Web pages can
include three main types of lists: Bulleted Lists, Numbered Lists and Definition Lists.
To insert Bulleted lists try looking for ‘Bullets or Numbers’ (or similar) in the ‘Insert’
menu or selecting text then right-clicking within it and selecting ‘Bullets’ or similar.
Examples of Bulleted and Numbered lists are below:
C
C
C
C
This is
a
bulleted
list
1.
2.
3.
4.
Literal Text
Defined Instance
Keyboard Entry
Strikeout
Typed Code
These texts may appear differently in different browsers / settings and are normally used
for examples of code, quotations and so on.
This is
a
numbered
list
Font size icons
Bulleted and Numbered lists are automatically given single line-spacing.
Definition lists are a list type which you may not have come across before. Definition
lists a number of terms, each followed by an indented definition:
Although your editor may allow you to set the point-size for
your fonts, the most common (and in my opinion, best) way
to alter font-size is to use HTML’s relative font sizes. To
do this select the text you want to enlarge or reduce and
look for a option such as ‘Increase Size’ or ‘Reduce Size’ in
the ‘Format’ or ‘Font’ menus. Many editors also have a
couple of font-sizing icons on the toolbar.
You can also set a section of text as a heading. Headings vary in size from 1 (largest)
to 6 (smallest).
Sample Definition List
The definition is explained above
Next item
And here is its definition
Item name goes here
Definition goes here
Forms
99% of the time forms are used in conjunction with
some other element which will usually perform
calculations based on what you enter or which will
e-mail the form’s contents to a specified e-mail
address. Forms can contain the following elements:
Single Line Input Boxes (you can set their width in
characters), lists, radio-buttons (with radio-buttons the
user can chose only one of the options), check-boxes,
Text Settings
Whilst you can set the text-settings as part of the page-settings, you can also set the
properties of individual sections of text. To edit properties of text simply select it and
19
20
text area (you can set the width and height), drop-down lists, pick-lists, submit-button,
reset-button.
An alternative way to create a navigation-bar is to use tables, and to use the left or
rightmost column as a navigation bar.
The submit-button performs whatever action is associated with the form, the reset-button
clears all fields in the form. You can also have general-purpose buttons (newer browsers
only).
TIP: For a number of HTML elements (images, form field and so on) you will be given the option
to give them a name. This is only necessary if you are going to be using them with Javascript (see
below) and so you can probably ignore it. However, if you are using an HTML editor you may find
it useful to name elements so that you can understand the layout of your page better. Elements’ names
are not displayed when the page is viewed.
TIP: What’s the difference between a pick list and a drop down list? A drop down list is a list of
items which is displayed as a single option with a downward arrow beside it which expands the list
to full view. A pick-list (less common) displays all options on-screen at the same time.
TIP: When editing HTML you will have the option to insert comments which will be ignored by the
browser but which could be useful to help you (and any of your visitors who take a look at your page
source) understand your code. Use them if you wish. It’s up to you.
Frames
Have you ever seen a site which
has a navigation-bar on one side
which remains constant as the
main page changes? This is
accomplished using frames.
Frames split your browser
window into two or more
sections and allow you to create
navigation-bars and so on. When
using frames, bear in mind that a
few users will not have a browser
which supports them. Most webpage editors should allow you to
create a page which will be seen this site uses frames on the left and at the bottom of the screen.
by users without frames (and by
search-engines!). This is done using the <noframes> and </noframes> tags.
Design Tips
C
C
C
C
C
C
C
TIP: Your webpage editor should allow you to set the target frame for hyperlinks. If creating a
navigation-bar, ensure that the links from this bar are pointed at your main frame so that the page
selected loads in the main frame rather than inside the navigation bar frame. If you are coding your
HTML by hand, use the frame=”framename” attribute for your hyperlinks. Ideally, your links
to other sites should open in whole page mode (“_top” frame) as this means they take up the whole
window rather than being squashed into your frames. Alternatively, you could set them to open in
a new window.
C
When I create sites using frames, I usually do not create an entirely separate site for
browsers without frames support. Instead, I create an alternative first page only. The
links on this page take users to the pages which are usually displayed inside the main
frame of my site (to which I add hyperlinks so that users can navigate without using
frames). This way I create fewer pages, and I can ensure that my users see the same
information whether they browse with frames or without.
21
Don’t go overboard with multimedia and large graphics. Make sure that your site
is usable by someone using a text-only browser (see below).
Use tables to lay out content in a presentable form. Don’t forget that you can set
the border to 0 which is useful when using tables for layout.
Try to make your site easy on the eye. Break up longer pieces of text with lines,
indents and sections.
Avoid making all your text bold or all in UPPERCASE, as this will make it a
strain to read. However, your text should stand out from your background.
Don’t forget to set a background colour for your pages, even if you want a white
background. Otherwise the browser default will be used, which will make your
website look different from what you intend.
www.netmechanic.com will look over a page in your site (and offer software to
check the whole site) and tell you how you can improve it by adding or removing
code, optimizing images and so on.
The World Wide Web Consortium (www.w3.org) have guidelines and standards
for using code and so on. Their site has information on most aspects of websitecreation and is useful for ensuring that your site is well coded. www.w3.org/wai
provides information on making your website accessible for users with
disabilities.
Spellcheck and proof-read. I also recommend getting someone else to proofread
for you as often you won’t notice your own mistakes.
Browser and Screen Considerations
Bear in mind that not every user will have the same browser as you, and not every user
will have the same screen-settings as you. I therefore recommend that you try to look
at your site in a number of browsers and browser versions, or get friends to do this for
you. This way you can ensure that your site looks okay who ever sees it.
22
AnyBrowser.com’s Site Viewer: www.anybrowser.com/siteviewer.html shows you what
your site will look like in a number of browsers.
It is also definitely worth looking at your site with different screen-settings (number of
colours and resolution). To change your screen-settings (in Windows) right-click on
your desktop and select ‘Properties’. Next click on the tab entitled ‘Settings’. You can
then change the number of colours using the drop-down list-box entitled ‘Color Palette’
and change your resolution using the ‘Desktop Area’ slider.
If your site looks odd with different screen-settings try and alter how it looks. The most
common resolution is 800 x 600 but bear in mind that a significant number of users use
an alternative.
VBScript – Like Javascript but only works in Internet Explorer.
CGI Scripts – Common Gateway Interface (CGI) scripts are what powers most searchengines. They also allow visitor-tracking, guestbooks and other useful utilities. If your
site is stored in the free space which came with your Internet account, it will probably
have some free scripts which you can use. However, you are unlikely to be able to use
any scripts apart from the ones they supply. Some other webspace providers will allow
use of any scripts you want. (In technical terms this means you have access to the CGI
bin). CGI scripts are usually written in either Perl or C/C++.
Very Advanced Tip: On UNIX Servers (mainly), you may find that when you try to run your script,
you are redirected to the homepage of your webhost (or similar). This is often because the file’s
permission settings (i.e. who can access it) are incorrectly set. These permissions can to be changed
through many FTP programs (see the section on File Transfer below). Try right-clicking on the file
you want to alter, or looking for a ‘Commands’ menu or similar. Visit http://seedesigns.com/
dev/tutorials/chmod.shtml for information on how to change the permission settings (CHMOD) file.
Generally, but certainly not always, you will need to CHMOD your script files (usually ending in .cgi
or .pl) to 755. The help-file for your script should include information on what the script will need
to be CHMODed Although this tip is advanced, I have included it as I have found that permission
settings are one of the main problems faced by users attempting to run CGI Scripts on a UNIX server.
TIP: If you have an Apple Mac or someone you know does, try and look at your site using that too.
You may notice some differences.
More Advanced Elements
Websites don’t have to stop at simple HTML. If you’re feeling brave, you can try some
of these features:
Cascading Style Sheets allow greater control over how your page looks. Visit http://
www.htmlhelp.com/reference/css for information on how to use them, or look in the
Help Files for your webpage-editor.
Javascript – Most modern browsers support Javascript. It allows greater control over
the browser window and display, as well as form-validation and more. For information
on Javascript visit Webmonkey (www.webmonkey.com), www.javascriptsource.com or
www.javascript.com The second two sites listed here offer libraries of sample code
which you can use.
Java – Contrary to popular belief, Java and Javascript are not the same. Java is a
language which allows you to have a window on your page which will have a program
(applet) inside it. These applets are used for mini online-games, fancy special-effects
and so on. However, they do take time to load, and cannot be seen by everyone.
Some multimedia packages (such as Dazzler for example) will allow you to export as
a Java applet, or you can buy a specific tool (or write java code by hand). Java is
supported by most modern browsers.
Flash/Shockwave – These two technologies are used by many sites to add special effects,
animations and so on. The user is required to download a plugin (browser add-on) to
view them. They can be incorporated seamlessly into your site, allowing for fancy
effects and so on. You will need a specific program such as Director to create these.
As with Java, bear in mind that they take time to load and cannot be seen by everyone.
23
Download CGI scripts from http://www.cgi-resources.com (this site also includes CGI
tutorials). CGI scripts are supported by most modern browsers.
FrontPage extensions – The website-creation package Microsoft Frontpage has some
special features such as forums and search tools which can be incorporated into your
website. However, these require your webspace-provider to allow the use of FrontPage
Extensions and I would recommend using CGI scripts (above) instead.
TIP: Don’t include fancy coding tricks just for the sake of it. Everything you include should be there
for a reason
To find out which browsers support which technologies, take a look at the browser
table at http://hotwired.lycos.com/webmonkey/reference/browser_chart
Publicise your Updates
Once you’ve spent time updating your site it is important to let your visitors know of the
changes. On your first page (or a separate page if you wish) you may want to have a
“What’s New” section where you can list the latest updates (perhaps including the date
of alteration). This will show your customers that your site is updated regularly. You
may also want to write (NEW) or similar after links to new sections. (Note that in the
example above I wrote (NEW) in smaller font size so that it is not too dominating.)
Domain-Names and Hosting
24
If you would like a domain-name (such as www.yourbusiness.co.uk) for your site then
I will set one up for your when creating your site. However, if at a later date your
decide to get a domain-name then give this section a read.
address-bar thus making your site appear more professional. This means that you need
not get new webspace. If you want to get a redirection service then I recommend this
kind as your user may not notice that you are hosted on a free site as your domain-name
will still be visible in their browser window. Easyspace gives you an example of this
if you’re still confused about the difference between these two methods.
There are a number of domain name endings (such as .com and .co.uk) available and
these are known as top level domains [tlds]. There are various advantages for each but
if you are running a UK business I would recommend .co.uk as this is specifically for
UK sites. .co.uk tlds are also cheaper than .coms. You can register any number of
domain names, and so you could have yourbusiness.com and yourbusiness.co.uk –
though there is of course an additional cost involved.
The third option is to get domain-name webspace which will allow you to point your
domain at it properly (no redirection required). This will cost more but will also allow
extra options such as more space, probably the option to use CGI Scripts (see above) and
so on. If you have enough money then I would recommend this option.
TIP: Why is it worth registering a domain? There are several reasons why you might want to register
one. It first of all looks more professional than an “ordinary” address such as http://
sites.com/users/you/ and, secondly, is easier to remember. Since a domain is seen as more
professional users are more likely to trust your company and think highly of you if you have one.
The domain name registration sites above also offer webspace, as do other sites. Visit
http://www.hostspot.com or http://www.hostindex.com for links to a large number of
webspace providers.
TIP: Why not register more than one domain? If you’ve got the money you might choose to register
more than one domain so that you can use a different domain depending on where you’re advertising.
For example, if you ran a pet shop you might register www.lotsofpets.com as your normal address but
also register www.lotsoffish.com which you could use when advertising in fish-keeping magazines
or whatever. More domains will also increase the chances of a user typing in your domain when they
want to find what you offer. For example, if I was looking for information on learning French I might
try www.learnfrench.co.uk. If a language-tuition company had registered this domain then it could
forward me on to that company’s site resulting in more visitors for that site.
Uploading your Website – putting your files on the web.
A number of sites will register a domain-name for you. A couple worth noting are
www.a-q.co.uk and www.easyspace.co.uk. Usually, you pay for two years registration
up-front and then an annual charge. However, www.register.com offers variable-length
pricing-plans and discounts. If you also wish to have [email protected]
you may need to pay extra.
If you do have [email protected] then different hosts will offer you
different options. With some you will get any e-mail sent to any address ending in
@yoursite.co.uk forwarded to you. Some will offer e-mail boxes which you will access
to read your e-mail (in the same way that you access your current e-mail account).
All sites online need to be put into some accessible webspace so that people can visit
them. If you are upgrading from your current site-address to a domain-name then there
are a number of options available regarding webspace:
Redirection: A redirection service costs about £7.00 pa from Easyspace and means that
if someone types in your domain-name then they will be forwarded to your current siteaddress (the address of which will appear in their address bar). This means that you can
keep your current webspace.
Once your website is created and you have found some web-space to put it in you will
need to send the files there. The main way of doing this is to use a File Transfer
Protocol [FTP] Program. These programs generally have a Windows Explorer-like
interface, allowing you to drag-and-drop files from your computer into your webspace.
I recommend FTP Commander (www.internet-soft.com/ftpcomm.htm) as it is easy to use
and free. CuteFTP (www.cuteftp.com/cuteftp) is another possible program. A free
thirty-day trial is available, after which time you have to pay and register your copy.
Another program to consider is WS_FTP (www.ipswitch.com). The Limited Edition
version of this (WS_FTP LE) is free to use for personal use only (full details are
available on the site). Alternatively, you could purchase the Pro version (which includes
more features). Other FTP programs can be found at www.download.com,
www.shareware.com or www.tucows.com
Your webhost will probably suggest an FTP program which they recommend using for
uploading your files. Take a look at their FAQs (Frequently Asked Questions) or
Resources Area and see what you can find. On AOL, you can visit Keyword FTP and
select ‘Go direct to your FTP space’ to upload to your members.aol.com directory.
Alternatively, you can use AOL’s FTP program to upload files to another webhosting
account.
Cloaked Redirection: A number of hosts offer this service. (Easyspace charges about
£12.00 pa). This means that if someone types in your domain-name then they will be
forwarded to your current site-address but the domain-name address will remain in their
25
26
If I have already created a
website for you then I will
probably have already downloaded an FTP program onto
your computer which you can
use. E-mail me on sam@
samsolutions.com if you can’t
remember whether I did or
how to use it and I’ll help you
out.
Search-Engines
If I’ve created a site for you I will already have submitted it to search-engines.
However, this section is here for your interest and also if you decide to resubmit your
site.
TIP: Whilst it is worth resubmitting your site to search engines I recommend only resubmitting about
once every five months as it takes some time to be added and if you resubmit too often then the search
engine may ban your site from its listings.
TIP: For information on search engines visit www.searchenginewatch.com
Visit www.ftpplanet.com for
information on FTP programs
and other useful information
and resources regarding file
a screenshot from WS_FTP LE
transfer. It’s worth noting that
this site is run by the makers of WS_FTP and so is a little biased towards that program.
Some webhosts offer other methods of getting your files into their space. These include
sending files by e-mail, uploading through your browser, or uploading using Microsoft
FrontPage’s extensions. The webhost directory freewebspace.net has information on all
methods which your host may offer, including all those outlined above, at
www.freewebspace.net/help/upload.shtml. However, I recommend using FTP.
Website Promotion
Paid-for adverts
Banner adverts and so on are possibly the best known method of advertising on the
Internet. However, they are losing effectiveness as many users now ignore them. If you
do decided to opt for paid banner adverts, make sure that they are going to be put on
relevant sites. However, I would recommend alternative methods of promotion. I would
also advise against pop-up or pop-under adverts (either using them for promotion or
including them on your site) as most users hate these.
Banner exchanges and Link exchanges
Link and Banner exchanges are where you display someone else’s banner or link on your
site and in return your banner or link is displayed on other sites. This is all done automatically, and the more visitors who see the banner or link on your site, the more times
your banner or link will be displayed on someone else’s site. However, I do not
recommend joining such schemes as they can make your site appear unprofessional and
are unlikely to drive visitors to your site. A better method is link-swapping (see below).
There are two main types of search-engine; those which get their listings from humans
and those which get their listings from ‘crawlers’ (robots). Human-based search engines
use real people to categorise (and sometimes rate) sites whereas Crawler search engines
use automatic robots to search through a large number of sites looking for keywords.
There are many services (often free) online which will submit your site address to
multiple search engines. Try www.thewebmasters.bc.ca or www.usubmit.com
However, I recommend that you submit your site by hand. You may want to consider
the following search engines:
AltaVista - www.altavista.com
Google - www.google.co.uk
Hotbot - www.hotbot.com
Lycos - www.lycos.co.uk
Excite - www.excite.com
FAST - www.alltheweb.com
Teoma - www.directhit.com
Northern Light - www.northernlight.com
GO / Infoseek - www.infoseek.com
Look for a button or hyperlink saying ‘Add URL’ (or similar). You will undoubtedly
notice that I have not included Yahoo! in the list above. This is because you should
always submit your site manually to Yahoo as submission services will either not submit
your site to Yahoo, or your site
will not be listed. The team (of
people) at Yahoo are quite picky
about which sites they include,
and as a result it is often hard to
get listed there. For tips on how
to be included in Yahoo visit
ht t p://www. wi l sonwe b. c om/
wmt4/990301yahoo.htm.
The
submission process for Yahoo is
also quite long and drawn-out,
and requires quite a lot of
information. This is why suba screenshot from the Search Engine Northern Light.
27
28
C
C
mission programs do not send pages to Yahoo. Yahoo is at www.yahoo.co.uk
I also recommend that you submit your site address to http://dmoz.org as this is a
directory from which many of the search-engines build their lists. For links to subjectspecific search-engines (which can be useful for bringing in targeted traffic) visit
www.searchengineguide.com.
TIP: I do not recommend pay-per-use submission programs. These often say that they will ‘submit
your site to 3000 search engines for only $50'. However, almost identical services are available for
free, and you can achieve better results by submitting your site manually.
TIP: Submitting just your main page to the search engines above should be sufficient as their robots
will follow every link from that page and add the pages they find to their list.
More advanced tip: If you have a page in your site which you do not want to be added to the search
engines’ listings, (such as a thank you page which users see when they fill in a form on your site) add
the following line of code to the head section of your page: <META name=“robots”
content=“noindex”>
http://www.liszt.com
http://ezine-universe.com
However, there is an even better way of promotion using e-zines and it’s free! This
method involves writing articles for an e-zine which covers your area of business. Ezine publishers are always looking for people volunteering to write articles and will
allow you a short (three or four line) biography at the end of your article which can be
used to promote your site. The added bonus with this method is that if you write a
useful, interesting article for the e-zine the readers will think of you as someone who
knows their subject and will be more likely to visit your website and to trust what you
have to say.
Signature files
It is almost impossible to guarantee a good search-engine position and many experts
spend much of their working time trying to figure out the best way of getting a high
listing. The points above will all help but I can’t guarantee anything. For more
i n for m a tion
on
sea r ch - en g i n e
t a ct i cs
t r y
http://searchenginewatch.com/webmasters/index.html
Information on how to use search-engines to find things yourself can be found in the
‘Internet Troubleshooting’ section of this booklet.
Free-For-All Links Pages
Free For All links pages (known in the trade as ‘ffa pages’ or ‘ffa links pages’) seem at
first like a great idea. These sites allow anyone to add their site address (and possibly
a brief description) to a big list of sites for free. However, general links pages are not
very good at bringing in visitors and are certainly not worth the effort.
Signature files (or ‘sig files’) are a great way to promote your site. A signature file is
a small piece of text which appears at the bottom of every e-mail you send. Yours for
example, may look something like this (the information included is fictional):
--------Gareth’s Golf Galleria
Everything or the discerning golfer:
clubs, caddies, course guides, reviews, chat forums & more!
10% discount if you mention this advert when you buy.
www.golf-galleria.co.uk
--------TIP: Make sure you get your message across simply and quickly.
Most e-mail programs will let you create a signature file which will automatically be
attached to your outgoing e-mails. If not, you will need to manually write (or paste) it
in each time you send e-mail.
Directories
TIP: If possible, try to keep each line of your signature file to sixty characters or fewer. Otherwise,
some e-mail programs may break up the text, making it hard to read.
There are a wide range of directories on the ‘net covering most subjects. A placement
in a relevant directory can be useful in bringing visitors to your site. For information on
directory-style search-engines (such as Yahoo) see above.
TIP: You can also use your signature file when you post to newsgroups, online forums and so on.
E-zines
Advertising in e-mail magazines (E-zines) has two main benefits. The first benefit is
that each e-zine is targeted at a certain group of people. This means that you are able
to promote your site to people who best fit into your target-audience profile. The second
benefit is that e-zine ads are relatively cheap. E-zine ads normally consist of about six
or seven lines of text.
There are a number of sites which list e-zines. Why not try one of the following:
29
You may wish to find some newsgroups and forums which relate to your area of business
and post replies (and questions of your own if you wish) in them. This has the
advantage of getting your signature-file in front of as many eyeballs as possible and also
means that if you write a useful reply to a query in the forum / newsgroup the readers
will think of you as someone who knows their subject and will be more likely to visit
your website and to trust what you have to say.
Link-swapping and partnerships
This method of promotion is quite an ‘in thing’ on the Internet at the moment. If your
site has a resources page or a links (or similar) the most basic way to do this is to contact
30
the owners of those sites whom you have linked to from your resources / links page and
let them know that you find their site useful and have linked to it from your site (include
your site’s address and mention the page where their link is). Suggest that they may
want to link back to your site but don’t make it seem like you’re forcing them to. I
would recommend doing this only for sites which have enough relevance to yours that
a link to you would be a useful addition.
There are other methods of developing partnerships on the Internet but which methods
(if any) you use is up to you. You could, for example, contact site which offer services
which complement yours and offer to exchange links or similar. One example of a
complementary site would be one which offered recipe books if your site sold
ingredients. Another method is to swap signature-files so that your e-mails carry an
advert for someone else’s site (make it a relevant one) and their e-mails carry an advert
for your site. This will get your signature file (and theirs) in front of a whole new set
of eyeballs and so you both benefit. These are just a couple of ideas – I’m sure you can
think of others.
Offline promotion
Don’t forget the real world! Include your web address in all your publications (including
letterheads and so on) and on all your adverts. This is an easy way to get visitors.
I hope you have found this booklet useful. Good luck with
editing your websites and don’t forget that I am happy to
help out for just £7.00 per hour.
Glossary
There are many web-related glossaries. You may care to try these:
C
C
C
http://whatis.techtarget.com (a general computing glossary)
http://hotwired.lycos.com/webmonkey/glossary (more advanced)
http://library.thinkquest.org/11373/gloss.html
31