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
© Copyright 2024 Paperzz