Bad value X for attribute “href” on element “a”: Illegal character in fragment: space is not allowed.

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>

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.

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>

An href attribute on an a element contains an invalid URL that has space characters in the domain.

The domain in a URL cannot contain space characters, for example the following are invalid:

<a href="http://my domain.com">link</a>
<a href="http://my%20domain.com">link</a>

Spaces are not permitted in the href value for phone links; the phone number must be a continuous string without spaces or slashes.

The href attribute of an anchor (<a>) element defines the link’s destination. For phone numbers, the proper URI scheme is tel:, not callto:. According to the HTML standard and the WHATWG Living Standard, the phone number should contain only digits and may use plus (+) or hyphen (-) characters for formatting, but it should not include spaces or slashes.

Incorrect HTML:

<a href="callto:07142/ 12 34 5">Call us</a>

Correct HTML:

<a href="tel:0714212345">Call us</a>

With country code and optional formatting:

<a href="tel:+49714212345">Call us</a>

For best compatibility and validation, always use the tel: scheme and ensure the phone number string contains only allowed characters.

Spaces in the URL fragment are invalid; encode them or remove them (e.g., use %20 or hyphens/underscores).

The href attribute must contain a valid URL. When using a fragment identifier (the part after #), it must follow URL syntax rules: no unescaped spaces. Fragments usually reference an element’s id. An element’s id must be unique and is case-sensitive; while spaces aren’t allowed in id values, many authors accidentally mirror text with spaces in the fragment. Use hyphens or underscores in ids and match the fragment, or percent-encode reserved characters. Prefer readable, dash-separated ids for accessibility and shareable links.

For example, instead of href=”#My Section”, use href=”#my-section” and set id=”my-section” on the target. If you must preserve spaces in a generated URL, encode them as %20, but it’s better to avoid spaces entirely in ids.

HTML Examples

Invalid: reproduces the validator error

<!doctype html>
<html lang="en">
  <head>
    <title>Fragment with space</title>
  </head>
  <body>
    <a href="#My Section">Go to section</a>

    <h2 id="My Section">My Section</h2>
  </body>
</html>

Fixed: use a valid fragment and id

<!doctype html>
<html lang="en">
  <head>
    <title>Valid fragment</title>
  </head>
  <body>
    <a href="#my-section">Go to section</a>

    <h2 id="my-section">My Section</h2>
  </body>
</html>

Alternatively, encoding the space also passes validation, though less ideal as the id would be invalid because it contains spaces:

<a href="#My%20Section">Go to section</a>
<h2 id="My Section">My Section</h2>

The pipe character | is not permitted in the query component of a URL in the href attribute of an a element.

According to the WHATWG and W3C HTML specifications, URLs in attributes such as href must be valid and properly encoded. The pipe character | is not a valid character in the query string of a URL unless it is percent-encoded as %7C. Failing to encode it will cause validation errors. This is especially important for interoperability and security across browsers and user agents.

Incorrect example (invalid href with pipe):

<a href="https://example.com/search?q=test|demo">Invalid link</a>

Correct example (pipe character encoded):

<a href="https://example.com/search?q=test%7Cdemo">Valid link</a>

Always encode special characters such as | in URLs used within HTML attributes to ensure your documents validate and behave consistently.