Know and understand the function of an anchor
21 Website Authoring – Anchor Tags
What is an Anchor? 🔗
An anchor (<a>) is the link that lets users jump from one page or part of a page to another. Think of it as a *door* in a building – it opens to a new room (webpage) or a specific spot inside the same room (anchor link).
Key Attributes of <a> Tags
| Attribute | Purpose |
|---|---|
href |
Specifies the destination URL or anchor name. |
target |
Defines where to open the linked document (e.g., _blank for new tab). |
title |
Provides extra information shown as a tooltip. |
rel |
Describes the relationship between the current page and the linked page. |
name |
Creates an anchor point that other links can jump to. |
download |
Suggests that the target should be downloaded instead of displayed. |
How to Use Anchors – Practical Examples
-
Link to another webpage:
<a href="https://www.example.com">Visit Example</a> -
Open link in a new tab:
<a href="https://www.example.com" target="_blank">Open in new tab</a> -
Anchor link to a section on the same page:
<h2 id="contact">Contact Us</h2>
<a href="#contact">Go to Contact</a> -
Download a file:
<a href="files/report.pdf" download>Download Report</a>
Exam Tips & Quick Checklist ✔️
- Always include the
hrefattribute – it’s the core of the anchor. - Use
target="_blank"only when you really want a new tab; otherwise keep it default. - For internal page jumps, give the target element an
idand link with#id. - Remember that
rel="noopener"is good practice when usingtarget="_blank"to improve security. - Check that the link text is descriptive – e.g., “Download the PDF” not just “Click here.”
- In exam questions, identify which attribute you would use for each scenario.
Revision
Log in to practice.
3 views
0 suggestions