Tags for this article: basics, html, hyperlink, hyperlinking, links, tutorial
Hyperlinks play an important role in HTML. We always need to jump from one web page to another several times while surfing the internet. Hyperlinks make this task practically feasible. They redirect us to another location on World Wide Web once clicked. All the textual links on a web page which we click to go to another web page are hyperlinks. The most common attribute of hyperlinks is that when we roll over our mouse cursor on them, the cursor transforms into a hand with a pointing finger towards the hyperlink. Hyperlinks are also known as anchors. They mark textual data and images as a point which, when clicked, redirects to another web page, text or image. There are two types of hyperlinks in HTML:
1) External Hyperlinks
2) Internal Hyperlinks
External hyperlinks are those which points to another web page. On the other hand, internal hyperlinks are those which points to a different location on the same web page. Both the links are created by using <A> (anchor) tag. We can create the hyperlinks with the help of three attributes:
a) <A>, the anchor tag
b) HREF=””, which is used with the <A> tag
c) URL, which is used with HREF to tell the link where to redirect the user.
For example: to create an external hyperlink we can write the HTML code as:
<A HREF=”http://www.yahoo.com”>Go To Yahoo</A>
According to the above example, if you click on ‘Go To Yahoo’ text, you will be redirected to http://www.yahoo.com URL which is mentioned with HREF attribute.
Sometimes, we also need to jump to a specific location on the same web page instead of going to another web page. In these circumstances, internal hyperlinks are used. To create internal hyperlinks we have to decide the location and its name. Then, the name of that location will be used to jump to that location. When a particular location is identified, then to assign a name to it the ‘name’ attribute is used with the <A> tag. For example:
<A NAME=”bottom”>BOTTOM</A>
<A HREF=”#bottom”>go to the bottom </A>
In the above code, first of all we have assigned a name to the text BOTTOM as bottom with the help of NAME attribute. This text is written at the bottom of the web page. Then, in the next code we have specified that name after the HREF which will take us to the bottom of the page. One more thing which is to be noted here is that there is no filename before the # sign. This indicates that the link is pointing towards a location on the same web page.
Apart from external and internal hyperlinks, we can also insert e-mail links in the HTML documents. For this purpose, ‘mailto:’ protocol is used instead of http. For example:
<A HREF=”mailto://query@contentmantra.com”>Post your Queries</A>
According to the above example, if somebody clicks on the Post your Queries text, then the query will be submitted to query@contentmantra.com. For this purpose, after clicking on the link Microsoft outlook will get opened by default if it is installed on the system.