Creating hyperlinks
The a element, relative and absolute URLs, email links.
All lessons · HTML lessons: learn from scratch
The a element
A link is made with the <a> element and the destination goes in the href attribute. Link text should describe the target: not “click here” but “open the price list”.
<a href="https://example.com/prices">Open the price list</a> <a href="https://example.com" target="_blank" rel="noopener">New tab</a>
target="_blank" opens the link in a new tab; add rel="noopener" for safety.
Absolute and relative URLs
An absolute URL starts with https:// and leads to other sites. A relative URL points to a file on your own site relative to the current page: about.html in the same folder, ../index.html one level up, docs/guide.html in a subfolder.
<a href="about.html">About</a> <a href="../index.html">Home</a> <a href="docs/guide.html">Guide</a>
Fragment, email and phone links
To jump within a page give the element an id and link with #id. mailto: opens the email app and tel: opens the phone dialer.
<a href="#contact">Go to contact</a> ... <h2 id="contact">Contact</h2> <a href="mailto:hello@example.com">Write to us</a> <a href="tel:+994120000000">Call us</a>
- Say in the text when a link opens another kind of file (PDF).