How To Add More To HTML Links

Monday, 04 August 2008 14:07 Written by AK

A link is created by using the a tag in HTML (Hyper-Text Markup Language).

It is a hyper-reference to a URL (Uniform Resource Locator).

We can change the default link to include alternate text descriptors or hints for visually impaired users and titles/tool-tips for web-crawlers like Google, Yahoo, MSN and us.

This is what a normal link looks like when you don't use a WYSIWYG (What You See Is What You Get) editor.

MyDL

It is the text you desire, eg. MyDL, surrounded by the a tags, pointing to a hyper reference.

Not many people take the time to add the extra tags available. Here are a few of the definitions available for the a tag.

Title
```
MyDL 
```
A title allows us to view some extra info about the link, as a tooltip! Try hovering your mouse over this link to see the tooltip effect.

MyDL

Alt
```
MyDL
```
The alt tag is to help visually impaired users get a little description if the link itself is unclear.

Target
```
MyDL
```
The Target allows us to specify which window the link should open in. There are more javascript methods you could use but here are 6 common HTML usages:
- _frameName
- _new
- _blank
- _parent
- _self
- _top
Anchor Names

These are hidden anchor tags that allow us to jump through sections in long pages. They link directly to a reference within the page, not a URL.

We add a name exactly where we want to jump to eg. Top, Section1, etc

At your reference point, you add an Anchor Name as follows:

Anchor Links

We are now going to link to the 'Top' anchor which is hidden, but there!
The anchor link is created as follows,
```
Top
```
Click to go to the Top

There are more ways to use links for email, around images, etc.

More about HTML links are covered thoroughly at these two sites: w3schools.com & w3.org