The Anchor Element (a)
What is an Anchor Element?
Think of a portal door in a sci-fi movie. When you step through it, you are instantly transported to a different city or even another planet. In HTML, the<a> (Anchor) tag is that portal door. It creates a clickable hyperlink that takes visitors to another webpage, another website, or a different section of the same page.To make a link work, we use the href (Hypertext Reference) attribute. This specifies the destination URL. If you want the link to open in a brand new browser tab instead of replacing your current page, you add the target="_blank" attribute.
Why does it matter?
The World Wide Web is called a "web" because pages are connected together by hyperlinks. Without links, every page would be a dead-end island, and visitors wouldn't be able to browse or navigate your site.How to write it
Wrap the text you want the user to click inside opening and closing<a> tags, and specify the destination URL in the href attribute:
<a href="https://google.com" target="_blank">Search</a>
href="https://google.com" tells the browser where to go.target="_blank" tells it to open in a new tab.Search is the clickable text displayed to the visitor.Link Anchor
Destination URL
Common Mistakes
href attribute: Writing <a>Search</a> creates text that looks like a link but does absolutely nothing when clicked.https:// for external links: If you write href="google.com", the browser will think it's a relative path on your own server (e.g., yoursite.com/google.com) and throw a 404 error. Always include the protocol (e.g., https://).Quick Reference
<a href="URL"> — Creates a hyperlink.target="_blank" — Opens the link in a new tab.Your Task
Create an anchor link `<a>` pointing to 'https://google.com', opening in a new tab, containing the text 'Search'.
index.html
Type code above to start the lesson.
Live Preview