HTML Checking for Large Sites
Rocket Validator automatically checks your pages on the W3C Validator.
The element “button” must not appear as a descendant of the “a” element.
A button
element, or an element with the role=button
attribute, is not allowed to be nested inside an <a>
element.
Related W3C validator issues
A button
element, or an element with the role=button
attribute, is not allowed to be nested inside an <a>
element.
An <a>
element cannot contain a descendant element with the attribute tabindex
.
Learn more:
A button
element cannot contain a descendant element with the attribute tabindex
.
The aria-expanded
attribute can only be true
, false
, or undefined
.
This attribute indicates whether a grouping element is expanded or collapsed.
Learn more:
A <li>
element, used to define a list item, does not accept the button
role.
This HTML code is invalid because the <li>
elements can’t have role="button"
:
<ul>
<li role="button">One</li>
<li role="button">Two</li>
</ul>
Learn more:
The href
attribute of an <a>
element contains an invalid character, that should be properly encoded as a URI percent-encoded character.
Learn more:
The target
attribute on <a>
elements can’t be blank.
This attribute defines the browsing context for links, that is, where should the linked documents be opened. This was used extensively on the now deprecated <frame>
element, so you could give the name of the frame to open the document in, but is now more used to force links to open in a separate tab or window using target="_blank"
. Another option is using a name, so the new browsing context can be referred to on subsequent clicks on links with the same target
.
For example, this will force the links to open on a new tab:
<a href="https://example.com" target="_blank">will open a blank tab</a>
Learn more:
The href
attribute on an a
tag expects a valid URL, but only http://
was found.
<a>
tags can be used to link to an email address using the mailto
protocol in the href
attribute. Ensure that there is no space in the email address.
<a href="mailto: liza@example.com">This is wrong as it contains an space</a>
<a href="mailto:liza@example.com">This is OK</a>
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 value used in the target
property of an <a>
element has been identified as a keyword because it starts with an underscore _
, but it’s not a valid keyword.
Values starting with an underscore for the target
property are used for reserved keywords like _blank
, _self
, _parent
or _top
.
Learn more:
The value provided on the type
attribute of an a
element is not a valid MIME type.
The type
attribute expects a MIME type that hints at the linked URL’s format.
Read more:
The type
attribute on <a>
elements, when present, gives a hint on the MIME type of the linked resource, for example:
<a href="application/pdf" src="book.pdf">Read our book</a>
<a href="image/jpeg" src="photo.jpeg">See a photo</a>
That is, we’re talking about the type of the linked resource, not the type of the <a>
element, as it’s sometimes misunderstood. The following example is invalid because button
is not a valid MIME type.
<a href="/order.php" type="button">Submit</a>
Learn more:
The <a>
element requires either a href
attribute, or a role
attribute.
Learn more:
An </a>
end tag has been found to violate nesting rules. <a>
tags can’t include other <a>
tags inside. Most probable cause is an unclosed <a>
tag, like in this example:
<a href="one.html">Page 1
<a href="two.html">Page 2</a>
An <a>
tag can’t include other <a>
tags inside. Most probable cause is an unclosed <a>
tag, like in this example:
<a href="one.html">Page 1
<a href="two.html">Page 2</a>
An <a>
element has been found in an invalid place within a <table>
element.
For example, the following code would cause this issue:
<table>
<tr>
<a href="#">link</a>
</tr>
</table>
Instead, the <a>
element should be inside a <td>
element, as a <tr>
can’t hold content directly:
<table>
<tr>
<td>
<a href="#">link</a>
</td>
</tr>
</table>
The button
role is used to make an element appear as a button control to a screen reader and can be applied to otherwise non-interactive elements like <div>
. If you’re already using a <button>
element, then it’s redundant to apply it the role button
, as that’s implicit.
<!-- Instead of this -->
<button role="button">Buy</button>
<!-- Do this -->
<button>Buy</button>
Learn more:
The <summary>
HTML element specifies a clickable summary, caption, or legend for a <details>
element’s disclosure box. As the <summary>
element has an implicit button
role, it’s not needed to include it explicitly.
Here’s an example, clicking the <summary> element toggles the state of the parent <details> element open and closed.
<details>
<summary>I have keys but no doors. I have space but no room. You can enter but can’t leave. What am I?</summary>
A keyboard.
</details>
Learn more:
An element with role=button
can’t have an input
element as descendant.
The ARIA role button
can be added to an element to make it behave like a <button>
– just like a <button>
is not allowed to contain other <input>
elements as descendants, any element with this role is not allowed to contain them either.
All these examples in the following code will raise a similar issue:
<div role="button">
<input type="checkbox" />
</div>
<button>
<input type="checkbox" />
</button>
<a>
<input type="checkbox" />
</a>
Learn more:
A <label>
tag can’t be used inside an <a>
tag. Consider using other tags like <span>
.
A label
element is not allowed as a descendant of a button
element.
The label
element represents a caption in a user interface. The caption can be associated with a specific form control, known as the label element’s labeled control, either using the for
attribute, or by putting the form control inside the label element itself.
Learn more:
Links created with the <a>
element no longer accept a shape
attribute. In order to define image maps, use the <area>
element instead.
Learn more:
25,000 HTML checks per month. Is that enough for your site?
Save time using our automated web checker. Let our crawler check your web pages on the W3C Validator.