HTML Guide
A <pattern>
element has been found with an invalid ID. Check the format of the ID and ensure it does not start with a digit, full stop (.) or hyphen (-).
The <pattern>
element is used within <svg>
elements, which use XML 1.0 syntax. That syntax specifies that valid IDs only include designated characters (letters, digits, and a few punctuation marks), and do not start with a digit, a full stop (.) character, or a hyphen-minus (-) character.
Learn more:
Related W3C validator issues
The id attribute of an HTML element, used to identify the element when linking, scripting or styling, must be unique in the whole document and must not contain whitespace.
Technically, in HTML5, the value for an id attribute may contain any character, except whitespace characters. However, to avoid inadvertent errors, only ASCII letters, digits, _, and - should be used and the value for an id attribute should start with a letter.
The pattern attribute is only allowed on input whose type is email, password, search, tel, text or url. Check the type used, and consider changing to one of the allowed types to enable pattern client-side validation.
The pattern attribute is a handy way of adding client-side validation on HTML forms without resorting to JavaScript. Check out this article to learn more about Input Pattern.
The attribute xmlns:serif is not valid. Check this guide for more information on this issue.
Remove the xmlns:svg attribute from the <svg> element, leaving only the valid xmlns attribute.
The xmlns attribute defines the XML namespace for the SVG and is correctly set to http://www.w3.org/2000/svg. The xmlns:svg attribute attempts to declare a prefixed namespace, which is unnecessary and invalid in both HTML and SVG served as XML (or embedded in HTML). The W3C validator flags this because HTML5 does not allow arbitrary XML namespace declarations beyond the standard SVG namespace; such prefixes are not used in HTML serialization.
Incorrect usage:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<!-- SVG content -->
</svg>
Correct usage:
<svg xmlns="http://www.w3.org/2000/svg">
<!-- SVG content -->
</svg>
Only xmlns="http://www.w3.org/2000/svg" is required for inline SVG in HTML.
The “xmlns:o” attribute is not allowed because it is not part of the standard HTML attributes and typically appears due to improperly embedded XML or Office-related HTML content.
In HTML documents, the “xmlns” attribute is used to declare a namespace and is generally valid for certain elements when dealing with XML documents or XHTML. However, the “xmlns:o” attribute specifically relates to XML namespaces typically used in Microsoft’s Office XML formats (for example, when copying and pasting styled content from Word to an HTML editor). Since HTML5 doesn’t natively support these namespaces as valid HTML attributes and strictly validates against them, any non-standard attributes like “xmlns:o” generate validation errors.
To fix this issue, you should remove the “xmlns:o” attribute unless you are sure that it’s necessary for the function of your document, and the document should be processed in a way that supports such namespaces. If the content is not meant to include Office-specific data elements, it’s likely this attribute was accidentally included and can be safely removed.
Example of Incorrect HTML with “xmlns:o”
<!DOCTYPE html>
<html>
<head>
<title>Sample Document</title>
</head>
<body xmlns:o="urn:schemas-microsoft-com:office:office">
<p>This is a paragraph within a body tag falsely including an xmlns:o attribute.</p>
</body>
</html>
Corrected Example without “xmlns:o”
<!DOCTYPE html>
<html>
<head>
<title>Sample Document</title>
</head>
<body>
<p>This is a paragraph within a correctly structured HTML document.</p>
</body>
</html>
By removing the “xmlns:o” attribute, the HTML document complies with the W3C standards, leading to successful validation. If you require namespaces for XML processing, it’s essential to handle them outside the context of standard HTML or within an XML or XHTML document structure where such namespaces are appropriate and valid.
The attribute xmlns:serif is not a valid namespace. This attribute is set by Affinity Designer on SVG exports.
The xmlns:svg attribute is not allowed on the <svg> element in HTML5 and causes validation errors.
The SVG specification only requires the xmlns (not xmlns:svg) attribute for embedding SVG in HTML, and custom namespace prefixes like xmlns:svg are not needed or permitted in HTML5. The sole required namespace declaration is xmlns="http://www.w3.org/2000/svg". The xmlns:svg form was only used in extremely outdated XML-based workflows and has no place in current HTML.
Incorrect HTML Example:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<!-- SVG content here -->
</svg>
Correct HTML Example:
<svg xmlns="http://www.w3.org/2000/svg">
<!-- SVG content here -->
</svg>
In summary:
- Use only xmlns="http://www.w3.org/2000/svg" in inline SVG within HTML documents.
- Remove xmlns:svg and any other prefixed namespace attributes unless specifically required for XML workflows, not HTML.
The itemscope attribute is a boolean attribute in HTML5, which means it does not take any values. Adding any value (such as true or false) will cause an error. When using boolean attributes, they should either be present or absent. If an attribute like itemscope is present, it is considered true.
Here’s how to correct the error:
Incorrect Usage:
<div itemscope="true">
Correct Usage:
<div itemscope>
Explanation:
- Simply including the itemscope attribute without any value is the correct way to use it.
- If you don’t want to use the itemscope attribute, just remove it from the tag.
The value contact is not a valid option for the autocomplete attribute on an <input> element.
The type dob is not valid for an input. If you want to build a date picker field, you can use the native HTML input elements with type date, datetime-local, or a generic text input decorated with JavaScript and CSS.
In HTML, the type attribute for the <input> element specifies the type of input control that is to be displayed. The type attribute can have values like text, password, email, date, etc. Using an unsupported or invalid value like dob (which presumably stands for “date of birth”) will cause this validation error.
Here’s an example of how you can correct this issue by using a supported type attribute value for the date of birth input:
<label for="dob">Date of Birth:</label>
<input type="date" id="dob" name="dob">
In this corrected example, we’ve used the type="date" attribute value for the date of birth input. This is a valid type for handling dates in HTML forms. Replace the input type with a supported type according to the specific data you need to capture.
Alternatively you can use a JavaScript library to build a date picker on a generic text input. For example, the popular bootstrap-datepicker library will generate a date picker around a text input.