HTML Guide

Space characters are not permitted in the value of the href attribute; they must be properly percent-encoded.

The href attribute specifies a URL, and URLs must follow specific syntax rules defined by RFC 3986. Spaces and some other characters are considered illegal in URLs. To include a space in the URL, use the percent escape sequence %20 in place of the space character.

Incorrect example with an illegal space in the query string:

<a href="search.html?q=my search">Search for 'my search'</a>

Correct example using percent-encoding for the space:

<a href="search.html?q=my%20search">Search for 'my search'</a>

Replace all spaces in URLs within href attributes with %20 to ensure W3C validation and proper browser behavior.

A link element is invalid unless it contains at least one of the href or imagesrcset attributes.

The link element is used to define relationships between the current document and external resources, most commonly stylesheets. According to the HTML standard, a link must have either an href attribute, which points to the resource, or an imagesrcset attribute for responsive icons. If both are missing, the validator throws an error. This ensures that the link actually references a resource, otherwise it serves no functional purpose.

Correct usage:

With an href (for stylesheets, icons, etc.)

<link rel="stylesheet" href="styles.css">

With imagesrcset (for responsive icons)

<link rel="preload" as="image" type="image/png" imagesrcset="icon-1x.png 1x, icon-2x.png 2x">

Empty href attributes like href or href="" are invalid in HTML and can cause unpredictable behavior.

According to the HTML specification, the href attribute in elements such as the a and link tags must contain a valid URL or fragment reference. An empty or omitted href results in the attribute being ignored or possibly causing compatibility problems, especially in older browsers. If you intend the link to do nothing, use href="#" and prevent the default action with JavaScript, or avoid making it a link if no action is necessary.

Valid HTML for a regular link:

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

Valid usage for a link that does nothing:

<a href="#" onclick="return false;">Do nothing</a>

If the element should not be clickable, use a different tag such as span or button:

<span>Not a link</span>

or

<button type="button">Not a link</button>

Avoid writing:

<a href>Invalid link</a>

or

<a href="">Invalid link</a>

as these will produce the validation warning you saw.

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.

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.

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.

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.