Links
This is the most important aspect in a webpage. Without links, the web (in fact, the word web connotes a 'mesh' or 'links') will be full of static documents making navigation a nightmare. It is however very easy to put links in your document. It is one of the easiest tags in HTML.
In order to set up the link, we only need two things : the URL of the destination and the means of access to this destination.
The tag that is used to include links in the document is <A> and this is known as the 'Anchor' tag. This tag can point to any resource in the web, including another paragraph in the same document. Let us now see the different ways in which this tag can be used.
<A>....</A>
The anchor tag is necessary to define a link's destination. The contents between <A> and </A> become the active hyperlink to the destination, marked by the ubiquitous 'pointed finger' cursor which appears when the mouse is moved over it. The anchor tag can embed a word, sentence or a picture. There are various attributes of this tag. The ones that are most frequently used are : HREF and NAME. For a detailed explanation of these and other attributes, click here.
A simple example for use of this tag is :
<A HREF="http://www.mohaniyer.com">Visit my page </A>. This is displayed by the browser thus : Visit my page
Note that the text is underlined which indicates that this is a hyperlink. When you move the mouse over this, the address to which it is linked is displayed in the status bar of your browser window and the mouse cursor changes to a 'pointing finger'. The color of the linking text depends on the browser settings and can always be modified.
Another example of this tag is shown below:
<A HREF="kids.htm"> Click here </A> to go to <A HREF="sravisht.htm"> my son's </A> page and <A HREF="index.html"> here </A> to go back to my homepage.
This is displayed as under:
Click here to go to my son's page and here to go back to my homepage.
As you'd have noticed, you can use multiple anchor tags within the same sentence, each linking to different destinations.
Normally, it does not matter how you nest the <A> and </A> tags with other formatting tags. For example, the line <H2><A HREF="ha.htm">HTML Tags - A</A></H2> can also be written as under:
<A HREF="ha.htm"><H2>HTML Tags - A</H2></A>
Linking within the same Document
Just like you target links to external sites, you can also establish links to specific points within the same document. This is achieved by setting up named anchors with the use of NAME attribute. This attribute creates bookmarks within the document and the links are setup to point to these bookmarks.
For example, if a HTML document is very long and you want the users to jump to major sections without having to scroll down, you can set up named anchors at the beginning of each section.
<A NAME="link_doc"><H2>Linking within document</H2></A>
This makes the text "Linking within document" into a named anchor. To set up a link to this text from any other place in the document, all you need to do is this : <A HREF=#link_doc>Your text..</A>
Note the use of # sign before the bookmark name. You can also set up links to named anchors (bookmarks) within another document by giving the document name followed by a # sign and the bookmark name. Example : <A HREF=somedoc.htm#section1>
This is a very useful way of setting up Table of Contents for a long document. You can create named anchors at the beginning of each chapter or section and link to them from the table of contents at the top.
Linking to Other Internet Services
The links are not limited to just the web documents. Since the HREF attribute of <A> tag takes URL as its value, we can link to any other Internet service that is addressed within the URL.
These other types of services are :
Examples of use are shown below.
To set up an FTP download link in one of your pages, use the FTP URL rather than a Web URL. FTP URLs begin with ftp:// and not http:// as is the case with web addresses. For example, if you want the users to download a file myriad.zip from a ftp server, code HTML as under:
<A HREF=ftp://ftp.some_server.com/myfiles/myriad.zip>Download Myriad</A>
When the user clicks on the active link "Download Myriad", he is connected to the ftp server and the download begins.
A mailto URL gives the users an easy way of sending e-mail. The HTML code to set up this kind of a link is : <A HREF=mailto:yourmail address>Mail me</A>
When the users click on "Mail me", the e-mail window opens and he can send a mail to the address shown in HREF attribute.
Similar to a word or a phrase, an image can also be made into a source for a link. Look at the following piece of HTML code:
Click on the logo to visit my library <A
HREF=library.htm><IMG SRC="gotolibrary.gif"
ALT="Visit my library"></A>
It appears as under:
Click on the logo to visit my library
If you move the mouse over the image, you will see that it is now a source of link to "library.htm". For more detailed description for <IMG> tag and its attributes click here.
It is also possible for various parts of the image to be linked to different destinations. This is known as an active image. Refer to the Chapter on Images and Image Maps for more details.