a Tag
The <a>
tag is used to create hyperlinks that navigate to different pages.
Here, 'a' stands for 'Anchor,' which plays a pivotal role in structuring content based on links in the web ecosystem.
Key Attributes of the a Tag
The a tag commonly uses the href
, target
, and rel
attributes.
href
: Specifies the URL of the page the link goes to
Usage of a Tag
<a href="https://www.codefriends.net">Visit Codefriends</a>
target
: Specifies how to open the link. To open the link in a new window or tab, usetarget="_blank"
Open Codefriends in a New Window
<a href="https://www.codefriends.net" target="_blank">Visit in a new window</a>
rel
: Specifies the relationship between the current page and the linked page. When usingtarget="_blank"
, it’s a good security practice to also userel="noopener noreferrer"
to indicate that the new page has no relationship with the current page
Usage of the rel Attribute
<a href="https://www.codefriends.net" target="_blank" rel="noopener noreferrer">Securely visit in a new window</a>
How to Use the a Tag
1. Link to an External Website
Clicking the link navigates to an external website. Generally, you use target="_blank"
to open external sites in a new window.
External Link Navigation
<a href="https://example.com" target="_blank">Example Website</a>
2. Navigate to Another Section Within the Document
You can navigate to a different section within the same page that's designated by an id(#).
Internal Navigation
<a href="#section2">Go to Section 2</a>
Want to learn more?
Join CodeFriends Plus membership or enroll in a course to start your journey.