The <A> tag

Goal

This tag defines hyperlinks and anchors on web pages. It is one of the most important tags in HTML: without it, it is impossible to "surf" on the web.

An hyperlink is an association between one or several elements (words generally) and a reference. The ideal case of hyperlink is a dictionnary in which all the words of a definitions are connected to their own definitions.

Use

This tag needs attributes to work properly.

With this tag, one can create 2 different things: create a link to a resource (web page, anchor or any other object accessible by HTTP, FTP...), or create an anchor. An achor is a named place in a web page accessible through an hyperlink. For instance, if you click here, you will reach an anchor called "use" placed close to the title "Use".

• <A href="object"> create a link (or pointer) to "object"
• <A name="anchor"> create an anchor called "anchor"

Text or objects enclosed between the <A...> and the </A> become the active area for the link (with the href attribute, embraced objects become clickable and the web browser will try to access the pointed resource, and with name, embraced objects are those accessible by the given name). To create an anchor, it is however possible not to enclose objects (that is what one generally does, even if some browsers do not allow "empty" anchors).

Anchors

This is the easiest use for the tag <A...> tag. The only constraint when naming anchors is that the used name must be unique, even if the case is different.

To create a link to an anchor, one must use a <A href="..."> using the name of the anchor preceded by a #:

To create an anchor called "anchor":

<A name="anchor"></A>

To create a link to this anchor:

<A href="#anchor">text or objects for the link</A>

Anchor are initially case sensitive.

It is also possible to create anchor by using the ID attribute of any tag:

<H2 ID="title2">Title 2 bla bla</H2> has the same effect as <A name="title2"><H2>Title 2 bla bla</H2></A>

Links

It is a bit more complicated than anchors, because one can create a link to any kind of resource (another HTML page, an anchor on an HTML page, a binary file...).

To create a link, it is essential to know the correct location of the object (its URL). The link is created by putting the correct URL as the value of the attribute href of the <A> tag. Here are some examples of possible links:

• <A href="html_tags.php3"> points to the page html_tags.php3 of the current directory (relative URL)
• <A href="html_tags.php3#aa"> points to the anchor "aa" of the page html_tags.php3 (relative URL)
• <A href="http://www.yahoo.com"> points to the yahoo.com web site
• <A href="ftp://ftp.mandrake.com/pub/"> points to a directory accessible using the FTP protocol
• <A href="/dhcp-dns/DHCP-DNS-0.52mdn.tar.gz"> points to a compressed archive (binary file) located in the directory /dhcp-dns/ (absolute URL for the current site)

The target attribute

This attribute is often used. It tells the browser in what window it must open the pointed resource (new window, main window, named window...). The 5 possible values for this attribute are:

• _top open the link in the main window of the web browser
• _self open the link in the current window
• _blank open the link in a new unnamed window
• _parent open the link in the parent frame
• name open the link in the window "name"

See frames for further details.

Special attributes

The name and href attributes are enough to build working links. However, HTML4 defines additional attributes:

• accesskey key that gives access to the pointed resource (keyboard shortcut)
• charset the code page of the pointed resource (ISO-8859-1 for instance)
• class puts the tag in a given class (used for style sheets)
• coords specifies the location where the shape area is active
• hreflang the language code of the pointed HTML page (to be used only with href=...)
• id to identify the tag
• onblur script to be executed when the link loses the focus (the mouse in no longer above it)
• onfocus script to be executed when the link gains the focus (the mouse arrives above it)
• rel defines the relation between the current page and the pointed resource. See <LINK>
• rev defines the relation between the current page and the pointed resource. See <LINK>
• shape when one creates a link from an image, this attribute specifies the shape of the active area
• tabindex position of the link in the list of objects accessible through the tab key
• type the type of the pointed resource (text/css for instance)

Reference

The W3C web site: http://www.w3.org/TR/html4/struct/links.php3#edef-A

 printable format