Links are the foundation of the web. Without links, there would be no web. Links allow you to move from one page to another — both within your own website and across the entire internet.
HTML Links — The <a> Tag
The HTML <a> tag defines a hyperlink. It has two important attributes:
href— specifies the destination addresslink text— the visible, clickable part of the link
<a href="https://www.w3schools.com">Visit W3Schools!</a>💡 Tip: A link does not have to be text. A link can be any HTML element — an image, a paragraph, or even a div. We'll see examples below.
Links — The href Attribute
The href attribute specifies the URL of the page the link goes to. If the href attribute is not specified, the link is not a link — it's just a placeholder.
<a href="https://www.w3schools.com">Visit W3Schools</a>
<a href="default.asp">HTML Tutorial</a>Links — The target Attribute
The target attribute specifies where to open the linked document. It can have one of the following values:
| Value | Description |
|---|---|
_blank |
Opens the linked document in a new window or tab |
_self |
Opens the linked document in the same window/tab (default) |
_parent |
Opens the linked document in the parent frame |
_top |
Opens the linked document in the full body of the window |
<a href="https://www.w3schools.com" target="_blank">Visit W3Schools!</a>💡 Tip: When using
target="_blank", always addrel="noopener noreferrer"for security.
Links — The title Attribute
The title attribute specifies extra information about a link. The value of this attribute will be shown as a tooltip when you hover over the link:
<a href="https://www.w3schools.com" title="Visit W3Schools!">W3Schools</a>Image Links
It is common to use images as links. Just put the <img> tag inside the <a> tag:
<a href="https://www.w3schools.com">
<img src="smiley.gif" alt="W3Schools" style="width:48px">
</a>Bookmarks (Anchor Links)
You can use the id attribute to create a bookmark (anchor). Then link to that bookmark from elsewhere on the page with the href="#id" syntax:
<h2 id="tips">Useful Tips</h2>
<p>Some useful tips for HTML beginners.</p>
<a href="#tips">Back to Tips</a>Link Best Practices
✅ DO
<!-- Descriptive link text (good for accessibility and SEO) -->
<a href="https://www.w3schools.com/html/">HTML Tutorial</a>
<!-- Link to a downloadable file -->
<a href="/files/report.pdf" download="report.pdf">Download Report (PDF)</a>❌ DON'T
<!-- Vague link text (bad!) -->
<a href="https://www.w3schools.com/html/">Click here</a>
<!-- No href (not a real link!) -->
<a>Not a link</a>💡 Tip: Screen readers often navigate by jumping from link to link. Using descriptive text like "HTML Tutorial" helps them understand where each link goes. "Click here" tells them nothing.
Knowledge Check
4 questions — test your understanding
What does the href attribute specify?
What does target="_blank" do?
How do you create a bookmark on a page?
Why should link text be descriptive?
Next: HTML Images