One of the most useful HTML tags, a allows you to create an anchor between or within one or more documents. An anchor is typically some text or an image that marks the boundaries of a hypertext link (a.k.a., hyperlink). Clicking the link will take you from one document/resource to another. While the concept is simple, this is the driving force of the World Wide Web.
See also: area, map, link, hard link, pipe link, soft link
To be of any use, the anchor tag must define either the "href" or "name" HTML attributes -- however, there are no required attributes. If either of these values is not defined at design time, they are usually set through a client side or server side script at runtime. Below are all the valid attributes for the a tag based on the W3C HTML 4.01 specification:
There are several methods for using the a tag, but all of them involve the placement of opening and closing HTML tags around some text, an image, or some other object. Here are some examples:
Standard Text Link - the following will link the words "Blow your mind" to the everything2.com web site
<a href="http://www.everything2.com">Blow your mind</a>
Standard Text Link with Title - the following will link the words "Joe Blow" to the Bazooka gum web site
<a href="http://www.topps.com/Confectionery/Bazooka" title="Blow some bubbles">Joe Blow</a>
Inner-Document Anchor - the following will specify the words "Jump down to here" as the location to go to for an internal link
<a name="inner-document-anchor">Jump down to here</a>
Linking to an Inner-Document Anchor - the following would take you directly to the inner-document anchor specified above using the URL fragment (#)
<a href="#inner-document-anchor">Jump down there</a>
Standard Image Link - the following will create a link from an image instead of linking text (this example links the E2 Jukka logo to the E2 homepage)
<a href="http://www.everything2.com"><img src="http://images.everything2.com/img/e2_others_01.gif" alt="Everything2 logo"></a>
Email Address - the following will link the words "Email nate" and would typically cause your default email client to open and place nate's email address in the "To" field
<a href="mailto:firstname.lastname@example.org">Email nate</a>
Technically, E2 does not support the anchor tag. However, by using hard links and pipe links, you can get similar results. By using these unique features of Everything2, you will create links similar to the "Standard Text Link with Title" under the Usage section above. When creating a pipe link, the hyperlink text will show the words you are linking, and the title attribute will contain the title of the node you are actually linking to. Hard links display the same text as the link and the title. If you want to use real anchor tags, turn on and use your Notelet Nodelet.
Common Browser Implementations*
With the default settings, nearly all visual user agents (web browsers) display hyperlinks as underlined blue text. If it is an image anchor, it will usually display a blue border around the linked image. Obviously these settings can be overridden with additional HTML tags, cascading style sheets, and various scripting languages.
Previous HTML Tag: !doctype
Next HTML Tag: abbr
See Also: HTML tags and HTML attributes
* If you know of any browsers that implement a link differently by default, please contact me so that I can add this information.