References

Beginner-friendly references for web development, with live, editable examples.

The HTML href attribute

Attribute All modern browsers Updated
Quick answer

The HTML href attribute specifies the URL the link points to. It is used on the <a>, <area>, <link> and <base> elements.

Overview

The href (hypertext reference) attribute specifies the URL a hyperlink points to. On an <a> it is what makes the element an actual link — an <a> with no href is just a placeholder, not focusable or operable as a link. It is also used on <link> (to reference stylesheets and other resources), <area> and <base>.

It accepts several URL forms: absolute (https://example.com/page), root-relative (/about/), document-relative (page.html), fragment links (#section, which scroll to an element on the same page), and special schemes such as mailto: for email, tel: for phone numbers and sms: for text messages.

For accessibility and SEO, write descriptive link text rather than "click here" — screen-reader users often browse a list of links out of context. And reserve <a> for navigation: for a control that runs JavaScript, use a real <button> instead of an <a href="#">.

Syntax

<a href="https://example.com">Visit</a>

Values

Value
A URL — absolute, relative, or a special scheme such as mailto:, tel: or a #fragment.

Example

Live example 
<a href="https://codeshack.io/">Visit the CodeShack homepage</a>

Best practices

  • Always include href on a link — an <a> without it is not a real, focusable link.
  • Write descriptive link text; avoid "click here", which is meaningless out of context.
  • Use the mailto: and tel: schemes for email and phone links.
  • For actions that run JavaScript, use a <button>, not <a href="#">.

Frequently asked questions

What does the href attribute do?
It specifies the URL a hyperlink points to, turning an <a> into a working link.
What is an <a> without href?
It is a placeholder, not a link — it is not focusable or operable as one. Add an href to make it a real link.
How do I make an email or phone link?
Use href="mailto:name@example.com" for email or href="tel:+15551234" for phone.
How do I link to a section on the same page?
Use a fragment link, href="#id", pointing at the id of the target element.
high hreflang