Clean β’ Professional
Links and navigation are the backbone of any website. They allow users to move from one page to another, open files, jump to sections, or even connect via email and phone. In HTML, we use the <a> (anchor) tag to create links, and navigation menus are created using a group of links.
A link in HTML is a clickable element (text or image) that redirects the user to another webpage, file, or resource.
Links make a website interactive, user-friendly, and connected to other resources on the internet.
Basic Syntax:
<a href="URL">Clickable Text</a><a> in HTMLThe <a> (anchor) tag is used to create links.
Basic Syntax:
<a href="url">Link Text</a>href β Hyperlink Reference (destination URL).Example:
<a href="https://www.example.com">Visit Example Website</a>Here are the main types of links:Β
A complete web address including https:// or http://.
Always points to the same resource, no matter where your website is hosted.
Example :Β
<a href="https://www.google.com">Go to Google</a>A shorter path that points to files or pages inside your own website.
Depends on your websiteβs folder structure.
Example :Β
<a href="about.html">About Us</a>mailto:)Opens the default email client to send a mail.
Example :
<a href="mailto:[email protected]">Send Email</a>tel:)Useful for mobile users to dial numbers directly.
Example :Β
<a href="tel:+919876543210">Call Us</a>Jump to a specific section on the same page.
They are useful when the page is long, so users donβt need to scroll manually.
Example :
<a href="#contact">Go to Contact Section</a>
<h2 id="contact">Contact Us</h2>
<p>Email: [email protected]</p>id="contact" β creates the bookmark spot.href="#contact" β jumps to that spot when clicked.Links can also be used to download files.
Example :
<a href="files/tutorial.pdf" download>Download PDF</a>An image can also be clickable as a link.
Example :
<a href="https://example.com">
<img src="logo.png" alt="Company Logo">
</a>You can use target="_blank" to open links in a new browser tab.
Example :
<a href="https://www.wikipedia.org" target="_blank">Open Wikipedia</a>They connect webpages together and form the structure of the web.
Improve user navigation and experience.
Help search engines crawl and index pages effectively.
Allow for interaction beyond the site (emails, downloads, external resources).