Skip to main content

Anchor Tag

Introduction​

In the world of web development, HTML forms the basic building block. Among its numerous tags, the anchor tag plays a significant role in connecting different parts of a website or various websites altogether. This tutorial will provide a comprehensive understanding of the anchor tag, its attributes, and how it is used in HTML.

What is an Anchor Tag?​

In HTML, an anchor tag is denoted by <a>. It is primarily used to create links, also known as hyperlinks, within the content. These links can direct the user to a different section on the same page, another webpage on the same website, or even a completely different website.

Syntax of Anchor Tag​

The basic syntax of an anchor tag in HTML is as follows:

<a href="url">Link text</a>
  • <a>: This is the opening tag.
  • href: This is an attribute that specifies the URL of the page the link goes to.
  • url: This is where you insert the URL of the webpage you want to link to.
  • Link text: This is the clickable text that the users see.
  • </a>: This is the closing tag.

Attributes of Anchor Tag​

The anchor tag has several attributes, but we'll focus on the most commonly used ones:

  1. href: As mentioned above, it specifies the URL where the user is led to upon clicking the link.

    Example:

    <a href="https://www.example.com">Visit Example.com</a>

  2. target: This attribute specifies where to open the linked document. The most common value used is _blank, which opens the linked document in a new window or tab.

    Example:

    <a href="https://www.example.com" target="_blank">Visit Example.com</a>

  3. title: This attribute provides additional information about the link. The information appears as tooltips when you mouse over the link.

    Example:

    <a href="https://www.example.com" title="Go to example.com">Visit Example.com</a>

Anchor Tag for Email​

The anchor tag can also be used to create a clickable email address. This is done by using the mailto: scheme within the href attribute.

Example:

<a href="mailto:[email protected]">Send Email</a>

Clicking on this link will open the user's default email program with a new email drafted to [email protected].

Conclusion​

The anchor tag is a powerful tool in HTML, allowing developers to create hyperlinks to different parts of their website or to other websites. With the href, target, and title attributes, developers have control over the URL, where to open the URL, and additional information about the link, respectively. Moreover, the anchor tag can create clickable email addresses with the mailto: scheme.