Oracle WebServer User's Guide

Contents Index Home Previous Next

Hypertext Linking

Hypertext linking is the key characteristic that makes the Web appealing to users. By adding hypertext links, called anchors in your HTML document, you can create a highly intuitive information flow and guide the user directly to the information he or she needs.

Anchors have a standard format that allows any Web browser to interpret a link and perform the proper function (called a method) for that type of link. Links can refer to other documents, specific locations within the same document, or can perform operations, such as retrieving a file using FTP for display by the browser. URLs can refer to a specific location by an absolute pathname, or can be relative to the current document, which is more convenient when managing a large site.

Note: You can use hypertext links to navigate through a document or to move from document to document. However, HTML does not support returning you to the anchor point of a link within a document. If you use a hypertext link within a document, and then use the Back button, you do not return to the anchor, but to the previous point that you reached through a link.

What is a URL?

HTML uses what are called Uniform Resource Locators (URLs) to represent hypermedia links and links to network services within documents. The first part of the URL before the colon specifies the access method. The part of the URL after the colon is interpreted specifically according to the access method. In general two forward slashes after the colon indicate a machine name.

The general format of a URL is:

method://machine-name/path/foo.html

The following example would fetch the document index.html from the server www.acme.com using the HTTP protocol.

http://www.acme.com/index.html

A Uniform Resource Locator (URL) has the following format:

method://servername:port/pathname#anchor

The components of the URL are as follows:

method is the name of the operation that is performed to interpret this URL. The most common methods are:
fileRead a file from the local disk. The filename is interpreted on the user's machine, so this can be used to display any file that resides on the user's disk.
For example: file:/home/jjones/jjones.html displays the file jjones.html from the directory /home/jjones on the local machine.
httpAccess a page over the network by way of the HTTP protocol. (This is the most common method, usually used to get an HTML document.)
For example: http://www.acme.com/ accesses Acme's home page.
mailtoActivate a mail session to the specified username and host.
For example: mailto:jjones@us.acme.com mails a message to jjones if the browser supports mail creation. Note that the mailto method does not require double forward slashes after the colon.
ftpRetrieve a file using anonymous FTP from a server.
For example, ftp://hostname/directory/filename
servername is optional and indicates the full hostname of a machine connected to the network. For example, www.oracle.com is the fully qualified hostname of Oracle's web server. If a servername is not specified, the URL is a relative link, and it is assumed that the file is on the same server that was used to display the current page. An IP address may be used instead of a hostname, although it is not recommended to build content with embedded IP addresses.
port is the TCP port number that the web server is running on. The default is 80 if :port is not specified. This parameter is not used in most URLs.
pathname is the relative or absolute pathname of the document being accessed by this URL. Web servers can be configured to interpret certain pathnames differently. For instance, CGI applications work by configuring the HTTP server to recognize that files within certain directories should be executed instead of being returned to the browser.
For example: http://www.acme.com/index.html
In this example, an HTTP connection is made to index.html, which is the name of the file to be accessed on the server www.acme.com using port 80 (the default). The file could have a full UNIX-style pathname to indicate a document contained in a lower level directory. If there is no directory component in the pathname, the document must be located in the server's document root directory which is configured by the server administrator. If the pathname part of the URL is missing, many servers provide a directory listing of the document root directory or access a specific 'top level' file (usually index.html).
#anchor The named anchor points to a specific location within an HTML page. In addition to specifying a document name, specifying #anchor will cause most browsers to move the top of the display to the point referred to by the anchor. These anchor names are inserted into documents with the NAME tag as explained under "Linking to Sections on Pages"later in this chapter.

Structure of an Anchor Link within a Document

So far, we've discussed what a URL looks like. To cause a link to be displayed for the user to access, an anchor link must be embedded in the document text. The HTML syntax which allows this is:

<A HREF="URL">text_to_be_displayed_highlighted</A>

The <A HREF="URL"> tag opens the anchor link and the </A> tag closes it. All the text between those tags is displayed highlighted in some way by a web browser. A common technique is to display it underlined and in blue or some other user-selected contrasting color.

The URL part of the tag refers to the text of the URL reference as defined in the previous section. The URL text does not appear on the user's screen; it is only used when the user activates the link, usually by clicking on it with the mouse.

An example HTML segment:

For interesting products see
<A HREF="http://www.acme.com">Acme's home page.</A>

This line would produce on the user's screen:

For interesting products see Acme's home page.

Graphics within HTML Documents

One of the most compelling features of the Web is the ability to embed references to graphics and other data types within a document using the <IMG...ISMAP> tags. This adds a very lively character to your pages and makes them visually interesting.

There are two ways to use graphics from within an HTML document. The first is by embedding them within the document itself, so the user's screen will display the graphics within the context of the other elements of your document (such as explanatory text). This is the most common technique used by HTML designers and is called an "inline image". The syntax for specifying this is:

<IMG SRC="URL" ALT="text" 
   ALIGN=["top"|"middle"|"bottom"|"texttop"] ISMAP>

The elements in this syntax statement are as follows:

URL is the same syntax as any other URL, as explained above. This is the way the browser accesses the actual image data file, which should be in a format supported by the browser. Currently GIF and JPEG formats are supported by most browsers. Specifying the URL is required.
ALT="text" will cause the string text to be displayed if the browser is incapable of displaying images, or if image display is turned off. This is a way of 'labelling' the image the user would be seeing if image display was turned on. ALT is an optional keyword; if it is missing, no text will be displayed if images are turned off on the browser. Most browsers put some sort of icon on the screen to indicate an image would normally be there. Using the ALT tag is recommended so that your page is compatible with text-only browsers such as Lynx.
ALIGN is used with one of the keywords to tell the browser where to place the next block of text. This allows a certain amount of creativity in the layout of your page. If this is not specified, most browsers put the image on the left side of the screen and fill in following text to the right of it.
ISMAP tells the server that this image is a bitmap and allows the user to click on a location on the image to cause a URL to be accessed directly. Image maps are an advanced HTML feature and require server side configuration to function.
For example, the following line will cause the file logo.gif to be fetched from server www.oracle.com and the text Oracle Logo to be displayed if the user has graphic display turned off.

<IMG SRC="http://www.oracle.com/logo.gif" ALT="Oracle Logo">

Linking to Sections on Pages

You can link to a different area or section of your document by using a hidden reference marker to that specific section. This provides a quick way to move through sections of the document without having to scroll up or down. Once you click on that link, the hidden reference places you in the section, and the Browser presents the hidden marker line as the first line on the screen.

To create a link, follow these steps:

	<A NAME="named_anchor"> Text_to_link_to</A>

	<H2><A NAME="intro">Introduction to Hockey</A></H2>

	<A HREF="#named_anchor">Text</A>

	<A HREF="#intro">Gordie Howe</A>

The "#" symbol instructs your web browser to look through the HTML document for a named anchor called "intro".

When the user clicks on "Gordie Howe," the browser displays the heading "Introduction to Hockey" at the top of the screen.

Note: As specified earlier in the URL syntax, a link to a section can appear in the same document or in another document. The example here describes a link to a specific section of the same document.


Contents Index Home Previous Next