Build a Web site page

On this page I set out the basics needed to build a Web page, links for more details and for a source from which to download a basic Web-page editor (FPXpress) and upload (FTP) software, and suggestions on how to launch it.

Go Home .

Page contents

Articles

. . . What is a Web site?

. . . Where can I get a Web-page editor?

. . . Basic course in building a Web site. (Includes added note re More links.) (Added 26 Dec 00.)

. . . Choosing a host for your Web site. Destination page is damaged. Trying to fix it. Sorry! 7 Feb 01 12:20 pm. To see the page, detour via address (b), Sympatico, near the top of the Home page. Or, a work-around for now, try the following to get to a copy (of file Host) of the same (as file Host2):

Choice of a host for your Web site.

. . . How to launch your site onto the Web.

Links

Articles.

What is a Web site?

With the aid of a tutorial on the Web, linked to below, you will find it remarkably easy to build your own Web site. You will have a basic site operating (locally on your PC at first -- not on the Net) within hours, not days, of effort.

A Web site is an organized collection of information, including active linkages within and external to that site, that is available to anyone accessing the Internet. What makes it distinct from other collections of information, such as an e-mail message or a Newsgroup message, is that the Web pages presented by the Web site present the surfer with more than just a collection of information. Very importantly, it presents him with the capability of navigating through that information and to information external to those Web pages. This ability to navigate is supplied through the use of hyperlinks. A Web site differs also in that it can be accessed by a far wider audience -- one that, importantly, has never heard of you.

I will illustrate this subject through direct reference to my Web site. For simplicity, consider that my Web site consists of only the following two pages:

(a) The page entitled Wayne's home page, by which you entered this site; call it the Home page.

(b) This page, entitled Build a Web site page, which you are now viewing; call it the Build page.

It would be easy to copy these two pages into an e-mail message and send it out to someone on the Web. The hyperlinks that provide navigation within and between those two pages would not work, so you would have to plod through the information in a linear fashion, as presented. However, the hyperlinks to exteranal sources, such as other Web sites, would still work. Then why bother so much about having such a site?

There are advantage in having a Web site. It is a way in which you can offer your ideas (and, of course for some, things for sale) to a host of people unknown to you. So as to get their attention, you will need to (for some search engines at least) provide a list of key words or phrases by which your site can be found from among the millions of others out there. For me, even if not many find my site, there is another useful advantage. It provides me a way of integrating the various sources of information and links that I now have scattered about within my PC in the form of Word files and directories, e-mails sent and received, and Favorites hyperlinks, into one integrated package so that even I can more readily access my own information and add to it in an organized fashion.

We have to get more specific as to what our two-page wonder of a Web site is, but without yet knowing how to do it. That will come soon. The prime essential of a Web site is that it have a Home page. In addition, it may or may not have additional pages. (One important reference Web site, refdesk.com, has 6,000 pages.) Each such page must be a separate file. It is preferable, if not essential (?), that the files for all pages for a given site reside in the same directory, and that the Home page be in a file named Index. For our purpose, all such file names must be of eight characters or less.

In our case, the two files comprising the Web site are as folllows:

C:\My Documents\WayneSite\Index.htm, and

C:\My Documents\WayneSite\Build.htm.

All we need to do now is throw some text into these pages, give each page a special title, and toss in some linkages, and we have a Web site! This sounds flippant of me, but you will find that it is not very difficult at all, thanks to a wonderfull tutorial that I found on the Web.

Go to Page contents near top.

Where can I get a Web-page editor?

It turned out to be remarkably easy to build my first Web site, thanks to a very useful site that I found at the University of Cape Town (UCT).

I had thought that Front Page Express (FPE) would be a good place to start, given my understanding that it was a very basic We- authoring tool, perhaps a subset of Front Page 97 or FP 2000. It was also supposed to be free. The only trouble was that I could not find it. Several sites indicated that it should be either part of Internet Explorer or on the Windows distribution disk, and therefore listed in the Add/Remove Programs list via the Control Panel or otherwise. I could not find it. Nor could a file search. Nor was it listed in the Help libraries for Windows or Internet Explorer. What to do?

I took the suggestion of a friend and visited the tucows homestead at:

Tucows Content Home http://content.tucows.com/, and at its site-chooser site at http://download.tucows.com/perl/HTML.html?Target=index.html, where I could choose a mirror site for downloads. (It also has a site involving igs.) 

The problem was that, at this site, and at a couple of others independent of this one, for FPE, they all pointed me to Microsoft download sites. Those proved to be useless. Nowhere could I find the mythical FPE package.

So I did some more searching, and hit upon a marvelous site, at UCT, as follows:  

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  

Webmaster Tools

http://www.your-work-from-home-job-resource.com/wt.html   

I have now added a few new tools. One is a place to download FrontPage Express. I have searched the internet ( and it was not easy ) and found a place where you can get FrontPage Express for FREE! (See Below) Also added to this page is information on how to send blind copy emails! Check It Out!

The following sites are excellent resources for refining your webpages, and/or providing excellent marketing ideas, and unique promotions to keep your viewers coming back! I will be adding updates to this page as I find them so make sure you check back!

It has a . .  a simple template for the basic format of a webpage.

. .  and . .    Web Design Tools   . . . and, among these, paydirt!   Front Page Express, alias FPXpress.  You have all heard of FrontPage2000 and the great things it does and all the money it costs, right? Well it took me almost a year but I have found a site that allows you to download FrontPage Express (the mini version of FP2000) for FREE plus it will explain to you how to use it!   

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  

This UCT site also offers another Web authoring tool and easy-to-follow instructions as to how to download, suggested file names, and automatic unzip, etc. So, I downloaded the package FPXpress. It took up 1.73 MB, downloading in 2 m 47 sec., at 10.6 KB/sec. It turns out that FrontPage Express offers many of the features of Microsoft FrontPage 98, in a smaller package.

To download FPXpress and start a tutorial on building your Web page, proceed from the following entry about half-way down the page cited above, or just click on the link below:

Web Design Tools: FrontPage Express: http://www.uct.ac.za/depts/its/webdesign/build/express.htm.

The UCT instructions for creating a Web page and the whole bit are very well written -- some of the very best "how-to" instructions that I have ever encountered! It is well worth a visit to see how well documentation can be written, as opposed to how it is far too often done in the computer industry. It is documented from the point of view that the poor user, such as me, is not an expert in it with five years' experience using it! Most importantly, it does not start out on page 1, as one book did, by asking you to load the disk to install the software -- leaving one to ask "What disk?" and "What software?"! (I feel another gripe coming on!)  

After a couple of hours, I had a very basic Web site (of three pages) prepared that I could build on, including several text lines and WWW hyperlinks, and mailto links for sending e-mail to yours truly.

Go to Page contents near top.

Basic course in building a Web site.

The UCT online course for building a Web site starts at the following site and proceeds from there by a linkage within each page of that site. For completness, I list those pages in order, as follows:

FrontPage Express - what is it, and do I already have it? http://www.uct.ac.za/depts/its/webdesign/build/express.htm.

Downloading and installing your Web page editor: http://www.uct.ac.za/depts/its/webdesign/build/install.htm.

You may choose to download and install the free Web editor AOLPress2.0 from America on-line. Both the 16bit and 32bit versions are available from this Web site's Download section as self-installing files.

Using FrontPage Express: http://www.uct.ac.za/depts/its/webdesign/build/useit.htm.

Building your first page: http://www.uct.ac.za/depts/its/webdesign/build/pageone.htm.

Note that in the third paragraph, the following advice is given:

A couple of key points to remember from your initial planning: Keep your pages looking similar by using a template

A simpler alternative that I would recommend is to build your first page, save it under the file name Index, edit it to produce your second page, and save the second page under its own filename. Don't forget to amend the Page Properties in each case. It can be invoked either as stated in the course via File | Page Properties, or via clicking the right mouse button and clicking (left button) on Page Properties.

Adding text to your page: http://www.uct.ac.za/depts/its/webdesign/build/text.htm.

Adding links to your page: http://www.uct.ac.za/depts/its/webdesign/build/links.htm.

Previewing your page in a Web browser: http://www.uct.ac.za/depts/its/webdesign/build/preview.htm.

Adding images to your page: http://www.uct.ac.za/depts/its/webdesign/build/images.htm.

Adding to your Web site: http://www.uct.ac.za/depts/its/webdesign/build/add.htm.

Adding pages your Web site: http://www.uct.ac.za/depts/its/webdesign/build/addpages.htm.

More links for your Web site: http://www.uct.ac.za/depts/its/webdesign/build/links2.htm. Note that when setting up linkages, you should always have the destination address, either (a) in mind, for typing in later, or preferably (b) in temporary machine memory by way of a Copy of the destination address. The easiest and most reliable way to do this is to activate the destination page or keyword, then use Copy in the case of a URL, or Edit | Bookmark in the case of a local linkage.

When you then wish to establish the hyperlink, you can proceed in two ways, after first highlighting (Selecting) the source text from which the destination address is to be reached.One way is to use Insert | Hyperlink on the top menu bar. You are then presented with a pop-up box having the following tabs: Open Pages, World Wide Web, and New Page. If one of these options is shown as being the active one (occuppying almost the full size of the box) and it is not the one you wish to establish, click on Clear to deactivate whatever default link may be showing in the lower dialog box (either a URL or a Bookmark address). Alternatively, you may just click on the desired tab if no such specific address is showing. That will switch you to the other option. A second way is to right click on the source field and proceed as in the above. As for New Page, I have not used it.

If you are linking to a bookmark destination, ensure first that you select, in the topmost box, the page on which the destination bookmark is situated, then click on the arrow to the right of the lower Bookmark dialog box to see a list of the bookmarks on that page. Then select (click on) the desired bookmark. As a finishing touch, use Format | Font to change the default color (from purple to blue in my case) and other attributes of the source text.

Adding information to your Web site: http://www.uct.ac.za/depts/its/webdesign/build/adding.htm.

Right now though I should congratulate you on your working Web site.

What next?

The next of several courses now proceeds. You can pursue them from the link below. The first one addresses elements of design, including simple guidelines such as: do not show small red text on a red or black background or on a busy background, as too many sites are wont to do!

You need to take a look at some more advanced Web design techniques in

Welcome to the intermediate Designing it! II module: http://www.uct.ac.za/depts/its/webdesign/design2/index.htm.

In Design it! I you learnt all about the big picture of how to create your Web site. You analysed your visitor's needs and planned your Web site accordingly.

Now that you have built your first Web site, you may feel you need to pay more specific attention to the various specific page-design elements.

Go to Page contents near top.

Choosing a host for your Web site.

How to launch your site onto the Web.

As for launching your Web site onto the Web, the procedures will likely vary somewhat from one Internet Service Provider (ISP) to another, and will undoubtedly do so in some specifics. In my case, I found all the information that I need in the Help system of my ISP, the Bell Sympatico High Speed Edition system, including how to (a) name it, (b) reserve the Web space on its server, and (c) upload my pages to the server. In fact, it also presents tutorials on all aspects of using the Internet, as summarized in the Sympatico entry in the section below.  

The following sets out my notes and excerpts from that Help system, as set out while learning how to get my site published, and as a way to consolidate the instructions to that effect. They may be of some help to you, even though the specifics from your ISP will no doubt differ from these. In fact, even if your ISP is Sympatico, these instructions will differ (at least in determinung the URL address) depending upon your location and regional Service provider. In that case you are advised to seek specific instructions through your own Help system.

Your personal Webspace: http://www1.sympatico.ca/help/Webspace/.

Please note that if you have not used your Sympatico Webspace before, you will first have to request that it be created (you can do this on a Web page, but in some cases this requires a phone call to Member Services). . . . As a Sympatico member you get free Web page space. . . .

Where will my personal Webspace be?
The Sympatico service provides space (called a directory) on a special computer (called a server) for members' personal Web pages. Your Webspace remains empty until you put a Web page there.

What will my personal Webspace address (URL) be?
Your Webspace address is determined by your Sympatico service provider and is usually related to the name in your e-mail address (some also use a tilde "~" in the address).

e.g., if your e-mail address were "pat@xx.sympatico.ca", then your Webspace address would be as follows (check with your local Sympatico service provider for exact details). I have ommitted a table giving the Webspace address for each of several Service providers (Bell, MTT, SaskTel, etc.). For me, under Bell, the sample Webspace address in the table is: http://www3.sympatico.ca/pat. Therefore, as my e-mail address is waynerp@sympatico.ca, my Webspace address (URL) would be http://www3.sympatico.ca/waynerp.

Request your personal Webspace!
A small form is provided, with a hyperlink, by which you can "Request your personal Webspace be set up by your Sympatico service provider".

Is there a list of all Sympatico members who are using personal Webspace?

There is no directory of all Sympatico members who are using their personal Webspace, but some Sympatico service providers have a Webspace directory of their members only. See these directories using the pull-down menu below. I have ommitted that menu, to avoid complications and clutter.

What CGI scripts can I use with my personal Webspace?
You can use page hit counters and simple forms with your Personal Webspace. You can also use functions that do not require CGI scripts: client-side image maps and e-mail links. Find out about how to use these features on our Webspace Advanced Functions page (link ommitted by me, to avoid complications).

Your personal Webspace: http://www1.sympatico.ca/help/Webspace/howto.html. MAKE YOUR PAGE  

The Sympatico service provides you with personal Webspace. In this section of Sympatico Help you can find instructions for what you need to make a Web page and how to publish it to the World Wide Web, with Sympatico as your host. The entire process can be broken into three basic steps:

1. Make your personal Web page(s).

Step 1: Making your page: http://www1.sympatico.ca/help/Webspace/write.html.
You can use Netscape Composer to create your Web pages. You can also use Microsoft FrontPage or FrontPage Express. Please note that the Sympatico service does not support FrontPage extensions. This means that you will not be able to use FrontPage's special features, or to upload your page with FrontPage.

When you have made your page, save it as a text-only file with the name index.html; The .html file extension tell a Web browser to display a text file as a Web page; using the prefix index to name your main page tells a Web browser to display that page first, as your home page, when an Internet surfer visits your Web space.

**If you do not have a file in your Webspace with one of the above names, visitors to your Webspace will see an index of files therein in place of your home page. Make sure any references to images and links to other Web pages are correct.

2. Check your pages using your browser.

Step 2: Checking your page: http://www1.sympatico.ca/help/Webspace/check.html.

Once you have saved your Web page on your hard drive in a text file format, start your Web browser and choose Open from the File menu. Select the file you've just saved and make sure you're satisfied with the way it displays within a browser window. Make any corrections to your text file before proceeding to the next step. Make sure any references to images and other Web pages are correct. Remember that most Internet users will be viewing Web pages using Netscape Navigator, Communicator, or Microsoft Internet Explorer with a 640 x 480 screen size and with 256 colours.

IMPORTANT:
Sympatico Webspace requires at least one of your Web pages to be named using lowercase letters in the following format: index.html (for Windows 3 users). If you only have one Web page, name it as indicated here. If you have several Web pages, make sure you name the page you want to appear first to anyone surfing to your Webspace directory index.html, as above.

3. Put (transfer or upload) your pages on the Sympatico Web space server.

STEP 3: Uploading your Web page to the Sympatico Webspace server: http://www1.sympatico.ca/help/Webspace/upload.html.
This step assumes you have already completed STEP 1: Making your Web page and STEP 2: Checking your Web page.

To put your page in your personal Webspace, you must transfer your Web page(s) to your directory on the Sympatico Webspace server. This procedure is called uploading. First, read our general information on uploading files with FTP software (at http://www1.sympatico.ca/help/Software/ftp.html).

Please note that the Sympatico Service does not support Microsoft FrontPage extensions. This means that you will not be able to upload your page with Microsoft FrontPage. (You can, however, use MS FrontPage to make your Web pages, but you'll have to use separate ftp software (at using FTP software: http://www1.sympatico.ca/help/Software/ftp.html) to upload your Web pages.)

I proceeded using the latter approach -- namely, using separate ftp software.

Advanced FTP software

A separate FTP program can let you add directories to and delete files from your personal Webspace. There are many different varieties of FTP software, and they can be downloaded from a shareware site like Tucows. (http://www.tucows.ca/ ) Some common programs are

WS_FTP (http://www1.sympatico.ca/help/Software/wsftp.html) and

Cute FTP (http://www1.sympatico.ca/help/Software/cuteftp.html) for Windows and

Fetch (http://www1.sympatico.ca/help/Software/fetch.html) for Macintosh.

Using advanced FTP software

Note: Sympatico Member Services does not provide support for the use of FTP programs WS-FTP (Windows 95/98 and 3.1) and Fetch (Macintosh).

I downloaded the WS_FTP software from Tucows. After a bit of trouble with choosing the correct password and a so-called Profile Name (I used www3.sympatico.ca) and the Host Name/Address (I used www3.sympatico.ca) I got it working. It works beautifully! Here are some notes and FAQs on using WS_FTP, and what it looks like:

WS_FTP FAQ: http://enteract.com/faq/3xwsftp.html;

Access FP - FrontPage Express Resource Centre: http://www.accessfp.net/fpexpress.htm;

Help Desk FAQ's about WS_FTP: http://www.zeetek.com/support/windows/wsftp.html.

The images used for my site are stored in a subdirectory Images of the WayneSite directory on my PC. Make sure that, in transferring such files to the server, that you have a similar directory structure on the server so that an image file stored in your source Images subdirectory gets transferred into the Images subdirectory on the server (not into the waynerp directory as a whole) ; otherwise, your pages will not be able to track down your images, and the picture boxes will be forlornly empty!

When my Webspace was activated on the Sympatico server, it appeared as a page with the URL http://www3.sympatico.ca/waynerp/ with the heading Index of /waynerp/, under which were entries including Index.htm and those for the other pages, including this one, Build.htm. Anyone arriving at the page via the preceding address ending with /waynerp would then have to click on Index.htm to arrive at my Home page, namely, the Index.htm page. The direct URL address for my Home page is then http://www3.sympatico.ca/waynerp/Index.htm. It is convenient to keep both addresses in a Favorites list, in my case, under the names Wayne's Home index and Wayne's Home page, respectively, because in using the FTP transfer program, one needs to have the former page active, whereas for accessing the Home page itself, the latter is more convenient. It is very important to note that the Web address above is case-sensitive: Index must be Index, not index in my particular case. In general, one could arrange it either way

One added tip. After you have uploaded files to the server using FTP, you will want to check out whether the modified site works all right. It may surprise you to find that the pages appear to be unchanged, because your PC may have a temporary record (cookie) of the fact that you had just accessed the Home page a bit earlier, so it presents you with that same page rather than giving you the newest version of it! To avoid this, after you have uploaded files, click on Tools | Internet Options |Delete Files | OK, to delete such temporary files. (This is in the jargon of using Internet Explorer.) In fact, doing this frequently in general helps keeps your PC litter-free and speedier. For the borderline paranoids, it also helps cover the tracks of what you have been looking at on the Web, in case there are RCMP horsemen or Men in Black hovering outside your door! But even that will not be very reassuring when you realize that deleted data is not really erased; it is just no longer easily accessible by the usual means. A drug dealer at a London airport learned this the hard way a few years ago. He saw policmen approaching him, so he pressed a delete button on his palm-top computer. Unfortunately for him, the police had a good hacker in their back room who ferretted out a charming list of drug deals and contacts that had supposedly been deleted! Sometimes the paperless office isn't the best way to go!

Upload settings

To upload to your personal Webspace, you will need your Sympatico personal account information (User ID, password, etc.). There are specific upload instructions (including FTP settings) for each Sympatico service provider: (interactive link ommitted by me to avoid complications).

Related issues
Deleting, changing or adding Web pages in your personal Webspace: http://www1.sympatico.ca/help/Webspace/change.html .

Changing your Web page:

To change your Web page you simply upload a new text file with the same name as the Web page which is already in your personal Webspace. If you only have one Web page it should have been named index.html. [It is important to note that the file name (index or Index) is case sensitive.] Any text file you upload to your directory with the name will replace an existing one with the same name without warning (you will not be asked if you want to replace the existing file).

Removing or deleting your Web page:

You may wish to remove or delete your Web page temporarily from your Sympatico Webspace to allow you to work offline to make changes to (or correct mistakes in) your Web page. There are a couple of ways to do this:

Adding a Web page to your Web space:

You can have as many Web pages in your Webspace as you like, as long as you do not exceed your storage limit. You could have hundreds of Web pages before exceeding this limit; images take up more storage space than text. Your first Web page must be named as outlined above (unless you want visitors to see an index listing of your Webspace directory); any other Web pages must have distinct names (and must end with the .html or .htm extension). It's up to you how you link your pages together, if at all. You could have several home pages within your personal Webspace, as long as you give them different filenames.

Storage limit: Your personal Webspace: http://www1.sympatico.ca/help/local/bell/wsdetails.bell.html .

Free Personal Web Space!

As a Sympatico member, you have free personal Webspace as part of your Sympatico account. You can make your own Web page or pages and put them in your Webspace; you can also make changes to them anytime.

Technical information:

Advanced Functions: http://www1.sympatico.ca/help/Webspace/functions.html .

Once you've made your own Web page and learned how to publish it to your personal Webspace on the Sympatico service, you may be interested in implementing some advanced functions the Sympatico service gives you with personal Webspace.

These instructions assume you have a suitable comfort level with choosing and using software to make a Web page and that you understand or have experience with Steps 1 through 3 of Putting up your page. If not, please review those steps before trying the advanced functions described here. Print this page so you can have it handy.

The directions given here for applying advanced functions are for your convenience. Sympatico Member Services is not equipped to handle specific member queries about using e-mail links, counters, forms and image maps. The examples provided here work with the Sympatico service; but you are not limited to using these. See Webspace Resources (at http://www1.sympatico.ca/help/Webspace/resources.html ) for alternatives described on other Web sites which can be applied to your Web pages.

Use Web pages that impress you as examples of how to use these advanced functions on your Web page. When you're looking at a Web page which uses e-mail links, counters, forms, or image maps, click on the View menu and choose Source to see how the page was written and where the HTML for the advanced functions is placed.

FUNCTIONS USING CGI SCRIPTS:

The following two advanced functions, page hit counters and forms, make use of CGI (Common Gateway Interface) scripts. You don't need to know how these scripts work to use them. In most cases you only need to copy and paste the relevant HTML code from the instructions here, to the appropriate place in your text-only Web page document. The scripts are stored on and executed from the Sympatico personal Web space server. For security reasons members cannot use their own CGI scripts.

CGI is the standard way of passing information between a Web page and a program on a Web server. When you fill out a Web form, it uses the CGI to send the information to a program on the server.

Page hit counter (see http://www1.sympatico.ca/help/Webspace/functions.html for detail re an interactive link).

Everyone wants to know how many other Internet surfers have seen their Web page. A page hit counter displays the number of hits the page has received.

More about page hit counters

Using page hit counters with your Sympatico service provider: (interactive link ommitted by me).

Forms

Forms can be used for simple tasks like asking surfers visiting your page to give you feedback on your Web page, to surveys, where the information is solicited and submitted to your Sympatico e-mail address.

Select your Sympatico service provider from the pull-down menu below for details about using forms. (Interactive link ommitted by me.)

You can create a simple form that doesn't use any server-side scripts and will work with any Sympatico service provider. Find out how.

OTHER ADVANCED FUNCTIONS

The following functions do not use CGI scripts.

E-mail link

You can easily add a hyperlink on your personal Web page to your Sympatico e-mail address. When Internet surfers click on this link, their browser e-mail opens a new message window with your e-mail address already entered in the Mail To: field.

Images

The Web is known as the multimedia part of the Internet, and pictures of various sorts - still, moving, big, small - certainly add to this label. You can convert your favourite photographs to an electronic format and add them to your personal Webspace. You can also create your own images or copy images from art libraries (available on diskette or CD-ROM, or on the Internet) and include them on your Web pages.

Image Maps

An image map is an image with "mouse-clickable" regions defined by xy coordinates. Using an image map allows you to define (or "map") specific areas of the image to be hyperlinked to another Web page or location (URL) on the Internet when clicked on with a mouse pointer

Go to Page contents near top.

Links:

Sympatico system: Whether you are a user of Sympatico or not, you can gain valuable insight and practical advice by accessing the Sympatico Help system, through the Sympatico Toolbar Help button or through: http://www1.sympatico.ca/help/local/bell/tips.bell.html. Internet Tips & Tutorials. From there, you can progress through a complete range of tutorials on setting up your system and using the Internet, e-mail, and search engines, through to Creating a Web Site, at: http://www1.sympatico.ca/help/Webspace/. From there, proceed through building your Web site and to launching it, as set out above at launch.

For links re FTP file-transfer software to upload your files to the server, see upload above.

Go Home. Go to Page contents near top.

You can e-mail me at waynerp@sympatico.ca