Creating Links
One of the really big deals about HTML is its ability to link relative information and pages together using hyperlinks. The tag for linking things in a Web page is <a>...</a> The <a> tag defines an anchor or place to be linked within a document. The <a>.....</a> tag is almost never seen without one or more of its accompanying attributes. On a Web page, a link is usually displayed as underlined text and will take a user to a preset location when clicked.
An increasingly common attribute for the <a> tag is title, which adds descriptive text originally meant for use by the assistive software that reads pages to visually impaired people. The value of the title attriube creates "glosses", short strings of text that pop up when a user places his
or her mouse pointer close to a link. The idea is to provide a
preview of what's behind the link. Designers should not rely on the gloss to
compensate for poorly labeled links. Usability studies show that most people don't move the mouse over something until they've already decided that's where they're going to click. They're created by use of the title attribute within the <a> tag, like this:
<a href="http://www.usability.gov/pdfs/chapter7.pdf" title="Usability.gov, 'Research-based Web design and usability guidelines', chapter 7">Usability.gov PDF document about navigation</a>. When the user puts their mouse near the link, in some browsers this text will appear: Usability.gov, 'Research-based Web design and usability guidelines', chapter 7.
The most commonly used attribute for an anchor tag is href, used to specify the URL to be linked to. The text enclosed between the opening <a> and closing </a> tags will be the clickable text.
Linking to a Local file A local file, or relative URL, is relative to another document. A local file appears as the file name and extension, and can also include a directory. If you're visually inclined, keep reading, there are pictures below that show the same relationships. |
Linking to an External File An external file, or absolute URL, is a file existing on a completely different server. The entire name and address for the URL must be used, including the scheme, http:// . |
In long Web pages, it can be useful to link to sections within the Web page. This can be achieved by naming fragments of the document and linking to them. Linking to a section of the document is a two-step process:
- First, name the section of the document where you want the user to land after they click on the hyperlink.
- Now, link to the document section using the named value preceded by the # sign as the destination URL.
| Naming a section | Linking to a named section |
The value "name" refers to whatever name you wish to give the section. The name should be one word and lower case, and should never contain spaces or symbols. The section enclosed in the tag will be the point of text that is to be linked to. It's like putting a room number outside your door. If you're sent to room 319 and there aren't numbers on the doors, you'll not find your way. This tag is invisible in the browser window and is only used to give the hyperlink an "anchor point" so the browser knows where to go when the link is followed. |
<a href="#name">Name of Section</a> The actual location to link to is always preceded by a # sign and should be the exact same as the value for the <a name >. The text enclosed in the tag will be the actual clickable link. This method of linking is commonly used to provide a link back to the top of a document or for internal navigation. |
Example:
<p><a name="partone"></a>This is part one. It contains lots of stuff.</p>
<p>Here's part two. Whoopee.</p>
<p>Here's part three. More excitement to follow.</p>
<p>Here's a commercial for Husky Deli ice cream.</p>
<p><a href="#partone">Go back to part one.</a></p>
