For The People - Bringing our World Together - One Voice At A Time

In lesson 3 you learned how to format your documents using tables, how to divide the display into frames and you learned a little about the use of cascading style sheets. In this the final lesson we will cover the following:

  • Adding multi-media to your documents.
  • Publishing your site using FTP.
  • Listing your site with search engines.
  • Adding a guestbook to your site.

    Adding Multi-Media To Your Documents

    In the early days of the modern browser, handling multi-media content could be a tricky business for a web master. The early browsers often relied on small programs known as plug-ins to play multi-media files. A web master could never be sure that a viewer would have the required plug-in installed. Also early multi-media formats such as .wav files were large and took a long time to download. With the development of general purpose players such as Real Player from Real Networks and Windows Media Player from Microsoft many of the multi-media files can be played seemlessly without the need to download a host of plug-ins. Advances in compression techniques have allowed the newer multi-media files such as MP3 files to download more quickly than ever before.

    When you include a multi-media file as part of your web page you are said to be embedding the file into your page. To embed a multi-media file into a page, you can either use the <embed> tag or the more modern and robust <object> tag. Embed a multi-media file into your page using the <embed> tag like this:

    <html>
    <head>
    <title> Embedding Audio Using Embed </title>
    </head>
    <body>
    <embed src="example.wav" height=60 width=144>
    </body>
    </html>
    

    In the above example, the browser would find and run the appropriate plug-in using the .wav extension in the file name example.wav. The height and width attributes are used so that the plug-in's controls can be shown. Unlike images, sizing of embedded plug-ins is not done automatically. If you don't supply a width and hight in the <embed> or <object> tags when embedding a multi-media file, the player and its controls will be hidden. Here are the standard attributes you can use with the <embed> tag:

    ALIGN=value LEFT--align text flush left RIGHT--align text flush right TOP--align text with top BOTTOM--align text with bottom
    BORDER=num Width of frame's border in pixels
    FRAMEBORDER=value NO--do not draw border around frame
    HEIGHT=num Height of frame as defined by UNITS
    HIDDEN Makes the plug-in invisible on the page
    HSPACE=num Width of left and right margin in pixels
    NAME=name Name of the embedded object
    PALETTE=value FOREGROUND--foreground colors BACKGROUND--background colors
    PLUGINSPAGE=URL URL of the Web page that contains instructions for installing the plug-in if the user does not have it installed
    SRC=URL URL that indicates the location of the embedded multimedia data file; if you don't use this attribute, use TYPE
    TYPE=type MIME type of the embedded object, which determines the plug-in that loads; use TYPE for plug-ins that require no data
    UNITS=value PIXELS--use pixels as a unit of measurement, while EN--use half the normal display font point size
    VSPACE=num Width of top and bottom margin in pixels
    WIDTH=num Width of frame as defined by UNITS

    The <embed> tag supports the use of private attributes--that is you can supply attributes unique to the plug-in. For example, suppose you want to embed a Real Audio clip in your page and you want the clip to begin playing automatically you would use an <embed> like this:

    <html>
    <head>
    <title> A Sample Of Embedding A Real Audio Clip </title>
    </head>
    <body>
    <embed src="sample1.rpm" width=300 height=134 autostart=true>
    </body>
    </html>
    

    In the above example we embedded the clip sample1.rpm in our page and told the Real Player plug-in to start playing the clip. Note that the Real Player plug-in comes bundled with Real Player and the plug-in is installed on your machine when you install Real Player. Chapter 23 in your textbook has some excellent information on the use of the Real Player plug-in.

    You can embed a multi-media file using the newer and somewhat more complicated <object> tag. You can play the same real audio clip in the example shown above using the <object> tag like this:

    <html>
    <head>
    <title> A Sample Of Embedding A Real Audio Clip Using The Object Tag</title>
    </head>
    <body>
    <object data="sample1.rpm" width=300 height=134>
    <param name=autostart value=true>
    </object>
    </body>
    </html>
    

    Notice the <param> tag inside the <object> container. When using the <object> tag you include one <param> tag inside the <object> container for every one of the plug-in's private attributes you want to use. In the above example we set the real player plug-in autostart private attribute to true. Following are all the standard attributes associated with the <object> tag and the meaning of each:

    AttributeDescription
    BORDER=numWidth of frame's border in pixels
    CLASSID=URLURL of the plug-in, on the Internet, for installing the plug-in if the user does not have it installed
    DATA=URLURL of the object's data file
    HEIGHT=numHeight of frame as defined by UNITS
    HSPACE=numWidth of left and right margin in pixels
    ID=nameName of the embedded object
    TYPE=typeMIME type of the embedded object, which determines the plug-in that loads; use TYPE for plug-ins that require no data
    TYPE=typeMIME type of the object's data file
    VSPACE=numWidth of top and bottom margin in pixels
    WIDTH=numWidth of frame as defined by UNITS

    Publishing Your Site Using FTP

    Until now we have been talking about ways to create HTML documents and make them attractive. Of course all of that would be pointless if you had no way to publish those documents on the world wide web. For our purposes, publishing a document is the process of uploading it to a web server. Most ISP's provide space on one of their web servers for their account holders to store their HTML documents.

    Many ISP's provide web based wizzards and file managers that allow files to be transfered between a machine signed onto the net and the ISP's web server. While some find these tools useful, I have found that the best and simplest way to transfer documents between a PC and a web server is to simply use an FTP program such as the one that comes with all supported versions of Windows. The achronym FTP stands for file transfer protocol. FTP is supported across operating systems. This means that you can transfer files between your Windows based machine and a computer running all versions of Unix or between your Windows based machine and a Macintosh without having any special knowledge of those operating systems. In fact FTP and the other internet based protocols such as http (Hyper Text Transfer Protocol) or SMTP (Simple Mail Transfer Protocol) were all design specifically to allow computers of different types running different operating systems to seemlessly communicate.

    There are many good FTP programs that run on the Windows operating systems. A few examples are WS_FTP, CuteFTP and FTP Explorer. Modern screen readers can be used to access most of these programs to a greater or lesser extent and which program you choose to use depends mostly on your individual taste. In this course we will be covering the use of the FTP program that comes bundled with your Windows operating system.

    The FTP program that comes bundled with Windows is a command oriented program that comes as a single executable file. When the program is running, its display appears as a close copy of the standard Unix FTP program that comes with any version of Unix. You control the program by entering commands very similar to those you might enter in MS Dos. In this lesson we will discuss a few of the more important of these commands.

    As I said, The FTP program bundled with windows comes as a single executable file. If you are using Windows 95 you will find the FTP program in the Windows 95 option pack. If you are using Windows 98, 2000 or ME the program is installed along with the basic operating system. Normally you will find the directory in your c:\windows or c:\winnt directory structure. This means that you should be able to invoke the program from the run prompt on the start menu without having to supply the whole path. From the run prompt on the start menu enter:

    ftp
    

    The ftp program will start and you will see the ftp> prompt. The following is the output of the ftp program in a session where this course's blackboard was uploaded to the server at www3.telus.net.

    ftp>open www3.telus.net
    Connected to www3.bc.sympatico.ca.
    220-Welcome to the Sympatico Personal Webspace FTP Server
    220-Unauthorized access is strictly prohibited
    220-
    220 www3.bc.sympatico.ca FTP server (Sympatico Personal Webspace FTP Server(1) Mon Feb 15 12:00:37 PST 1999) ready.
    User (www3.bc.sympatico.ca:(none)): xxxxxxxx
    331 Password required for a5a23932.
    Password: xxxxxxxx
    230 User xxxxxxxx logged in.  Access restrictions apply.
    ftp>cd htmlcourse
    250 CWD command successful.
    ftp> lcd c:\htmlcourse
    Local directory now C:\htmlcourse.
    ftp>put blackboard.htm
    200 PORT command successful.
    150 Opening ASCII mode data connection for blackboard.htm.
    226 Transfer complete.
    ftp: 224 bytes sent in 0.00Seconds 224000.00Kbytes/sec.
    ftp> quit
    221-You have transferred 211 bytes in 1 files.
    221-Total traffic for this session was 803 bytes in 1 transfers.
    221-Thank you for using the FTP service on www3.bc.sympatico.ca.
    221 Goodbye.
    

    Here is what happened in the above ftp session:

    1. The FTP program was invoked.
    2. The open command was used to connect to the server at www3.telus.net.
    3. The userid was entered.
    4. The password was entered and the server indicated that the user was logged in successfully.
    5. The cd command was used to change to the directory htmlcourse on the server.
    6. The lcd command was used to cause the local directory (a directory on the user's pc) to change to c:\htmlcourse.
    7. The put command was used to transfer the file blackboard.htm from the user's PC to the server. The server indicated that the transfer was successful.
    8. The quit command was issued to cause the user's PC to disconnect from the server and the ftp program to terminate.

    The following is a list of some of the ftp commands you can use. You can use the help command to get a complete list of the available commands. You can enter the word help followed by the command to get help for a specific command.

    CommandParametersDescription
    ascii no parameters Prepare to transfer an ascii file.
    binary no parameters Prepare to transfer a binary file.
    cd directory name Change to a different directory on the server.
    dele file name Delete a file from the server.
    get file name [local file name] Download a file from the server (local file name optional).
    lcd local directory name Change to a new local directory.
    mdele file name specification including wildcard characters (*) Delete multiple files from the server.
    mget file name specification including wildcard characters (*) Download multiple files from the server.
    mput file name specification including wildcard characters (*) Upload multiple files to the server.
    put file name [local file name] Upload a file to the server.
    quit no parameters Terminate ftp program.

    The ftp program has a number of command line arguments that can be used to control its behaviour. If You go to a command line prompt and enter the following command you will get a list of the command line arguments and their function.

    ftp -?
    

    Here is what you get when you enter the above command:

     Transfers a file to and from a computer using an FTP server service
     (sometimes called a daemon).  Ftp can be used interactively.
     FTP [-v] [-d] [-i] [-n] [-g] [-s:filename] [-a] [-w:windowsize] [host]
      -v             suppresses the display of remote server responses.
      -n             suppresses auto-login on initial connection.
      -i             turns off prompting during multiple file
                     transfers.
      -d             enables debugging.
      -g             disables filename globbing (see GLOB command).
      -s:filename    specifies a text file containing FTP commands; the
                     commands will automatically run after FTP starts.
      -a             use any local interface when binding data connection.
      -A             login as anonymous.
      -w:buffersize  overrides the default buffer transfer size of 4096.
      host           specifies the host name or IP address of the remote
                     host to connect to.
    Notes:
      - mget and mput commands take y/n/q for yes/no/quit.
      - use Control-C to abort commands.
    

    There are a few interesting command line options in the above help message that I would like to draw your attention to. First the -A option (must be in upper case) allows you to log in as an anonymous user without having to enter a userid and password. Of course you would have to supply the host name as well for this feature to work. The -i option (lower case) allows you to do multiple file transfers using the mget and mput command without being prompted to enter a y or n for each file. The -s:filename (lower case s) option is one that can be extremely useful. This option allows you to pass the program a text file of ftp commands which will run after the program starts. When you are creating a document that you want to upload repeatedly you can simply create a file with the necessary ftp commands including lines with your userid and password. This is in fact how I upload the classroom blackboard during a class. The commands to upload the classroom blackboard look like this:

    open www3.telus.net
    userid
    password
    cd htmlcourse
    lcd c:\htmlcourse
    put blackboard.htm
    quit
    

    The first line causes the ftp program to connect to the server www3.telus.net. The second and third lines respond to the server's prompt for the userid and password. The fourth line changes to the htmlcourse directory on the server. The fifth line changes the directory on the PC to c:\htmlcourse. The sixth line causes the file blackboard.htm to be uploaded to the server. The seventh line causes the ftp program to terminate. The command that would be required to start the ftp program and pass the above commands to it would look like this:

    ftp -s:c:\htmlcourse\blackboard.txt
    

    You could put a command like the one above in a batch file (.bat file) and create a Windows shortcut with a hot key to invoke the shortcut.

    Listing Your Site With Search Engines

    Even when your site has been published it probably won't be much use to you unless others know it exists. You can attract visitors to your web site by listing the site with the major search engines. There are hundreds of search engines on the web ranging from general purpose to very specialized. When deciding which search engines to list with here is a short list you might start with.

    All of these search engines have a link that will read something like "suggest a site" or "add an URL" or something similar. At some point in the submission process, you will be prompted for the URL of your site. This URL will normally be the URL of your main page. Some search engines only need the URL of your site, others might want a little more information like a company name if you have one or some other identifying information like a contact email address. In the case of Yahoo, you will have to indicate the categories you want to list the site under. Chapter 40 in your textbook has an excellent write-up on the steps you should follow when listing your site with search engines and the differences between the various search engines.

    Before listing your site with any search engine you should include a brief description of your site and some keywords searchers can use to find you in the document at the url you plan to submit. You put your site description and search key words in special HTML tags called meta tags. Meta tags are placed in the heading section of an HTML document like this:

    <html>
    <head>
    <title>Amateur Astronomy on the World Wide Web</TITLE>
    <meta name="keywords" content="Astronomy, Telescope, Stargazing">
    <meta name="description" CONTENT="Amateur Astronomy resources available on the Web">
    </head>
    <BODY BGCOLOR="WHITE" TEXT="BLACK" LINK="RED" VLINK="GREEN" ALINK="YELLOW" >
    <font size=3 face="verdana, arial, helvetica">
    <br>
    <h1>Amateur Astronomy on the World Wide Web</h1>
    <hr>
    <h2>Magazines</h2>
    <ol>
    <li><a href="http://www.astronomy-mall.com/astronomy-mall/?190,54">
    The Astronomy Mall</a> - A place to find many amateur astronomy companies.
    <li><a href="http://www.skypub.com">Sky On-line</a> - Publishers of
    <i>Sky and Telescope</i> and <i>CCD</i> magazines.
    </ol>
    </body>
    </html>
    

    In the above example there are two meta tags in the heading section. The first contains the keywords you want to allow in a search. The second contains a brief description of the site. When you list your site with a search engine, the search engine will go to your site, find these meta tags and place the keyword and description information in its database.

    Adding A Guestbook To Your Site

    Once your site has been published you will no doubt be anxious to find out who is visiting your site and what they think of your masterpiece. A good way to obtain feedback from your visitors is to include a guestbook. A guestbook is a form where a visitor can leave information like their name, home town, web site URL if they have one and other information. The guestbook form should include a free form portion where the visitor can enter comments. The visitor feedback is stored and you can then view that feedback at a later time. Many guestbooks allow visitors to view each others feedback. It can be interesting for a visitor to see who else has visited the site and it can help build a community of people who access your site regularly.

    The easiest way to include a guestbook on your site is to use a guestbook service. I found that entering the word "guestbook" in Yahoo yielded a large number of guestbook providers. Most of these guest book providers allow you to customize your guestbook by adding or removing fields and they allow you to change the look of the guestbook by including HTML tags in strategic places. Many of these services are free although most free services will want you to display banner adds on your guestbook. Usually for a small fee you can have the banner adds removed. This site uses a free guestbook service at

    Alxnet

    Once you have found a guestbook provider you will normally be given the option of signing up where you will be assigned a userid and a password. Alxnet for example uses your email address as the userid. You then fill out a form or series of forms that defines the look of the guestbook and what information is to be included. For example, you usually can define the background and foreground colours and indicate what background image you want to use. Usually you can customize the content by adding extra fields and giving them labels or dropping fields that you don't want to include. Finally, you will be given the HTML code you will need to link your site to your guestbook.

    When using a guestbook service it is emportant that you read the privacy statement on the provider's site. The privacy statement will tell you how the provider will use the information you and your visitors supply. A reputable provider will not share personal information without your knowledge.

    Conclusions

    In this lesson you learned how to embed multi-media files in an HTML document, You learned how to publish your site using FTP, you learned how to list your site with search engines and how to add a guestbook to your site. This is the final lesson in this course. I hope you have found the course valuable. Please don't forget to leave your comments in the Course Guestbook.

    You can find useful background material related to this lesson by reading chapters 3, 14, 23 and 40 in your textbook.

    For-The-People Back To Course Home Page