Basic Links
Links are created with the <a>
tag, using the href
attribute to specify the destination.
<a href="https://www.example.com">Visit Example</a>
Absolute vs Relative URLs
- Absolute URL: The full web address (e.g.,
https://www.google.com
). - Relative URL: The path relative to your current page (e.g.,
about.html
).
<a href="about.html">About Us</a> <!-- relative link -->
<a href="https://www.google.com">Google</a> <!-- absolute link -->
Opening in a New Tab
Use target="_blank"
to open a link in a new browser tab. Always include rel="noopener noreferrer"
for security.
<a href="https://www.wikipedia.org" target="_blank" rel="noopener noreferrer">Wikipedia</a>
Linking to a Section on the Same Page
You can link to an element’s id
within the same page.
<a href="#section2">Go to Section 2</a>
...
<h2 id="section2">This is Section 2</h2>
Exercise
Create a webpage with:
- A link to your school's homepage (absolute link).
- A link to another lesson in your HTML course (relative link).
- A link to a section further down the same page.
- A link that opens in a new tab.