HTML Anchor a Tag Links

HTML anchor a tag is used to create clickable links in the HTML document. HTML anchor <a> tag is a paired tag that binds the link to the text placed inside the <a> and </a> tag. Text link gets activated only if href attribute of the HTML anchor <a> tag is assigned a URL. When user clicks on link text to opens the page specified in the href attribute of HTML < a > tag. href attribute specifies the destination location of anchor tag <a>. If you will not specify any URL value to the href attribute then output view of the text placed inside the HTML anchor will appear as if it is a normal text. You can also control the target of link to open it. For example to open a link in new window you can use target attribute of HTML anchor <a> tag as target="_blank".

HTML Anchor a Tag Attributes

Following are the commonly used attributes of HTML anchor <a> tag:

• href: href attribute of HTML anchor tag is used to provide the URL path of the targeting web page that is to be open.
  
• target: target attribute of HTML anchor <a> tag is used to open the link in new window or same window. Target attribute is beneficial for the web pages having framesets. Default value set for target attribute consists of _blank to open link in new window, _parent, _top and _self. Last three values for the target attribute open the new link in same window.
  
• id: id attribute of HTML <a> tag allows this HTML element accessible by scripting languages.
  
• name: name attribute of anchor tag is useful for linking anchor tags of a website to provide bookmark feature.
  
• title: title attribute of HTML <a> tag displays the assigned text value as informative tooltip of HTML anchor tag.
  
• rel: rel attribute of HTML a tag is used to provide the relationship between link and the destination.
  
• rev: rev attribute of anchor tag defines the reverse relationship the link and the destination object.

HTML Anchor a Tag Examples

While developing a web site using HTML pages you create pages in the root directory and separate some pages into different sub directories. So, there is difference in linking the pages placed inside the directories and pages placed directly in the root folder. You must know these methods to place the value of URL for the href attribute of HTML anchor <a> tag.

Suppose your root folder name is site1 and sub directory name is subDir1. To open the web page using HTML a tag link, if both source web page and target web are in same folder say both are in root site1 folder or both the web pages are in subDir1 folder, use the following code to create HTML anchor <a> tag link:

<a href="targetPageName.html">link text here</a>

If source page is in the root site1 folder and target page is inside the subDir1 then:

<a href="subDir1/targetPageName.html">link text here</a>

If source page is inside subDir1 and target page is in the root site folder:

<a href="../targetPageName.html">link text here</a>

Note: In above example we used "../" before the target page name. This symbol links to the page one level above the source directory. If your source is 2 or 3 levels down, means 2 or 3 levels inside the nested directories then you can use "../../" or "../../../" to link to the target page at any upper level.

Another method of assigning the URL value to href is absolute URL path for example:

<a href="http://www.ezineasp.net/default.aspx">link text here</a>

If you want to open the link in a new window then you can use the target attribute for example:

<a target="_blank" href="targetPageName.html">link text here</a>

Next we will discuss about the use of HTML anchor <a> tag for creating bookmark links and image links.

Continue to next tutorial: HTML Anchor Bookmark Tag Links to learn HTML hyperlink bookmars to navigate within the same or different page sections.