The differences between HTML and XHTML have been noted with a new list of deprecated items. Differences between HTML 4.01 and HTML5 less so. The following identifies one difference that shall affect numerous sites. It's images.
HTML 4.01 and HTML5 each define <image> in a similar manner. The difference occurs when HTML5 introduces “Embedded Content” which states,
- Embedded content
- Embedded content consists of elements that introduce content from other resources into the document, for example
img. Embedded content elements can have fallback content: content that is to be used when the external resource cannot be used (e.g. because it is of an unsupported format). The element definitions state what the fallback is, if any.
This study was performed after comparison of a case study page between (X)HTML5 Conformance Checking Service Technology Preview and W3C® Unicorn
“The Web’s Universal Conformance Checker - ALPHA Test Version”. It passed all W3C® image conformance variants but failed (X)HTML5’s. Test case was setup and run through the (X)HTML5 Conformance Checking Service. The Document Type Definition (DTD) was Markup Language specific, i.e., <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> and <!DOCTYPE html>.
[Note: The following addresses HTML5; not XHTML5. All HTML 4.01 text/html and XHTML 1.0 text/html documents are considered by Web Applications 1.0 to be HTML5.
1]
This—Then—is what occurred.
Relevant Code
<body>
<img src="http://www.menehune-foundry.com/images/zoetrope/small-hunting-snarks.jpg" »
alt="The Hunting of the Snark" width="180" height="255">
</body>
(X)HTML5 Conformance Errors
-
Error: Element
imgfrom namespacehttp://www.w3.org/1999/xhtmlnot allowed in this context.Line 8, column 140 in resource http://www.menehune-foundry.com/vague/HTML5-image.html
Corrections Made
<body>
<div>
<img src="http://www.menehune-foundry.com/images/zoetrope/small-hunting-snarks.jpg" »
alt="The Hunting of the Snark" width="180" height="255">
</div>
</body>
The img requires an embedding element as specified by the specification; it was set in a <div>.
It passed.
[Note: The above correction example is disingenuous. The Web Applications 1.0, 3.14. Embedded content, 3.14.1. The img element states that images are “Strictly inline-level embedded content” and
- “Contexts in which this element may be used:
- As the only embedded content child of a
figureelement.- Where strictly inline-level content is allowed.”
So, the Conformance Checker may be corrected. Or, not.]
However, if set-up HTML were pseudo real-world,
Relevant Code
<body>
<div>
<p>[ ... ]</p>
<img src="http://www.menehune-foundry.com/images/zoetrope/small-hunting-snarks.jpg" »
alt="The Hunting of the Snark" width="180" height="255">
</div>
</body>
The above failed.
(X)HTML5 Conformance Errors
-
Error: Element
imgfrom namespacehttp://www.w3.org/1999/xhtmlnot allowed in this context.Line 10, column 140 in resource http://www.menehune-foundry.com/vague/HTML5-image.html
This error is generated by the Conformance Checker due to its bimorphic model parsing wherein it assumes that since the image follows a paragraph the image should be an inline element and, therefore, embedded.
Corrections Made
The corrections as below.
Semantically.
<body>
<div>
<p>[ ... ]</p>
<p><img src="http://www.menehune-foundry.com/images/zoetrope/small-hunting-snarks.jpg" »
alt="The Hunting of the Snark" width="180" height="255"></p>
</div>
</body>
Unsemantically.
<body>
<div>
<p>[ ... ]</p>
<div><img src="http://www.menehune-foundry.com/images/zoetrope/small-hunting-snarks.jpg" »
alt="The Hunting of the Snark" width="180" height="255"></div>
</div>
</body>
Final Results
Semantically and Unsemantically.
“The document conforms to the machine-checkable conformance requirements for HTML5 (subject to the utter previewness of this service).”
I preferred unembedded images.
Update January 4, 2007
The (X)HTML5 Conformance Checking Service
has been changed. The <div> from the corrections made above will return an error:
-
Error: Element
imgfrom namespacehttp://www.w3.org/1999/xhtmlnot allowed in this context.Line 10, column 145 in resource http://www.menehune-foundry.com/vague/HTML5-image.html
- Web Applications 1.0, 1.4.1. HTML vs XHTML states,
“There are various concrete syntaxes that can be used to transmit resources that use this abstract language, two of which are defined in this specification.”
“The first such concrete syntax is “HTML5”. This is the format recommended for most authors. It is compatible with all legacy Web browsers. If a document is transmitted with the MIME type
text/html, then it will be processed as an “HTML5” document by Web browsers.”“The second concrete syntax uses XML, and is known as “XHTML5”. When a document is transmitted with an XML MIME type, such as
application/xhtml+xml, then it is processed by an XML processor by Web browsers, and treated as an “XHTML5” document. Generally speaking, authors are discouraged from trying to use XML on the Web, because XML has much stricter syntax rules than the “HTML5” variant described above, and is relatively newer and therefore less mature.”
