This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/.
This document summarizes design guidelines for authors who wish their XHTML or HTML documents to validate on either HTML or XML parsers, assuming the parsers to be HTML5-compliant. This specification is intended to be used by web authors. It is not a specification for user agents and creates no obligations on user agents. Note that this recommendation does not define how HTML5-conforming user agents should process HTML documents. Nor does it define the meaning of the Internet Media Type text/html. For user agent guidance and for these definitions, see [HTML5] and [RFC2854].
This document was published by the HTML working group as a Working Draft. This document is intended to become a W3C Recommendation. Please submit comments regarding this document by using the W3C's public bug database ( http://www.w3.org/Bugs/Public/) with the product set to HTML WG and the component set to HTML/XHTML Compatibility Authoring Guide (ed: Eliot Graff). If you cannot access the bug database, submit comments to firstname.lastname@example.org@w3.org (subscribe, archives) and arrangements will be made to transpose the comments to the bug database. All feedback is welcome.
Publication as a Working Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
This document was produced by a group operating under the 5 February 2004 W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.
This is a work in progress!
For the latest updates from the HTML WG, possibly including important bug fixes,
please look at the editor's draft instead.
This section is non-normative.
It is often valuable to be able to serve HTML5 documents that are also well formed XML documents.
An author may, for example, use XML tools to generate a document, and they and others may process the document using XML tools.
The language used to create documents that can be parsed by both HTML and XML parsers is called polyglot markup.
Polyglot markup is
the overlap language of documents that are both HTML5 documents and XML documents.
It is recommended that these documents be served as either
text/html (if the content is transmitted to an HTML-aware user agent)
application/xhtml+xml (if the content is transmitted to an XHTML-aware user agent).
Other permissible MIME types are
and any MIME type whose subtype ends with the four characters "
Polyglot markup results in:
xlink:href) attributes. XML requires and HTML5 permits these attributes in certain locations and the attributes are preserved by HTML parsers.
Polyglot markup is not constrained:
Polyglot markup is
scripted according to the rules of XML (does not use
document.write, for example)
and excludes HTML elements that are impossible to replicate in an XML parser (does not use the
noscript element, for example).
Polyglot markup triggers non-quirks mode in HTML parsers,
as non-quirks mode is closest to XML-mode rendering, in regard to both DOM and CSS.
Polyglot markup results in
the same encoding and the same language in both HTML-mode and XML-mode.
All web content need not be authored in polyglot markup. Polyglot markup is ideal for publishing when there's a strong desire to serve both HTML and XML tool chains without simultaneously having to maintain dual copies of the content: one in HTML and a second in XHTML. In addition, a single polyglot markup output requires less infrastructure to produce than to produce both HTML and XHTML output for the same content. Polyglot markup is also be beneficial when lightweight processes—such as quick testing or even hand-authoring—are applied to content intended to be published both as HTML and XHTML, especially if that content is not sent through a tool chain.
Processing Instructions and the XML Declaration are both forbidden in polyglot markup.
Polyglot markup uses the UTF-8 character encoding, the only character encoding for which both HTML and XML require support. HTML requires UTF-8 to be explicitly declared to avoid fallback to a legacy encoding [HTML5]. For XML, UTF-8 is an encoding default. As such, character encoding may be left undeclared in XML with the result that UTF-8 is still supported [XML10].
Polyglot markup declares the UTF-8 character encoding in the following ways, which may be used separately or in combination:
<meta charset="UTF-8"/>(the HTML encoding declaration).
"charset=utf-8"to the MIME/HTTP Content-Type header [HTTP11], as the following examples show in HTML and XML, respectively:
Content-type: text/html; charset=utf-8
Content-type: application/xhtml+xml; charset=utf-8
The HTML encoding declaration has no effect in XML. When the HTML encoding declaration is the only encoding declaration, the encoding default from XML makes XML parsers treat content as UTF-8.
The W3C Internationalization (i18n) Group recommends to always include a visible encoding declaration in a document, because it helps developers, testers, or translation production managers to check the encoding of a document visually.
DOCTYPEis in uppercase letters.
htmlis in lowercase letters.
SYSTEM, if present, is in uppercase letters.
PUBLIC, if present, is in uppercase letters.
about:legacy-compat, polyglot markup includes the string in lowercase letters, as required by HTML5.
Note that using
about:legacy-compat in XML may yield unpredictable parsing results, depending on the XML processing pipeline.
Polyglot markup does not use document type declarations for HTML4, HTML3, or HTML2, regardless of whether they contain a URI or not and regardless of their effect in HTML5 parsers, as these document type declarations are not compatible with XHTML.
The following rules apply to namespaces used in polyglot markup.
[HTML5] introduces undeclared (native) default namespaces for the root HTML element,
html, the root SVG element,
and the root MathML element,
declares the following default namespaces, when the markup languages
are included in the document, to maintain XML-compatibility [XML10]:
Polyglot markup declares the default namespaces on the root HTML element,
the root SVG element,
svg, and the root MathML element
and on any HTML elements used as children of SVG or MathML elements.
Polyglot markup does not declare any other default or prefixed element namespace, because
[HTML5] does not natively support the declaring of any other default or prefixed element namespace.
[HTML5] introduces undeclared (native) support for attributes in the XLink namespace and with the prefix
Polyglot markup declares the XLink namespace on the HTML root element (
once on the foreign element where it is used (
math), to maintain XML-compatibility [XML10].
In polyglot markup, the xlink prefix uses the namespace declaration
xmlns:xlink="http://www.w3.org/1999/xlink" before using the xlink prefix for the following attributes:
htmlelement or any other HTML element.
Note that there are other prefixed attributes that can be used beyond
xlink:href (such as
Polyglot markup does not declare these prefixes via xmlns. The prefixes are implicitly declared in XML and are automatically
applied to the appropriate attributes in HTML.
Polyglot markup conforms to the following rules regarding elements.
Every polyglot markup document contains an
html element is the root element.
body elements are children of the
title element is a child of the
Therefore, the following source code would be the most basic polyglot markup document.
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang=""> <head> <title></title> </head> <body> </body> </html>
Whenever it uses a
tr element, polyglot markup always wraps the
tr element inside a
In HTML, if a group of one or more adjacent
tr elements are not explictly wrapped inside a
the HTML parser creates and wraps a new
tbody element around the
XML parsers do not create the
tbody element, thus offering the potential for creating different DOMs.
<table> <tbody> <tr>...Incorrect:
Whenever it uses
col elements within a
table element, polyglot markup explicitly uses a
colgroup element surrounding groups of the
In HTML, if a group of one or more adjacent
col elements are not explicitly wrapped inside a
the HTML parser creates and wraps a new
colgroup element around the
XML parsers do not create the
colgroup element, thus offering the potential for creating different DOMs.
<table> <colgroup> <col>...Incorrect:
The following guidelines apply to any usage of element names, attribute names, or attribute values in markup, script, or CSS. Polyglot markup uses lower case letters for all ASCII letters. For non-ASCII letters—such as Greek, Cyrillic, or non-ASCII Latin letters—polyglot markup respects case sensitivity as it is called for.
Polyglot markup uses the correct case for element names.
Polyglot markup uses the correct case for attribute names.
definitionurl, which polyglot markup changes to the mixed case
For characters in attribute values, polyglot markup maintains case consistency between markup, DOM APIs, and CSS when these attributes are used on HTML elements.
Polyglot markup maintains case consistency for values on the following attributes, which occur on MIME types, language tags, charsets, booleans, media queries, and keywords. Though not required, an easy way to maintain case-consistency is to use only lower case values for these attributes. Polyglot markup maintains case consistency for these values because, for the purpose of selector matching, attribute values in XML are all treated case sensitively; however, HTML treats the values of these attributes as case insensitive (See 4.14.1 Case-sensitivity, in the HTML5 specification). [HTML5]
rel(for values that do not contain a colon)
target(keywords only; browsing context names are case-sensitive)
Note that other specifications, such as RDFa, may place additional restrictions on the allowed values of certain attributes.
Polyglot markup uses only the elements in the following list as void elements.
Polyglot markup uses the minimized tag syntax for void elements, e.g.
rather than the alternative syntax
Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph)
polyglot markup does not use the minimized form (e.g. the document uses
<p></p> and not
Note that MathML and SVG elements may be either self-closing or contain content.
The following elements or their considerations require exceptions to the general rules for polyglot markup.
The HTTP Content-Language: header warrants special discussion in polyglot markup.
Whenever there is an HTTP Content-Language: header (whose value is no more and no less than exactly one language tag),
polyglot markup declares both the
lang and the
xml:lang attributes on the root element.
For more information, see Language Attributes.
As a general practice and for the sake of expediency and simplicity, polyglot markup may always include
xml:lang as well as the
lang attributes on the root element.
HTTP Content-Type: header has no extra rules or restrictions,
whereas polyglot markup does not use the
http-equiv="Content-Type" declaration on the
For more specific information about using the
HTTP Content-Type: header, see Specifying a Document's Character Encoding.
Polyglot markup does not use newline characters within an attribute.
Within an attribute's value, polyglot markup represents tabs, line feeds, and carriage returns
as numeric character references rather than by using literal characters.
For example, within an attribute's value, polyglot markup uses
for a tab
rather than the literal character
This is because of attribute-value normalization in XML [XML10].
The following example uses numeric character references (escaped
characters) for the line feed, tab, and less-than characters within a
Because of attribute-value normalization in XML [XML10], polyglot markup
does not use newline characters within an attribute.
Practically speaking, for source code with newlines within attributes,
DOMs generated via XML and HTML will be different;
however, whitespace differences have no behavioral impact on the page
Note that newlines are overtly not allowed in the
title attribute or in any attribute containing a URI.
See also Attribute Values.
The following attributes are not allowed in polyglot markup. These attributes have effects in documents parsed as XML but do not have effects in documents parsed as text/html. The HTML5 spec therefore defines them as invalid in text/html documents. [HTML5]
Note that the
xml:base attributes are allowed on SVG and MathML elements.
When specifying the language mapping of an element, polyglot markup uses both the
Neither attribute is to be used without the other, and polyglot markup maintains identical values for both
Polyglot markup uses the language attributes in the
element to set the default language for the document overtly.
Although HTML5 sets the language of the root element via a fallback
language mechanism, this mechanism is not required to work in XML.
HTML5 activates the fallback language mechanism whenever the root element lacks language attributes.
For the mechanism to actually set a fallback language, however, it has to locate either an
http-equiv="Content-Language" declaration on the
HTTP Content-Language: header, either of whose content value is no more and no less than exactly one language tag.
Note that although the mechanism can locate either the meta element or the header, the meta element is considered first.
For more information about determining language in HTML5, see the language determination rules. [HTML5].
The following attributes or their considerations require exceptions to the general rules for polyglot markup.
Polyglot markup uses only the following named entity references:
For entities beyond the previous list, polyglot markup uses character references.
For example, polyglot markup uses
Note that polyglot markup may use decimal values for escape characters (such as   in the previous example);
however, the Character Model for the World Wide Web recommends
that content should use the hexadecimal form of character escapes rather than the decimal form when both are available. [CHARMOD]
Polyglot markup always uses character references for the less than sign (
<) and ampersand (
&) when they are used as characters,
except when those characters appear inside a CDATA section.
Polyglot markup includes script and style commands by linking to external files rather than including them in-line. Polyglot markup does not link to an external stylesheet by using the xml-stylesheet processing instruction. See also Processing Instructions and the XML Declaration.
The following examples show how polyglot markup includes external script and style, respectively:
<link rel="stylesheet" href="external.css"/>
document.writeln() are valid in an HTML document, neither function may be used in XHTML.
Therefore, neither is used in polyglot markup.
Instead, use the
innerHTML property for both HTML and XHTML.
Note that the
innerHTML property takes a string.
XML parsers parse the string as XML in XHTML.
HTML parsers parse the string as HTML in HTML.
Because of the difference in parsing, if you send the parser content that does not follow the rules for polyglot markup
the results will differ for a DOM create with an XML parser and one created with an HTML parser.
Polyglot markup uses external scripts if that document's script or style sheet uses
Note that XML parsers are permitted to silently remove the
contents of comments;
therefore, the historical practice of hiding scripts and style
sheets within comments to make the documents backward compatible is
likely to not work as expected in XML-based user agents.
When polyglot markup must use script or style commands within its source code, it uses safe content.
Safe content is content that does not contain a
The following example is safe because it does not contain problematic characters within the
The following example code acts as polyglot markup and validates as either XHTML or as HTML. You can view the page live at http://dev.w3.org/html5/html-xhtml-author-guide/SamplePage.html.
The example document is served as
Some legacy user agents do not support SVG in when served up as
'text/html' as it is in this example.
The example page could also be served as
'application/xhtml+xml' instead, with the file extension .html,
maintaining adherence to Polyglot markup and enabling the rendering of the SVG.
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>A Sample Page Using Polglot Markup</title> <!-- The link element is self-closing as described in Section 6.4 Void Elements --> <!-- Style commands are included by linking to an external file rather than including them in-line, as described in Section 9. Script and Style --> <link type="text/css" rel="stylesheet" href="Sample.css"/> </head> <body> <h1>Sample Page Using Polyglot Markup</h1> <p> The source code for this document uses polyglot markup, a document that is a stream of bytes that parses into identical document trees (with the exception of the xmlns attribute on the root element) when processed as HTML and when processed as XML. The source code for this document also contains additional comments about the use of polyglot markup. </p> <h2>Foreign Elements</h2> <p> The following shapes use SVG elements. Polyglot markup introduces undeclared (native) default namespaces for the the root SVG element (<svg>) and respects the mixed-case element names and values when appropriate, as described in sections 5.1 Element-Level Namespaces, 6.3.1 Element Names, and 6.3.3 Attribute Values. </p> <!-- Polyglot markup declares the xlink: namespace on the <svg> element to maintain XML-compatibility --> <svg width="350" height="250" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g> <title>Three SVG shapes</title> <desc> This SVG image contains an ellipse filled with a gradient that goes from white to blue as it moves outward from the center. A yellow rectangle with a black border overlaps the ellipse in the upper-left quadrant, and a red spiral on a white background overlaps the ellipse in the bottom-right quadrant. The red spiral is also a link to the example code for that SVG shape. </desc> <defs> <!-- Note that "radialGradient" and "myGradient" respect mixed-case values. --> <radialGradient id="myGradient" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(200,200,200); stop-opacity:0"/> <stop offset="100%" style="stop-color:rgb(0,0,255); stop-opacity:1"/> </radialGradient> </defs> <ellipse cx="50%" cy="50%" rx="50%" ry="42%" style="fill:url(#myGradient)"/> <rect x="0" y="0" width="100" height="100" style="fill: yellow; stroke: black;"/> <a xlink:href="http://www.w3schools.com/svg/tryit.asp?filename=path2&type=svg"> <!-- Note that the following attribute contains no newlines. --> <path transform="translate(60, -175)" d="M153 334 C153 334 151 334 151 334 C151 339 153 344 156 344 C164 344 171 339 171 334 C171 322 164 314 156 314 C142 314 131 322 131 334 C131 350 142 364 156 364 C175 364 191 350 191 334 C191 311 175 294 156 294 C131 294 111 311 111 334 C111 361 131 384 156 384 C186 384 211 361 211 334 C211 300 186 274 156 274" style="fill:white;stroke:red;stroke-width:2"/> </a> </g> </svg> <h2>Void Elements</h2> <!-- Given an empty instance of an element whose content model is not EMPTY (in this case, an empty paragraph) polyglot markup does not use the minimized form, as described in Section 6.4 Void Elements --> <p></p> <p> There is an empty <p> element before this paragraph. Polyglot markup uses <p></p> and not <p />. </p> <p> Polyglot markup treats certain elements as self-closing, void elements, such as the following <img> element. </p> <img height="48" width="72" alt="W3C" src="http://www.w3.org/Icons/w3c_home"/> <p> For more information, see Section 6.4 Void Elements. </p> <h2>Required Elements</h2> <p> The following table uses the required <tbody> element, as described in Section 6.1 Required Elements. </p> <table> <tbody> <tr> <th>Column One</th> <th>Column Two</th> </tr> <tr> <td>Row 1, Column 1</td> <td>Row 1, Column 2</td> </tr> <tr> <td>Row 2, Column 1</td> <td>Row 2, Column 2</td> </tr> <tr> <td>Row 3, Column 1</td> <td>Row 3, Column 2</td> </tr> </tbody> </table> <p> The following table uses the required <colgroup> element, as described in Section 6.1 Required Elements. </p> <table> <colgroup> <col style="background-color:silver"/> <col style="background-color:gray"/> <col style="background-color:yellow"/> </colgroup> <tbody> <tr> <th>ISBN</th> <th>Title</th> <th>Price</th> </tr> <tr> <td>3476896</td> <td>My first HTML</td> <td>$53</td> </tr> <tr> <td>1234567</td> <td>Intermediate Polyglot</td> <td>$49</td> </tr> </tbody> </table> <h2>Named Entity References</h2> <p> This paragraph uses the string "&" for ampersands ("&") and uses the string " " for a nonbreaking space between the words "polyglot markup," as described in Section 8. Named Entity References. </p> </body> </html>
Many thanks to Robin Berjon, David Carlisle, Daniel Glazman, Richard Ishida, Tony Ross, Sam Ruby, Jonas Sicking, Leif Halvard Silli, Henri Sivonen, Manu Sporny, and Philip Taylor. Special thanks to the W3C TAG and the W3C Internationalization (i18n) Core Working Group.
No informative references.