Learn HTML – Part 5 – Anchor Tag

Understanding the <a> Tag in HTML (Anchor Tag)

The <a> tag, known as the anchor tag, is one of the most important elements in HTML. It is used to define hyperlinks, which allow users to click and navigate from one page to another—either within the same website or to external websites. In this article, we’ll explore how the anchor tag works, how to use it effectively, and best practices to follow.

What is the <a> Tag?

The <a> tag stands for anchor, and it is used to create links in HTML documents. These links can point to:

• Another webpage on the same website
• An external website
• A file (like PDF, DOC, etc.)
• An email address
• A section within the same page

Basic Syntax of the <a> Tag

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

• href (Hypertext Reference) is the most important attribute of the <a> tag. It tells the browser <strong”>where the link goes.
• The text between <a> and </a> is the clickable link text.

Attributes of the <a> Tag

Examples of <a>Tag Usage

1. Linking to an External Website

<a href="https://www.google.com" target="_blank">Go to Google</a>

2. Linking to a File for Download

<a href="resume.pdf" download>Download My Resume</a>

3. Linking to an Email Address

<a href="mailto:someone@example.com">Send Email</a>

4. Linking to an Element on the Same Page

<a href="#about">Go to About Section</a>

<!-- Later in the page -->
<h2 id="about">About Us</h2>

Best Practices

• Always include the href attribute.
• Use target="_blank" when linking to external pages to keep users on your site.
• Add descriptive text between the <a> tags—never use “Click here” without context.
• Use rel="noopener noreferrer" with target="_blank" for security.

Common Mistakes

• Forgetting the href attribute
• Using unclear or generic link text
• Not testing links to ensure they work

Workbook Section

Let’s try it out!