About You ...
You are a teacher. You are responsible for developing the content of your Learning Area Web site and general Web site management. You
r role is to write each of the Web pages, create all the graphics and generally keep the Web site up to date.Your Computing Background ...
You are confident in using computers. You are able to save and retrieve files from different locations. You are able to rename files. You understand "directories" (or "folders") and know how to create new folders and move files between folders.
You have some experience using:
FrontPage
PaintShop Pro (or similar graphics package)
WS_FPT95 LE (or similar FTP software)
<B>
This is a sample.
</B>
HTML can appear very involved, but it is essentially quite simple. The trick is to know just what the 'markers' do. If you are a little weak in this area you should spend some time with an HTML tutorial such as: http://www.pagetutor.com/pagetutor/makapage
I'm sure somebody has told you that you don't need to know anything about HTML in order to
manage Web pages. They told you wrong! You don't need to use HTML when creating Web pages, but sooner or later you will need to make small modifications that require you to 'get your hands dirty' on some raw HTML. If you have never looked at HTML, stop reading this document, go off and spend some time with the tutorial at the URL above. Come back when you are confident you understand the basics.It is important to remember that Web pages are 'text' files. All they contain is the standard keyboard characters. The best software to write HTML files is 'simple' text-based software such as MS NotePad and MS WordPad. If you use more advanced
wordprocessors such as MS Word there is a chance it will automatically insert 'non-text' characters that will cause errors.Using FrontPage98 (for help with FrontPage2000 see: ../frontpage/start.htm)
There are lots of WYSIWYG Web page creators. If you are using Netscape Communicator you could use the built-in authoring module. What they all have in common is the 'look and feel' of a standard word processor such as Word. If you want text to be bold, you just select it and click on the bold button. If you want a table, you just go to the Table/Insert menu and it's done. (Creating a table using HTML code is possible, but not for us mere mortals.)
Consider the Sample file below ...
The following section lists the HTML code for this page.
While we're at this screen, notice the 'Tabs' at the bottom-left of the FrontPage window. Clicking on the tabs moves between the different 'views'.
The following shows the HTML listing for the page above. You should be confident in relating the HTML listing with the browser (or "Preview") view.
Having gone through the HTML 'tutorial' at: http://www.pagetutor.com/pagetutor/makapage you should be able to interpret this listing.
The starting page is "page1.htm". It loads a graphic file called "page1a.gif". The link on the page (ie the word "here") takes the user to the file "page2.htm".
Tips - Naming Files This page is called "page1.htm" The graphic is called "page1a.gif " If you get into the habit of linking the filename of the graphic with the Web page that uses it, you will simplify the task of keeping track of your files. Web pages can have a filename extension of ".html", or ".htm" The second option saves you entering one letter. My suggestion is to name all of your files .htm, NOT .html |
Tips - Filename Rules Use lower case only. |
PaintShop Pro and Graphics Files
The World Wide Web and Super Highway have other names ...
The "World Wide Wait" and the "Super Goat Track" are two examples.
Many Web pages are painfully slow to download. Usually the problem is large graphics files. There are probably several thousand (or million) sites with the same sort of information you are offering. If your pages are slow, people will just click the Stop button and go somewhere else.
Any graphic larger than a few tens of kilobytes is just too big!!! If possible, keep your graphics less than 10Kb.
Software like PSP can be used to reduce the size of graphics files dramatically. There are two basic approaches ...
1. Reduce the size of the picture.
2. Reduce the number of colours used.
Reducing the Size of a Graphics File
Resizing in
Paint Shop Pro continued ...
Tips FrontPage allows you to "resize" an image on the screen, but all you have done is make it take up less space on the screen. The file is just as big as it was before and will take just as long to download. You must use a graphics package to "resize", not FrontPage. When you save the file it will now be a smaller file that will download considerably faster than before. |
Tips After having 'resized' a file that was previously linked into a Web page you must go back into FrontPage, delete the image and insert it again. If you don't, the resulting image will appear 'stretched' as it attempts to occupy the same area as the bigger version of the file. |
Reducing Colour Depth
 |
 |
| robot2a.gif 256 colours 13Kb |
robot2b.gif 16 colours 5Kb |
The two pictures above appear similar. The one on the right would download at least twice as quickly as the one on the left. You need to be aware of the file size of your graphics and reduce them to a reasonable size. In most cases when reducing them from 'millions of colours' to '256 colours' there will be no visible difference, but the increase in download speed will be dramatic!
As a general rule ... a maximum of
256 colours is adequate for most applications.
Tips - Graphic Formats Most browsers will only accept
".gif" and ".jpg" graphics files. If you have graphics in other formats (like ".wmf") convert them into .gif, or .jpg using PSP's ""Save As..." feature. |
Using File Transfer Protocol Software (WS_FTP95 LE)
WS_FTP95 LE stands for File Transfer Protocol for Windows 95/98 Light Edition. The software is free for non-commercial use.FTP is the means by which you transfer Web files from your hard disk to the hard disk of your Internet Service Provider (ISP)
Having launched WS_FTP you are presented with the standard FTP window. The left hand side of the window represents your hard disk and the right hand side represents your user area on your ISP's system.
Assuming you have an account name such as "sample" and your ISP is Southwest Internet Systems (SWIS), you are now logged into the "sample" directory on SWIS.
Users will be able to access your Web pages by typing in the address of the HTML files in your directory. For example, if your starting page is called "start.htm", users need to type in:
http://www.southwest.com.au/~sample/start.htm
A more user-friendly approach is to use a built-in feature of your ISP's system that will automatically find and load the file called "index.htm" when a user types in:
http://www.southwest.com.au/~sample
There are only a few letters different between the two URLs, but since most people are familiar with the use of the "index.htm" technique you should use the second approach.
All files you want to make accessible via the Internet must be in the directory called "public_html".
What this all boils down to is that for your files to be accessible via the Internet you must have a 'starting' page called "index.htm" and all the other files in the "public_html" directory of your ISP's system. The standard trap is to create wonderful pages on your own hard disk and then forget to upload them to your ISP using FTP software.
Uploading Files using WS_FTPIn the screen shot above the system is still logged into the 'home' directory. The next step would be to log into the public_html directory by double-clicking on it. You would then click on a file on the left to be transferred and then click the right arrow.
Tips - Transferring Files You can transfer several files at a time... To select a 'block' of files (ie one under the other) - click on the first file and hold down the Shift key. Move the mouse cursor to the last file in the block and click on it. Once the block has been selected, click the upload arrow. To select random files - hold down the Control (Ctrl) key while clicking on each file. Clicking on an already selected file will de-select it. |
Managing Your Files
Set up a directory on your hard disk where you will be storing all of your Web files. Transfer all of your files into that directory before incorporating them into a FrontPage document. This directory should be a 'mirror' of your actual Web site.
Tips Using a Default Directory Don't link to graphics files in other parts of your hard disk. FrontPage will let you "Browse" and insert a graphics from anywhere on your system, but DON'T do it! Transfer the graphic to your 'Web' directory first and then link to it. |
Directories
Just as your local hard disk needs to be divided into logical directories ("folders"), so does your Web site. Keep the 'root' directory as clean as possible. Create directories using the MkDir button in WS_FTP and keep your files ordered.
Consider this example ...
The only files in the root directory are index.htm and a welcome graphic. There are two directories, one for work-related information and one for personal information. When changing between directories you need to know a little about 'directory commands' in HTML.
If you were linking from a page in the root directory to one in the work directory it would be in the form: work/myjob.htm
If you are linking from a file in the work directory and want to refer to a file in the root directory the form would be: ../index.htm
Anchor points and 'Relative' Addressing
Assuming we want a link from the home page (index.htm) to a page in the work directory. There are two ways to enter a link to a page:1. Absolute Referencing, where the entire URL is entered into the 'link' field.
<a href="http://www.southwest.com.au/~sample/work/contacts.htm"><Work Links</a>
2. Relative Referencing, where the pathway is 'relative' to the page containing the link
<a href="work/contacts.htm"><Work Links</a>
With "relative" addressing, the system looks for links based on (in 'relation' to) the current location. If you have just a file name, the system assumes the file to be 'linked to' is in the current directory.
Both of these links will take the user to the same point on your Web site and display the file contacts.htm in the browser. The difference between them is that the first form is looking for a 'real' Internet link. If at some time in the future, you want to copy your site to a CD ROM and market it as a 'stand-alone' package, every time the user clicks on a link, the browser will try to find the file on the Internet (rather than the CD ROM). If you use the second form, your Web site can be easily transferred to a CD ROM and used on a system that does not have Internet access.
Tip - Relative Addressing Always use Relative Addressing for your links. |
Some Standard 'Traps' for the Novice (and expert) ...
| "I
changed the graphic, but when I go to my browser it looks the same". Did you remember to save your changes before uploading? Did you actually upload it? There is one other possibility ... some ISP's have quite a delay between uploading a file and making it available for viewing via a browser. At time I have had to wait several hours before I could see my changes. - I suggest you assume this cause after considering the other two. |
| "My
Web site works well on my system at home, but I can't read it properly on other systems.
Files seem to be missing (particularly the graphics)." The classic mistake is to insert graphics into FrontPage by 'browsing' in other directories on your hard disk. The links FrontPage inserts are "absolute" links that refer to your hard disk. When you upload your Web page the absolute links remain. When somebody tries to view your pages on the Internet they get errors (or missing graphics) because they can't see the files on YOUR hard disk. Use the "View Source" feature of your browser to check the link. If there is any reference to "C:/" you will need to change the links. |
