HTML Guide
The href attribute in the a tag uses an invalid character, as > is not allowed in URL fragments.
According to the HTML standard and URL syntax, fragment identifiers (the part after #) can only contain certain characters. The > character is not permitted and must be removed or percent-encoded. If the > is unintentional, simply omit it; if it must be included as part of the fragment, encode it as %3E.
Original HTML (invalid):
<a href="/page.php>">Read more</a>
Corrected HTML (if > should not be present):
<a href="/page.php">Read more</a>
Corrected HTML (if > is required in fragment, encode it):
<a href="/page.php%3E">Read more</a>Learn more:
Related W3C validator issues
An <a> element has been found with an invalid href attribute, containing more than one # adjacent character.
The # is used to separate the fragment part of an URI (typically used to indicate a section within a document). For example, this is a valid link to a URI containing a fragment:
<a href="https://example.com/faqs#pricing">pricing</a>The next example is invalid because it contains two adjacent # characters, so that the fragment part would be #pricing instead of pricing:
<a href="https://example.com/faqs##pricing">pricing</a>The href attribute of an <a> element contains an invalid character, that should be properly encoded as a URI percent-encoded character.
Square brackets ([, ]) are not allowed unescaped in the query part of an href URL value.
The href attribute in the <a> element must contain a valid URL. According to the URL standard, certain characters, including square brackets, are not permitted directly in the query component unless percent-encoded. Using unescaped square brackets in the URL can cause validation errors and unexpected behavior in browsers.
To include a square bracket in the query string, use percent encoding:
- [ encodes to %5B
- ] encodes to %5D
Incorrect usage:
<a href="search.html?q=[value]">Search</a>Correct usage:
<a href="search.html?q=%5Bvalue%5D">Search</a>This ensures the URL is valid and compliant with HTML standards.
The href attribute of the a element contains an invalid backslash character, which is not permitted in URLs.
According to the WHATWG HTML living standard, the href attribute must contain a valid URL. URLs use forward slashes (/) for path separators, and backslashes are not allowed as they can cause browsers and validators to misinterpret the address. Backslashes often arise when file paths are copied from Windows environments.
Correct Usage:
- Always use forward slashes / in your URLs.
- Remove any backslashes from href values.
Example of incorrect usage:
<a href="images\picture.jpg">View Picture</a>Corrected example:
<a href="images/picture.jpg">View Picture</a>An illegal character has been found for the “href” attribute on the “link” element.
To fix this issue, find the “link” element in question and make sure that the “href” attribute contains a valid URL without any illegal characters.
Here’s some example HTML code of a link element:
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<h1>Welcome to my webpage!</h1>
<p>Here is some content...</p>
</body>
</html>In the above example, the link element has a valid href attribute value of styles/main.css. Make sure that your href attribute values don’t contain any illegal characters.
Curly braces {} are not allowed in the href attribute value of an <a> element because they are not permitted in valid URLs.
According to the HTML standard and URL specification, certain characters—including { and }—must be percent-encoded in URLs to avoid validation errors and ensure proper browser handling. If you need to include a curly brace in a URL, use percent-encoding: { is %7B and } is %7D.
Incorrect HTML:
<a href="http://example.com/?i=470722{0}">Link</a>Correct HTML with percent-encoding:
<a href="http://example.com/?i=470722%7B0%7D">Link</a>Resulting link:
http://example.com/?i=470722%7B0%7D
Only use plain { or } if you are generating URLs client-side (for example, as template placeholders in JavaScript). To validate properly, always encode or remove illegal characters in attribute values.
Hash (#) characters can be used in an href attribute to link to a specific part of a document.
For example, if we have this page with several sections, each of them marked with an ID:
<h1>Frequently Asked Questions</h1>
<h2 id="pricing">Pricing</h2>
<p>All about pricing...</p>
<h2 id="terms">Terms</h2>
<p>You can find our terms at...</p>
<h2 id="guarantee">Guarantee</h2>
<p>We offer a guarantee...</p>You can link to a specific part of that document, for example if this page URL is /faqs and you want to link to the Guarantee section you could use:
<a href="/faqs#guarantee">Guarantee</a>Or, if you’re linking from inside the same document, for example in a table of contents, you could just use:
<a href="#guarantee">Guarantee</a>As there can only be one fragment in an URL, the # character should only be used once. The following would be an invalid href:
<a href="/faqs#guarantee#pricing">Bad</a>If needed, the # could be encoded as %23.
Space characters are not allowed in href attributes. Instead, they should be converted to %20. In this example, the first line is invalid and the second is valid:
<a href="https://example.com#some term">invalid</a>
<a href="https://example.com#some%20term">valid</a>The href attribute on an <a> tag contains an space, which is not allowed. Consider replacing space characters with “%20”.
The attribute value in the href on the <a> element contains invalid characters.
HTML links require a valid URL as the value of the href attribute. Brackets ([, ]) are not allowed in attribute values.
Example of invalid usage:
<a href="mailto:[user@example.com]">Email Us</a>Correct usage:
<a href="mailto:user@example.com">Email Us</a>If you are using a template variable to create the links, be sure the template engine properly outputs a valid address in the final HTML.
Example using pseudocode for a templating engine (replace with your syntax as needed):
<a href="mailto:{{ address }}">Email Us</a>Correct, fully rendered HTML after the template variable is replaced:
<a href="mailto:user@example.com">Email Us</a>