HTML Basics
HTML Links
Links are what turn separate pages into a connected web. The anchor tag, <a>, creates a clickable link to another page, a section, an email address, or a file.
What is an HTML Link?
A link is created with the <a> (anchor) element. Its most important attribute is href, which holds the destination — a web address, a file, an email, or a spot on the same page. The text between the tags is what the user clicks.
Links can point to a full URL on another site (absolute) or to a file within your own site (relative). The target attribute controls whether the link opens in the same tab or a new one.
Basic Usage
<a href="https://myinternships.in">Find internships</a>Example: Different Kinds of Links
<!DOCTYPE html>
<html>
<body>
<p><a href="https://myinternships.in">Visit our website</a></p>
<p><a href="mailto:hello@example.com">Email us</a></p>
<p><a href="tel:+919999999999">Call us</a></p>
<p><a href="https://picsum.photos/200" download>Download an image</a></p>
</body>
</html>More Examples
<a href="https://myinternships.in" target="_blank" rel="noopener noreferrer">
Open in a new tab
</a><!DOCTYPE html>
<html>
<body>
<p><a href="#section2">Go to Section 2</a></p>
<h2>Section 1</h2>
<p>Some content...</p>
<h2 id="section2">Section 2</h2>
<p>You jumped here!</p>
</body>
</html>Common href Values
| href value | Links to |
|---|---|
| https://site.com | A full external web address. |
| about.html | Another page in the same folder. |
| #top | An element with id="top" on this page. |
| mailto:you@x.com | Opens the user's email app. |
| tel:+91... | Starts a phone call on mobiles. |
When you use target="_blank", also add rel="noopener noreferrer". This prevents the new page from gaining access to your page and protects users' security.
Write descriptive link text like "Read the guide" instead of "click here". Screen reader users often browse by a list of links, and "click here" tells them nothing.
Key Takeaways
- The <a> tag creates links; href sets the destination.
- Use absolute URLs for other sites, relative URLs for your own pages.
- target="_blank" opens a new tab — pair it with rel="noopener".
- Use meaningful link text, not "click here".