HTML Links

Learn how to create hyperlinks to navigate between pages and websites.

What is an HTML Link?

HTML Links, also called hyperlinks, are used to connect webpages, sections, or external websites. They are created using the <a> (anchor) tag.

  • Navigate within the same website (internal links)
  • Go to other websites (external links)
  • Jump to a section on the same page (anchor links)
  • Open email clients (mailto: links)

Real-Life Example: Clicking a menu item to go to another page is a link in action.

Basic Syntax of Links

Example: Simple Link


<a href="https://crackease.com">Visit CrackEase</a>

Explanation: The href attribute specifies the URL of the page the link goes to.

Internal Links

Internal links navigate to another page within the same website.

Example: Internal Link


<a href="about.html">About Us</a>

External Links

External links navigate to a page on a different website. Use target="_blank" to open in a new tab.

Example: External Link


<a href="https://google.com" target="_blank">Visit Google</a>
  • target="_blank" – Opens link in a new tab
  • rel="noopener noreferrer" – Security best practice for new tabs

Anchor Links (Jump to Section)

Anchor links allow navigation to a specific section on the same page using an ID.

Example: Anchor Link


<a href="#contact">Go to Contact Section</a>

<section id="contact">
    <h2>Contact Us</h2>
</section>

Mailto Links

Mailto links open the user’s email client to send an email.

Example: Mailto Link


<a href="mailto:info@crackease.com">Email Us</a>

Best Practices for Links

  • Use descriptive link text instead of "click here"
  • Use target="_blank" only for external links
  • Include rel="noopener noreferrer" for security
  • Use anchor links for navigation within a page
  • Ensure links are accessible via keyboard and screen readers

Pro Tip: Clear and accessible links improve UX, navigation, and SEO.