Free tools Windows power users keep installed
One-click scans. No signup required.
Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
Use href to give an HTML link its destination. On an <a> element, that destination may be a full URL, a relative path, a page fragment, a file, or a handler such as mailto:. Choose the form that matches where the destination lives and whether the link should depend on the current page’s URL. The WHATWG HTML Standard defines an <a> with href as a hyperlink labeled by its contents.
Basic HTML href syntax
Put the destination in the href attribute and the link text between the opening and closing <a> tags:
<a href="https://example.com/about">About Example</a>The browser makes “About Example” the clickable link. Write link text that tells readers where the link goes or what following it will do; avoid labels such as “click here” when they hide the destination. An <a> without href is not a hyperlink.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Choose the right href form
The main choice is whether to give the browser a complete URL or a reference it must resolve against a base URL. These forms solve different navigation needs:
| Form | Example | What it points to |
|---|---|---|
| Full URL | https://developer.mozilla.org/ |
A complete address, including scheme and host. |
| Root-relative path | /help/contact.html |
A path from the origin root. |
| Directory-relative path | guide.html |
A path resolved in relation to the current document’s URL. |
| Parent-relative path | ../index.html |
A path that moves up one directory segment before resolving. |
| Fragment | #installation |
A location identified by an element ID within a document. |
For a fuller explanation of these URL forms, see MDN’s guide to creating links.
Full URLs for explicit destinations
A full URL names the destination without relying on the current page’s directory:
<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/a">MDN’s anchor-element reference</a>Use this form when the exact destination is on another site, or when you want the address to be explicit. A URL normally includes a scheme such as https:// and a host such as developer.mozilla.org; the remaining path identifies a location on that host.
The Tool Desk
Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Rank #2
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Relative href examples, resolved step by step
A relative reference does not contain the entire destination address. The browser resolves it against a base URL. By default, that context is the document URL; a <base href> element can change the base used for relative references.
Example: a file beside the current page
Suppose the current page is https://www.example.com/guides/start.html. This link uses a directory-relative filename:
<a href="example.html">Example page</a>The browser combines the filename with the current page’s directory, making the destination https://www.example.com/guides/example.html. The string example.html is not a complete URL, and it does not mean “the page called example wherever it happens to be on the site.” Its meaning depends on the current URL and base URL.
Example: start at the site root
<a href="/example.html">Example page</a>The leading slash makes this root-relative: it points to https://www.example.com/example.html for that origin, rather than to a file in /guides/. Root-relative paths are useful when a destination should stay rooted at the site rather than beside whichever page contains the link.
Example: move to a parent directory
<a href="../example.html">Example page</a>Starting from https://www.example.com/guides/start.html, .. moves up from /guides/, so the destination is https://www.example.com/example.html. Use this form when the desired location is expressed relative to the current directory structure.
When deciding among full and relative forms, ask whether the destination should be explicit, whether it belongs at the origin root or near the current page, and whether a fragment within a page is intended. Also check for a <base> element: it can change the resolution of relative links across the document. MDN documents this behavior in its reference for the <base> element.
Link to a section on the same page
To link to a particular location in the current document, give the target element an id and use that ID after #:
<a href="#installation">Jump to installation</a>
<h2 id="installation">Installation</h2>The fragment value must correspond to the target element’s ID. A fragment such as #installation identifies a location within a document; it is not a filename or a directory path. You can also link to a fragment on another page by combining a page URL and fragment, for example https://example.com/guide.html#installation.
Recommended Free Tools
Link to a file
An href can point to a file on your site, including a PDF:
<a href="/files/project-brief.pdf">Download the project brief (PDF)</a>Make the link text identify the file or its format when that helps readers understand the result. Do not assume every linked file will download: whether it opens in the browser or downloads depends on the server response and link attributes.
Use email and telephone URL schemes
Link destinations are not limited to web pages. For example, these links ask the reader’s device to open an email or telephone handler:
<a href="mailto:[email protected]">Email us</a>
<a href="tel:+123456789">Call us</a>The resulting behavior depends on the applications and browser or device configuration available to the reader. Use descriptive link text so the action is clear before someone follows the link.
Do not confuse <a href> with <link href>
Both elements can have an href attribute, but they serve different purposes:
<a href="...">creates a hyperlink in the page that a reader can follow.<link href="..." rel="stylesheet">associates a resource, such as a stylesheet, with the document. Therelattribute identifies the relationship.
<link rel="stylesheet" href="/css/site.css">Use an anchor when you want navigable link text in the document. Use a link element when the document needs to declare a relationship to a resource. See MDN’s reference for the <link> element.
Check links when something goes wrong
- A same-site link opens the wrong location: Check the current page URL, then resolve the relative path from its directory. If the link should start at the origin root, use a path beginning with
/. - A relative link behaves unexpectedly across pages: Look for a
<base href>in the document head. It can change the base URL used for relative references. - A section link does not reach the intended target: Confirm that the target has an
idmatching the fragment after#. - A file opens instead of downloading: The link does not by itself guarantee a download. Browser handling depends on the server response and link attributes.
- An email or telephone link does not launch an app: The device may not have an application or handler configured for that scheme.
- A resource declaration is not visible as a clickable link: Check whether you used
<link>where a reader-facing<a>was intended.
Or skip the browser setup
If your goal is to capture a rendered page containing links—for example, to inspect how a link looks in context—you can request a screenshot from ScreenshotNeo instead of setting up a browser capture. Its API accepts a URL and returns an image or PDF. Here is a one-request cURL example; see the ScreenshotNeo API documentation for the request options and response details:
Quick Recap
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.webpScreenshotNeo accepts cookie or consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; each of those steps can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies the page verdict and billing status in headers. Its MCP server provides take_screenshot, get_page_info, and capture_pdf tools for Claude, Cursor, and other MCP clients. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000 shots. Sign up for 1,000 free screenshots a month—no card required.
Sources for HTML link behavior
- WHATWG HTML Standard: text-level semantics
- MDN: The Anchor element
- MDN: Creating links
- MDN: The External Resource Link element
- MDN: The Document Base URL element
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
