Web Typesetting - Part 4: Publishing & Tables

by Randy Finch

Hello. Thanks for tuning in for the fourth part of this series of articles about publishing on the World Wide Web. Since this series began I have had several people ask that I cover Amiga tools for assisting in Web publishing. It was not my original intent to cover tools; rather, I had intended to just show how to use HTML to create Web pages and leave it up to the reader to decide what tools to use. However, due to these requests, I am now considering an article about the various Web publishing tools for the Amiga, meagher though they are. I will leave this article for the end of the series. For now, let's continue our original trek. In this article, I will discuss how to get those beautiful Web pages online for the world to see. I will also delve into one of my favorite additions to the HTML standard, tables.

Publishing

Getting your Web pages onto your Internet Service Provider's (ISP) server and giving the world access to them is easier than you might think. At least this is true when working with a Unix server. Since I do not have any experience with Web publishing on a Windows NT server or any other, I cannot speak for them. There are basically two steps involved. First, you must set the appropriate access privileges to the directory in which you will store your Web pages. Second, you must copy your HTML files and support files to that directory. The first step only needs to be done once. The second step has to be done whenever you update your Web pages.

Telnet

In order to set the privileges to your Web directory, you will first need to find out the name of the directory designated by your ISP to be used for Web publishing. If one has not been designated, you may have to create one. To accomplish these tasks, you need to use a telnet program. You can find Amiga telnet programs on AmiNet and other Amiga sites. Telnet allows one computer to log into another computer and execute commands. This is strictly a command line mode operation.

Typically, when you call into your ISP's server and successfully log in with your user name and password, you are placed in your own personal subdirectory, usually with the same name as your user name. Within that subdirectory, you may or may not have a subdirectory designated by your ISP to be used for your Web pages. If you are not provided with one, you need to find out from your ISP if the directory you create needs to have a particular name or if you can give it any name and then inform the provider what it is. My ISP said I had to create a subdirectory named "public_html" for my Web pages. To create a directory in Unix, you simply type "mkdir dirname". Look familiar?

Once you have a directory in place for storing your Web pages, you need to set the access privileges to it appropriately. Unix splits users into three categories: user, group, and others. User is you, group is anyone in your same group, and others is anyone else. For each of these categories, access privileges of read, write, and execute can be set. You need to check with your ISP to be certain of how to set the privileges. In my case, I gave myself all three privileges for both my user directory and my public_html directory. The group was given no access privileges to my user directory, but read and execute privileges to my public_html directory. Others were given read privileges to my user directory and read and execute privileges to my public_html directory. The "chmod" command is used for setting privileges. There are several ways to accomplish this task, but I will not discuss them. The simpliest way is to type "chmod 701 ." to set the privileges to the current directory (which should be your user directory). Type "chmod 755 public_html" at the command prompt to set the privileges of the Web pages directory. Once this is done, you can exit the telnet program and get ready to copy your Web files to the server.

FTP

To copy files from your computer to the server, you need an FTP (file transfer protocol) program. FTP programs come in different flavors. Some are command line based so you have to type in commands to accomplish your task. This is not too terribly complicated, but I prefer the second flavor which is GUI based. These programs typically look something like Directory Opus, having two windows. One window shows the directory structure of the local computer, another shows the directory structure of the remote computer, in this case your ISP server. (For an example of a GUI based FTP program for the Amiga, see Rob Hayes' column in the May 1996 issue of AC.)

FTP programs allow you to create and delete files and directories on both the local and remote computer. Files can be transferred in either direction, also. One thing to be aware of is that files can be transferred in either binary or ASCII mode. The former transfers files with no translation. The latter will translate files if necessary. What does this mean? Well, every computer system has a different way of handling a new line within a text file. The PC places a carridge return and a line feed between lines of text. Unix only places a line feed between lines of text. Thus, if you perform an FTP ASCII transfer of a file from a PC to a Unix system, the carridge returns will be stripped. If transferring in the other direction, carridge returns will be added. Since the Amiga only places line feeds between lines of text just as Unix does, this is not of great concern for Amiga users on a Unix server. However, if an Amiga user happens to be on a Windows NT server, it is of concern. Typically, you will want to copy all of your HTML and text files in ASCII mode and all of your graphics, sounds, animations, etc. in binary mode.

Once you have copied your files to your Web page directory, it is time to test them. While still online, load your favorite browser and type in the URL assigned by your ISP for accessing your home page. For instance, my home page's URL is "http://fly.hiwaay.net/~rcfinch/home.html". As it turns out, most ISPs will allow you to drop the name of the HTML file, as in "http://fly.hiwaay.net/~rcfinch" when accessing a home page if it is named home.html and/or index.html.

When testing your pages, check all of the hypertext links, graphics displays, etc. to make sure everything is working correctly. If something is wrong, correct the files on your local computer and then transfer, via FTP, the updated files to the server. Remember to retest.

Tables

Let's move on now to more HTML programming. One of the most popular additions to the HTML 3.0 standard is tables. This feature allows data to be organized on a Web page in a structured row and column format similar to what you see in a spreadsheet. You can designate whether or not the data in the table be separated by borders or not. There are five tag combinations needed for producing tables: <TABLE>...</TABLE>, <CAPTION>...</CAPTION>, <TH>...</TH>, <TR>...</TR>, and <TD>...</TD>. Let's take a look at each.

<TABLE>...</TABLE>

<TABLE> identifies everything following it up to the closing </TABLE> tag to be one table. The BORDER="..." attribute lets you specify whether or not a border should be drawn around the table. In Netscape, the width of the border can be specified with this attribute. There are some additional Netscape only (for now) attributes for setting cell spacing (CELLSPACING="..."), cell padding (CELLPADDING="..."), and the width of the table (WIDTH="..."). All of the tags defined below must appear withing the <TABLE>...</TABLE> tags.

<CAPTION>...</CAPTION>

Text between the <CAPTION>...</CAPTION> tags will appear as a heading outside the table itself. One attribute is available for setting alignment (ALIGN="..."). Possible values for alignment are TOP and BOTTOM.

<TR>...</TR>

These tags define one row of a table. Individual cells within the row can either be header cells or data cells (see below). There are two attributes available with these tags. The ALIGN="..." attribute sets the horizontal alignment of the cell contents in the row. LEFT, CENTER, or RIGHT can be used. The second attribute, VALIGN="...", is a Netscape one for setting the vertical alignment with the cells. Values can be TOP, MIDDLE, BOTTOM, or BASELINE.

<TH>...</TH>

These tags appear between the <TR>...</TR> tags. They surround the text for a table header cell. Typically these will appear on the first row of a table to label what appears in the cells underneath them. Several attributes are available. The ALIGN="..." and VALIGN="..." attributes are just like those described above except they only apply to the individual cell. The ROWSPAN="..." and COLSPAN="..." attributes let you define how many rows and columns a cell will span. NOWRAP specifies that the contents of the cell should not automatically wrap to a new line, the default method. Finally, the WIDTH="..." (Netscape only) lets you specify the exact width of the cell in pixels or as a percentage. If this attribute is not used, then the browser decides what the width should be.

<TD>...</TD>

These tags also appear between the <TR>...</TR> tags. They surround the text for a table data cell which is what most of the cells in a table will be. All of the attributes available for the header cells are also available for the data cells.

Putting It All Together

Tables are very flexible. Data cells can contain hypertext, images, lists, and even another table. For instance, Listing 1 shows an excerpt from one of my Web pages that embeds hypertext and images in the data cells. Figure 1 shows what it might look like in a browser. I use tables extensively in my Web pages because I believe it to be the most effective way to present certain types of information. Support for tables has been lacking in Amiga browsers; however, IBrowse now supports this feature.

Dual Code - Tables and Lists

One problem I faced when I first started creating my Web pages was deciding whether or not to use tables. I wanted to present information in table form to people who had browsers supporting this feature, but I did not want to exclude people using browsers that did not support tables. I finally decided to create two pages for each page of information: one using lists, the other using tables. The visitor could decide which one to use. Fortunately, I recently discovered a way to include code for tables and lists in the same HTML file. When a person views this file with a browser supporting tables, she sees a table. On the other hand, if a person views this file with a browser that does not support tables, she will see a list instead. This works because browsers typically ignore any tags they do not understand. Let's take a look at an example.

Listing 2 shows the complete code for one of my Web pages. Notice that it contains the standard tags for creating a table. However, riddled throughout the contents of the table are tags for creating a list. Just after the <TABLE> and <CAPTION> tags is an ordered list tag, <OL>. Then, immediately after the first data cell tag, <TD>, of each row is a list item tag, <LI>. Finally, just before the closing table tag, </TABLE>, is a closing ordered list tag, </OL>. There is a space following the second data cell tag, <TD>, in each row. This is needed when a browser displays the file as a list so the text in this cell will be separated from the text in the first cell. Let's see how this code appears in various browsers.

Figure 2 shows the file as viewed in AMosaic on an Amiga. Since this browser does not support tables, it ignores all of the table related tags. Look through the code in Listing 2 and imagine what it would look like if all of the table tags were removed. All that would be left is what you see in Listing 3. It looks just like the code that would have been used to create an ordered list. Even the text for the caption shows up as a regular line of text. AMosaic aptly ignores the table tags and presents a nice ordered list as it should.

Figure 3 shows the file as viewed in IBrowse on an Amiga. Since IBrowse supports tables, it reads the table tags. It put a border around the table as requested, but it did not put dividing lines between each cell like other table supporting browsers. Apparently, it ignored the list tags since no number appears in front of the content of the first cell of each row. However, it did cause a slight glitch in that the content of each first cell is shifted down by one line relative to the other cell on the row. Perhaps this little problem will be cleared up in the final release.

Figure 4 shows the file as viewed in Netscape Navigator on a PC running Windows 95. Everything looks perfectly fine, doesn't it? Well, actually it doesn't. Navigator treated the ordered list as an unordered list for some strange reason. Notice the circular bullets at the beginning of each row.

Figure 5 shows the file as viewed in Microsoft Internet Explorer on a PC running Windows 95. It displayed the cell contents correctly, putting a number on the first item of each row. However, it did something strange with the vertical borders and separators. There seems to be a double line. I do not know why this occurred.

Well, as you can see, the dual coded tables and lists seems to work quite well even though each browser has its own unique glitches. However, I believe these slight problems are quite acceptable when you consider that only one page has to be maintained rather than two.

Closing Comments

That's it for this time. Remember, let me know your home page address when you get your pages on line.


Back to list of articles
Back to Randy Finch's Home Page
Last modified on June 29, 1996
Randy Finch at webmaster@rcfinch.com