HTML Guide
<meta> tags, used for defining metadata about HTML documents, must appear within the <head>...</head> section, but it has been found out of place. Check the document structure to ensure there are no <meta> tags outside the head section.
A common cause of this issue is having a duplicated, out of place <head>...</head> section. Ensure that this section appears in its proper place and is the only container for <meta> tags.
The W3C HTML Validator issue “Misplaced non-space characters inside a table” usually occurs when there are text nodes (or other elements) that are not properly placed within table elements. In HTML, all text content should be contained within table cells.
How to Fix the Issue
To resolve this issue, ensure that all text content is placed inside <td> or <th> elements, which are the valid child elements of <table>, <tr>, and related elements. Here’s how you can identify and fix the issue:
Example of Incorrect Table Structure
<table>
<tr>
<!-- This is misplaced content -->
<td>First Cell</td>
<td>Second Cell</td>
</tr>
</table>Corrected Table Structure
<table>
<tr>
<!-- All text should be inside <td> or <th> -->
<td>First Cell</td>
<td>Second Cell</td>
</tr>
</table>Guidelines
-
Text Content: Ensure that all text (including any headers or titles) is wrapped in <td> (for data cells) or <th> (for header cells). Keep in mind that event the non-breaking space character ( ) counts as text.
-
Table Structure: Remember a typical structure for a table includes <table> containing one or more <tr> elements, which in turn contain the <td> or <th> elements.
-
No Direct Text Nodes: Avoid having any direct text nodes outside of the cell elements within the table.
An end tag </p> has been found that cannot be matched for an opening tag <p>. Most of the times this is due to closing the same tag twice, for example:
<p>some text</p></p>Attributes in HTML elements need to be separated by space, in this example the first line is invalid and the second one is valid:
<a href="page.php"class="big">link</a>
<a href="page.php" class="big">link</a>And end tag for element X has been found with no corresponding opening tag for it. Most of the times this is due to closing the same tag twice.
Placing text or non-space characters between the </body> and </html> tags is not allowed.
According to the HTML specification, the </body> tag must be immediately followed by either whitespace (spaces, tabs, newlines) or the closing </html> tag, with no visible content or other characters, as the body of the document must end before </body>. Any characters appearing after </body> are considered outside the document body and violate W3C compliance.
Invalid example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example</title>
</head>
<body>
Content goes here.
</body> this is invalid
</html>Valid example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example</title>
</head>
<body>
Content goes here.
</body>
</html>Ensure that nothing except optional whitespace appears after </body> and before </html> to resolve this validation issue.
A missing or incorrectly placed <!DOCTYPE html> declaration at the very start of your HTML document causes this error.
The <!DOCTYPE html> declaration must be the very first thing in your HTML file, before any HTML code. This declaration tells the browser to use standards mode, ensuring reliable rendering. Without it, browsers may behave unpredictably or trigger quirks mode, and validators will issue an error.
Correct Example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Valid HTML Document</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Incorrect Example (doctype missing):
<html lang="en">
<head>
<title>Invalid HTML Document</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Incorrect Example (doctype not at the very start):
Some misplaced text.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Invalid Placement</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Always ensure <!DOCTYPE html> is the first line.
Rocket Validator checks HTML on your sites using the latest version of W3C Validator Nu HTML Checker, which is intended for HTML5 documents.
The page scanned is using an obsolete doctype, instead of the expected <!DOCTYPE html>.
When specifying a numeric value for a CSS property, remember to always include the units, like 3px or 3em. Only the 0 value can go without units, and instead of 0px you can just use 0.
The aria-label attribute is used to define a string that labels the current element. Use it in cases where a text label is not visible on the screen. This attribute does not work consistently with all HTML elements, so the W3C validator is warning about a possible misuse.
The <!DOCTYPE html public "-//W3C//DTD HTML 4.0 Transitional//EN"> doctype triggers quirks mode in modern browsers and is not compliant with HTML5 standards.
The HTML5 specification requires the use of a simple doctype declaration, which ensures standards mode rendering. The correct doctype is <!DOCTYPE html>, which must appear at the very top of every HTML5 document. Legacy doctypes like HTML 4.0 Transitional are obsolete for modern web development and can cause inconsistent browser behavior.
Example of correct usage:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Valid HTML5 Doctype Example</title>
</head>
<body>
<p>Your content here.</p>
</body>
</html>Replace any legacy or malformed doctype with the above declaration to conform to current HTML standards.
Quote characters used for attributes can use either single quotes (') or double quotes ("), and they must be properly matched, for example:
<p class="news">...</p>A common cause for this issue is forgetting to use the equal sign (=), so the HTML parser wrongly believes the quote forms part of the attribute name, for example:
<p class "news">this is wrong</p>The web page could not be validated because it took too long for the remote server to respond.
A table row tr has been found, containing no td cells. Check the table and remove empty rows.
Table contents is organized in rows using the <tr> element, which must contain cells using the <td> element, as in this example:
<table>
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr>
<td>Liza</td>
<td>12</td>
</tr>
<tr>
<td>Jimmy</td>
<td>14</td>
</tr>
</tbody>
</table>A tr with no td cells on it will raise an issue, as in this example:
<table>
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr>
</tr>
<tr>
<td>Jimmy</td>
<td>14</td>
</tr>
</tbody>
</table>Note that self-closing <tr/> elements also count as empty rows as are like <tr></tr>.
An end tag has been found after the closing </body> tag, which breaks the expected HTML document structure.
Check out the document structure, a basic example follows:
<!DOCTYPE html>
<html lang="">
<head>
<title>Test</title>
</head>
<body>
<p></p>
</body>
</html>Attributes for HTML elements must be defined like name="value". The name may be missing before the =.
Some examples:
<!-- Missing equal sign -->
<p name "value"></p>
<!-- Missing space before the attribute -->
<pname "value"></p>A < character has been found when an attribute was expected instead. Check the syntax of the affected tag, it’s probably malformed and a < character inside has been interpreted as an attribute.
For example, this code might cause this issue:
<!-- Malformed img tag -->
<img src="photo.jpg" alt="smiling cat" < />
<!-- Fixed img tag -->
<img src="photo.jpg" alt="smiling cat" />A tag starting with <? has been found within the document, but it’s not supported. Probable causes can be:
- Copy-pasting the contents of an SVG file. If you do that, you should only paste the <svg>...</svg> part, but not the first line with <?xml...>.
- Unprocessed <?...> tags on server scripting languages like PHP, like <?php>
Learn more:
- [freeCodeCamp: How to Use SVG Images in CSS and HTML]https://www.freecodecamp.org/news/use-svg-images-in-css-html/)
Ensure to escape unescaped angle brackets by using < for < and > for > in HTML.
HTML documents may contain special characters where using the raw characters could lead to errors or misinterpretation by the browser. This is common with angle brackets < and >, which are used for delimiting HTML tags. If these characters are used in textual content or mistakenly typed in an unintended manner, it can cause issues, such as unexpected tag closure or rendering problems.
In your case, the W3C HTML Validator has detected an occurrence of the characters </> which might actually be intended as a simple display of these symbols, but are misinterpreted as an incomplete HTML tag. To prevent such issues, you should escape these characters using HTML character entities like < for the less-than sign and > for the greater-than sign.
Example:
You might want to display code or a message like This is the “<tag>” example in your HTML content. The direct use of < and > can break the HTML content. Instead, use:
<p>This is the "<tag>" example.</p>If you are trying to display the stand-alone sequence </>, you should use:
<p>Saw “</>”</p>These replacements ensure the validator processes your HTML correctly without mistaking your intended display content for HTML coding errors.
A U+0000 character (the null character) is not allowed anywhere in HTML documents according to the W3C and WHATWG HTML standards.
Browsers treat the null character as invalid and ignore it, but its presence may indicate a copy/paste problem, text encoding corruption, or an editor issue. U+0000 should be completely removed from the HTML source. Search for and delete any occurrence of this character in your file.
Example of invalid code containing U+0000 (represented as \0 below for clarity):
<p>This is some text with a null character here:\0</p>Correct, valid example with the null character removed:
<p>This is some text with a null character here:</p>Ensure there are no null characters in the HTML document by searching for \0, U+0000, or using your editor’s “show hidden characters” feature. Save the cleaned HTML and revalidate.
Attributes for HTML elements must be defined like name="value". A common issue is missing the =, or repeating the " like in these examples:
<!-- Missing equal sign -->
<p name "value"></p>
<!-- Repeated quotes -->
<p name="value""></p>Nested comments are not allowed in HTML. When you place an opening comment tag <!-- within an existing comment, it causes a parsing error.
To fix this issue, you should avoid nesting comments. If you need to include multiple comments in your HTML code, you can separate them or consider alternative ways to convey the information without nested comments.
Here’s an example of a nested comments, which is not allowed in HTML:
<!-- This is a valid comment -->
<!-- This <!-- is not allowed -->
nested comment -->To fix the nested comment issue, you can rewrite the comments like this:
<!-- This is a valid comment -->
<!-- Avoid nesting comments and provide comments separately -->
<!-- Another comment here -->
The <section> element can be used to define sections of a document, like chapters, tabbed content, etc. Consider using a heading element (any of <h2> to </h6>) to present each section. Example:
<h1>All about guitars</h1>
<section>
<h2>Guitar types</h2>
<p>Acoustic, electric, classical... we have them all!</p>
</section>
<section>
<h2>Amplifiers</h2>
<p>Analog, digital, portable...</p>
</section>A slash character (/), normally used for self-closing tags, has been found in an unexpected place for a tag, and the validator has decided to ignore it and treat is as a start tag instead.
HTML tags can go in pairs (start tag, end tag) or be self-closing, for example:
<p>This is a paragraph with a start and end p tag</p>
<img src="image.jpg" alt="This is an image with a self-closing tag" />In HTML5, the ending slash and the preceding space is optional for self-closing tags so all of these are valid:
<img src="image.jpg" alt="This is an image with a self-closing tag" />
<img src="image.jpg" alt="This is an image with a self-closing tag"/>
<img src="image.jpg" alt="This is an image with a self-closing tag">A common mistake is including a slash tag on a start tag, as in the following example. If the Nu HTML checker encounters that, it will ignore the slash and just treat the tag as a start tag.
<select />
<option value="1">one</option>
</select>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>