wOnKo's further HTML Notes

BACK | go HOME | MORE HTML


INTERMEDIATE SKILLS

Introduction

In this session, we will consider some other elements and issues with regard to WWW page creation. Also we will briefly cover the processes necessary to make your pages available to the world (or locally on your harddrive or on the server of your school network).


The PRE-FORMATTED Tag <PRE>..</PRE>

Often, you want text to appear as you have typed it (with spacing intact). Consider the following paragraph:

          <P>
            Per  Mon      Tues      Wed     Thur       Fri
            1    11IPT    8CS       9RE     12IPT      11IPT
            2    9RE      11IPT     11IPT   8CS       11IPT	
          </P>

It will be displayed thus:

Within an HTML paragraph, all text layout is ignored, so that TABs, ENTERs and extra padding spaces are discarded. This restriction can greatly effect the appearance of the passage. If the above passage was surrounded with PREformatted text tags, then the browser would not change it’s appearance, and the TAB and ENTER characters would remain.

PREformatted text tags are used wherever you need to control the visual spacing of page elements. The following Anchor:

	<A HREF=somewhere.htm><IMG SRCE=button.gif>Go Somewhere</A>

will display with the anchor text (Go Somewhere) flush with the graphic. To space the two apart, you could add some preformatted text (some spaces) like so:

	<A HREF=somewhere.htm><IMG SRCE=button.gif><PRE> </PRE>Go Somewhere</A>

TABLES as Layout tools

A TABLE in HTML is a relatively complex tag structure, but can be easily broken down into it’s constituent parts. A TABLE is comprised of TABLE ROWS each row contains TABLE DATA CELLS.

A simple table could be thus defined:

    <TABLE BORDER=1>
    <TR><TD>Name</TD><TD>Rank</TD><TD>Serial Number</TD></TR>
    <TR><TD>Hawkeye</TD><TD>Captain</TD><TD>112480</TD></TR>
    <TR><TD>Radar</TD><TD>Corporal</TD><TD>781145</TD></TR>
    </TABLE>

and will resemble the following table:

Table Data can be nearly anything - Paragraphs, IMaGes, Anchors and links to other things and indeed other TABLES! So long as you are careful to ensure that your contents for each text cell fall wholly inside the <TD></TD> tags, little can go wrong.

Tables are used to ‘fake’ newspaper columns - it is possible to place half a document inside one <TD></TD> and the other half in another <TD></TD> on the same row - It is NOT possible to get the text to flow automatically between ‘columns’ as there are no real columns, just the appearance of them.


More on Anchors - Jumping here, jumping there, jumping, jumping, everywhere

So far, we cave considered anchors as the means by which we jump from web page to page. They are in fact much more flexible than that.

Using a NAME ANCHOR, it is possible to mark bookmarks within a page. These bookmarks (or names) can then be used as the targets of an Anchor, thus providing you with a means to leap-frog through your document. To place a name (or Target) in a document, you use a tag similar to the following:

	<A NAME="place name">target text</A>

An example of this may be:

	<A NAME="chapter1">Chapter 1: The Perils Of Pauline</A>

Now, to jump from somewhere to your target, you use an anchor similar to the following:

	<A HREF="#place name">anchor text</A>

an example of which could be:

	<A HREF="#chapter1">Read Chapter One - The Perils Of Pauline&L&A>

If you write very long pages, it is probably polite to your reader to provide some convenient jumps so they can avoid the bits they are not interested in.

A particularly useful variation of this technique allows you to jump to a named section of another page, using a tag of the form:

	<A HREF="url#place name">anchor text</A>

an example of which could be:

	<A HREF="bookpt1.htm#chapter1">Read the First Chapter Of Volume 1</A>

The MAILTO Anchor

It is considered good form to include an automatic e-mail link with each page (or strategically located within a web). This will allow your audience to communicate with you (the writer), or whovever the link is directed towards. Most browsers support the following style of anchor:


    <A HREF=“mailto:person@place”<Mail Me>/A>

an example of which might be:

    <A HREF=“mailto:p.whitehouse@uq.net.au”>E_MAIL Peter Whitehouse anytime</A>

ANCHORS - A Last Word

Anchors provide a form of emphasis in a document. If they are placed within a paragraph’s text, they distract the user - eyes are drawn to the links (sometimes causing them to miss what you have so carefully typed).

Consider, where appropriate, separating links into lists (or menus) - this may conflict with your creative juices when laying down ideas in paragraphs, but is will be a whole lot easire to read. REMEMBER, you are writing HTML so it can be read (talk about stating the bleedin’ obvious).


Marking-Up Existing Documents

Complex documents that are already published using a word processor or desktop publishing package are often a lot of work to translate exactly into HTML.

There are a number of CONVERTERS around, that take your document and mark-it-up for you. Generally, however, you will need to modify signifigantly the resultant HTML script. There will be a number of elements that will be lost in such a conversion:

to name just a few. Many of the above elements are simply not available when using HTML, some can be faked, and others must be achieved using other methods.

The biggest annoyance in the conversion process is the loss of graphical elements. As you are aware, graphics need to be in one of two acceptable graphic formats (GIF or JPG) and be stored as separate files, referenced using the IMG tag.

Forethought could save us masses of time in this regard. If we acknowledge that our documents could be ideal candidates for publishing on the WWW, then we could do ourselves a favour and begin to think about storing the graphical elements of our documents as separate files. This would make the markup process much less painful, and retain the quality of illustration that we sacrifice by ‘screen grabbing’ to extract embedded images later.

Most wordprocessors allow documents to be saved as TEXT, Windows wordprocessors support cut and paste of text to an HTML editor, which can be a relatively fast method of mark-up providing you have a good idea how you want the document to look. Paragraph and list tags can be pre-placed, with whole sections of text dropped into the templates.

I would suggest cut and paste, as opposed to copy and paste - that way you can easily see what is left to be marked-up, decrease the risk of duplication of text and allow you to add format tags as you go (visually matching the original format).

A final note: Although HTML enables you to publish on the Internet (to the global village), in many ways it is a step backwards in the publishing process (akin to Wordstar Version 1, or Zardax). I suspect that in the forseeable future, another medium will emerge that is supportive all of the publishing features we have come to take for granted (even if it has to code them for us underneath).


Publishing Your Pages Locally

In Windows/Mac, it is possible to associate file types with applications (this is available in the File menu of file manager) .

If you create an association between .HTM files and Netscape, then you can add HTHL files to groups on your windows desktop, and they will appear as Netscape Icons.

So long as Trumpet Winsock is in your DOS path, launching an HTML file will auto launch Trumpet and Netscape to support it’s browsing. I have had great success with this strategy using SLIP settings in Winsock (no success with Winsock being set to PPP).

Should you have a network, it is feasible to centrally locate your HTML archives on the server, and share access to them accross the network - thus providing pervasive hypertext. Whole Cyber-Texts could be available to students without connection to the Internet (but with the look and feel of same)


Publishing Your Pages Globally on a Web Server

For other people to view your pages on the world wide web, you will need to store them on a web server. A web server is a program that resides on a computer connected to the Net, that is designed to provide browsers with information using a particular protocol (HTTP).

Since most web servers are computers running UNIX, a little UNIX command syntax is unavoidable in the descriptions that follow.

Making Web Pages on www.uq.oz.au (Dingo)

You will need to make terminal contact with dingo (with a progam like WinQTVNET). Once you have logged in to Dingo, you must make a directory to store your web pages.


    mkdir $HOME/public_html

then grant permission for everyone to find your public_html sub-directory


    chmod a+x $HOME
    chmod a+x $HOME/public_html

Now, FTP your files into this directory (using a program like WS_FTP).

Once you have transferred your files to the webserver, grant everyone permission to read your html files


    chmod a+r $HOME/public_html/*

If you decide to create sub-directories to store sections of html, then you will have to issue file permissions for each of the sub-directories as well. Every time you add files to your public_html area, you will need to re-issue the read permission command (otherwise no one but you will be allowed to read them).

If provides difficulties for you, e-mail either me (p.whitehouse@mailbox.uq.oz.au) or Prentice Computer Centre (webmaster@cc.uq.oz.au).

The URL of your resource (say index.htm in the public_html subdirectory) would be:

http://www.uq.oz.au/~yourlogin/index.htm

eg. http://www.uq.oz.au/~zzgttcc1/terrace.htm
or http://www.uq.oz.au/~zzgttcc1/ipt/ipt.htm

Note the second example uses a sub-directory called ipt, off the public_html directory.

Normally, dingo accounts have a FIXED 4Mb of storage space automatically allocated to them when you buy your account - this space can be used for your HTML collections (as they generally take up little space). Extra hard disk space can be bought ($10 per Mb per year I think - e-mail webmaster@cc.uq.oz.au or Ring the UQ Help Desk 3365 4400 for further information on this)

Further information regarding personal web pages can be viewed at:


Making Pages at GIL

It is possible to publish www pages using the Global Info-Links Internet Service by following the steps below:

As with Dingo above, you will need to gain terminal access to your account. This can be done using a telnet facility, or by logging into the TEXT-BASED MENU SYSTEM available through your account.

Once at the unix prompt, you will need to make a directory called web:


    mkdir web

Then, you have to change file permissions:


    chmod a+x .
    chmod a+x ./web

Then you have to FTP your web pages and all supporting files into your web directory.

Then you have to change the file permissions on all new files you have added:


    cd web
    chmod a+x *

Your pages can then be reached globally using the URL:

where login is your account name, and name.htm is the name of the HTML file you wish to browse

GIL accounts have 500Kb of disk quota allocated to them (which would fill up rather quickly with lots of graphics), and they specify in your contract that NO ADVERTISING is allowed to be stored in these accounts. Should you experience difficulties, the GIL HELPDESK will assist you (although they state they are normally not in a position to offer you technical assistance) and can be reached by e-mail at: helpdesk@iccu6.ipswich.gil.com.au. Further help can be found at http://www.gil.com.au/phome.html.

If you are an advertiser or business, it is possible to “rent” hard disk space (for an undisclosed fee) for the storage of your commercial pages, and GIL offer a web page creation and management service (again for a fee).


 

Other tutorials exist, you might like: http://community.directliquidation.com/decoding-html-the-language-of-computers/.


COPYRIGHT

It is easy to assume that because resources and graphics are so easy to access on the WWW, that they must be copyright free. This is plainly not the case.

It is common practise to use others graphics icons, borrow page design tips and mirror other resources - this is not to say that this is legal, merely that no one has been prosecuted for doing it yet. Suffice to say that your original works automatically have copyright applied to them from the moment of creation, other authors enjoy the same right.

There are many sources of copyright relaxed resources (GIF icon libraries, style guides and page templates), use these or create your own (I now step down from my soap box).


BACK | go HOME | MORE HTML


pwhitehouse@optushome.com.au
(c)w2k
go home