WHATWG Wiki - User contributions [en]

User:Brettz9

2013-02-21T01:44:26Z

Brettz9: +{{CC0 user}}

MetaExtensions

2012-08-19T09:32:43Z

Brettz9: /* Registered Extensions */ +"entity"

'''To create an account, please ask someone on [[IRC]] or e-mail [mailto:annevk@annevk.nl annevk@annevk.nl] or [mailto:ian@hixie.ch ian@hixie.ch]. We had to disable open signups because the level of spam became intolerable.'''

This page lists the allowed extension values for the name="" attribute of the <meta> element in HTML5. You may add your own values to this list, which makes them legal HTML5 metadata names. We ask that you try to avoid redundancy; if someone has already defined a name that does roughly what you want, please reuse it. Also, please be sure to include ''all'' the items [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#other-metadata-names required by the spec] ''including a link to a specification'' that specifies the keyword ''as an HTML meta keyword''. Note that URL-valued properties must not be registered as meta names but should be registered as [http://microformats.org/wiki/existing-rel-values#HTML5_link_type_extensions rel keywords] instead. Also note that changes to this registry may not be reflected in validators in real time.

== Registered Extensions ==

{| class="wikitable sortable"
! Keyword
! Brief description
! Link to specification
! Synonyms
! Status

|-valign="top"
| alexaverifyid
| Used to verify ownership of Alexa Search
| [http://www.alexa.com/faqs/?p=188 Alexa FAQ About this meta attribute Reference]
|
| Proposal

|-valign="top"
| tysontcsverid
| Used to verify ownership of Website for TCS webmaster tools
| [http://www.tysontcs.co.uk/Veridspec.html Livechat About this meta attribute Reference]
|
| Proposal

|-valign="top"
| apple-mobile-web-app-capable
| Sets whether a web application runs in full-screen mode.
| [http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html Apple Safari HTML Reference]
| Could maybe be assumed when <code>application-name</code> is set?
| Proposal

|-valign="top"
| apple-mobile-web-app-status-bar-style
| Sets the style of the status bar for a web application.
| [http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html Apple Safari HTML Reference]
|
| Proposal

|-valign="top"
| baiduspider
| Synonym of <code>robots</code> for targeting Baidu only.
| [http://www.baidu.com/search/robots_english.html Baidu documentation]
|
| Proposal

|-valign="top"
| citeseerxbot
| Synonym of <code>robots</code> for targeting CiteSeerX only.
| [http://csxstatic.ist.psu.edu/submit CiteSeerX Submit Documents] <small>'If you do not want your documents crawled by CiteSeerX, please use a robots.txt to disallow our crawler named "citeseerxbot"'</small>, [http://csxstatic.ist.psu.edu/about/crawler CiteSeerX Crawler]
|
| Proposal

|-valign="top"
| csrf-param
| Cross-site request forgery protection parameter for Ruby on Rails
| [http://apidock.com/rails/ActionView/Helpers/CsrfHelper/csrf_meta_tag Rails API]
|
| Proposal

|-valign="top"
| csrf-token
| Cross-site request forgery protection token for Ruby on Rails
| [http://apidock.com/rails/ActionView/Helpers/CsrfHelper/csrf_meta_tag Rails API]
|
| Proposal

|-valign="top"
| dc.date.issued
| Date of publication for Google News. The format of the content is YYYY-MM-DD or YYYY-MM-DDThh:mm:ssTZD.
| [http://www.google.com/support/news_pub/bin/answer.py?answer=93994 Google News documentation]
| <code><time pubdate></code>, <code>dcterms.issued</code>
| Proposal

|-valign="top"
| dc.language
| A language of the resource. Recommended best practice is to use a
controlled vocabulary such as RFC 4646 [RFC4646].
| [http://dublincore.org/documents/dcmi-terms/#terms-language DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| Redundant with the <code>lang</code> attribute on the
<code>html</code> element. (Browsers pay attention to the <code>lang</code> attribute but not <code>dc.language</code>)
<code>dc.language</code> is preferred by several web validators over <code>dcterms.language</code>
| Proposal

|-valign="top"
| dcterms.abstract
| A summary of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-abstract DCMI
Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.accessRights
| Information about who can access the resource or an indication of its security status.
| [http://dublincore.org/documents/dcmi-terms/#terms-accessRights DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.accrualMethod
| The method by which items are added to a collection.
| [http://dublincore.org/documents/dcmi-terms/#terms-accrualMethod DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.accrualPeriodicity
| The frequency with which items are added to a collection.
| [http://dublincore.org/documents/dcmi-terms/#terms-accrualPeriodicity DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.accrualPolicy
| The policy governing the addition of items to a collection.
| [http://dublincore.org/documents/dcmi-terms/#terms-accrualPolicy DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.alternative
| An alternative name for the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-alternative DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.audience
| A class of entity for whom the resource is intended or useful.
| [http://dublincore.org/documents/dcmi-terms/#terms-audience DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.available
| Date (often a range) that the resource became or will become available.
| [http://dublincore.org/documents/dcmi-terms/#terms-available DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.bibliographicCitation
| A bibliographic reference for the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-bibliographicCitation DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML element <code>cite</code>
| Proposal

|-valign="top"
| dcterms.conformsTo
| An established standard to which the described resource conforms.
| [http://dublincore.org/documents/dcmi-terms/#terms-conformsTo DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.contributor
| An entity responsible for making contributions to the content of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-contributor DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.coverage
| The spatial or temporal topic of the resource, the spatial applicability of the resource, or the jurisdiction under which the resource is relevant.
| [http://dublincore.org/documents/dcmi-terms/#terms-coverage DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.created
| Date of creation of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-created DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.creator
| An entity primarily responsible for making the resource. Examples of
a Creator include a person, an organization, or a service.
| [http://dublincore.org/documents/dcmi-terms/#terms-creator DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| In some cases redundant with the HTML built-in keyword
| <code>author</code> Proposal

|-valign="top"
| dcterms.date
| A point or period of time associated with an event in the lifecycle of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-date DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.dateAccepted
| Date of acceptance of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-dateAccepted DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.dateCopyrighted
| Date of copyright.
| [http://dublincore.org/documents/dcmi-terms/#terms-dateCopyrighted DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.dateSubmitted
| Date of submission of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-dateSubmitted DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.description
| An account of the resource. Description may include but is not
limited to: an abstract, a table of contents, a graphical representation, or a free-text account of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-description DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| HTML built-in keyword <code>description</code>
| Proposal

|-valign="top"
| dcterms.educationLevel
| A class of entity, defined in terms of progression through an educational or training context, for which the described resource is intended.
| [http://dublincore.org/documents/dcmi-terms/#terms-educationLevel DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.extent
| The size or duration of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-extent DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.format
| The file format, physical medium, or dimensions of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-format DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.hasFormat
| A related resource that is substantially the same as the pre-existing described resource, but in another format.
| [http://dublincore.org/documents/dcmi-terms/#terms-hasFormat DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML link type keyword "alternate" used with "link" element:<code>rel="alternate" type="URI of related resource"</code>
| Proposal

|-valign="top"
| dcterms.hasPart
| A related resource that is included either physically or logically in the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-hasPart DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.hasVersion
| A related resource that is a version, edition, or adaptation of the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-hasVersion DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML link type keyword "alternate" used with "link" element:<code>rel="alternate" type="URI of related resource"</code>
| Proposal

|-valign="top"
| dcterms.identifier
| An unambiguous reference to the resource within a given context.
| [http://dublincore.org/documents/dcmi-terms/#terms-identifier DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.instructionalMethod
| A process used to engender knowledge, attitudes and skills, that the described resource is designed to support.
| [http://dublincore.org/documents/dcmi-terms/#terms-instructionalMethod DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.isFormatOf
| A related resource that is substantially the same as the described resource, but in another format.
| [http://dublincore.org/documents/dcmi-terms/#terms-isFormatOf DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML link type keyword "alternate" used with "link" element:<code>rel="alternate" type="URI of related resource"</code>
| Proposal

|-valign="top"
| dcterms.isPartOf
| A related resource in which the described resource is physically or logically included.
| [http://dublincore.org/documents/dcmi-terms/#terms-isPartOf DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.isReferencedBy
| A related resource that references, cites, or otherwise points to the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-isReferencedBy DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.isReplacedBy
| A related resource that supplants, displaces, or supersedes the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-isReplacedBy DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.isRequiredBy
| A related resource that requires the described resource to support its function, delivery, or coherence.
| [http://dublincore.org/documents/dcmi-terms/#terms-isRequiredBy DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.issued
| Date of formal issuance (e.g., publication) of the resource. (DC
doesn't spec a date format but the established practice is
YYYY-MM-DD.)
| [http://dublincore.org/documents/dcmi-terms/#terms-issued DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| <code><time pubdate></code>
| Proposal

|-valign="top"
| dcterms.isVersionOf
| A related resource of which the described resource is a version, edition, or adaptation.
| [http://dublincore.org/documents/dcmi-terms/#terms-isVersionOf DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML link type keyword "alternate" used with "link" element:<code>rel="alternate" type="URI of related resource"</code>
| Proposal

|-valign="top"
| dcterms.language
| A language of the resource. Recommended best practice is to use a
controlled vocabulary such as RFC 4646 [RFC4646].
| [http://dublincore.org/documents/dcmi-terms/#terms-language DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| Redundant with the <code>lang</code> attribute on the
<code>html</code> element. (Browsers pay attention to the <code>lang</code> attribute but not <code>dcterms.language</code>)
| Proposal

|-valign="top"
| dcterms.license
| A legal document giving official permission to do something with the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-license DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML element <code>license</code>
| Proposal

|-valign="top"
| dcterms.mediator
| An entity that mediates access to the resource and for whom the resource is intended or useful.
| [http://dublincore.org/documents/dcmi-terms/#terms-mediator DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.medium
| The material or physical carrier of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-medium DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.modified
| Date on which the resource was changed. (DC doesn't spec a date
format but the established practice is YYYY-MM-DD.)
| [http://dublincore.org/documents/dcmi-terms/#terms-modified DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.provenance
| A statement for any changes in ownership and custody of the resource since its creation that are significant for its authenticity, integrity, and interpretation.
| [http://dublincore.org/documents/dcmi-terms/#terms-provenance DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.publisher
| An entity responsible for making the resource available.
| [http://dublincore.org/documents/dcmi-terms/#terms-publisher DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.references
| A related resource that is referenced, cited, or otherwise pointed to by the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-references DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.relation
| A related resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-relation DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.replaces
| A related resource that is supplanted, displaced, or superseded by the described resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-replaces DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.requires
| A related resource that is required by the described resource to support its function, delivery, or coherence.
| [http://dublincore.org/documents/dcmi-terms/#terms-requires DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.rights
| Information about rights held in and over the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-rights DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.rightsHolder
| A person or organization owning or managing rights over the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-rightsHolder DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.source
| A related resource from which the described resource is derived.
| [http://dublincore.org/documents/dcmi-terms/#terms-source DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.spatial
| Spatial characteristics of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-spatial DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.subject
| The topic of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-subject DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| HTML built-in keyword <code>keywords</code>
| Proposal

|-valign="top"
| dcterms.tableOfContents
| A list of subunits of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-tableOfContents DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.temporal
| Temporal characteristics of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-temporal DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.title
| A name given to the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-title DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
| The HTML element <code>title</code>
| Proposal

|-valign="top"
| dcterms.type
| The nature or genre of the resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-type DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| dcterms.valid
| Date (often a range) of validity of a resource.
| [http://dublincore.org/documents/dcmi-terms/#terms-valid DCMI Metadata Terms] mapped according to
[http://dublincore.org/documents/dc-html/ Expressing Dublin Core metadata using HTML/XHTML meta and link elements]
|
| Proposal

|-valign="top"
| designer
| Credits the designer(s) responsible for the visual presentation of a website.
| [https://sites.google.com/site/metadesignerspec/ Documentation]
|
| Proposal

|-valign="top"
| entity
| Allows for definitions of XML-style entities for substitution of references (defined as specially-named elements (e.g., use of data element and/or data-* attribute) or script tags) via inclusion of a JavaScript library. Library also supports inclusion of additional meta element entity definitions via iframe documents.
| [https://github.com/brettz9/js-css-entities Documentation]
|
| Proposal

|-valign="top"
| EssayDirectory
| Defines a custom description of websites listed in EssayDirectory.<br>Example:
<meta name="EssayDirectory" content="Helping students find legitimate essay services.">
| [http://essaydirectory.com/privacy-terms/#EssayDirectory_MetaExtension Documentation]
|
| Proposal

|-valign="top"
| publisher
| Searching for one content publisher's or page publisher's work requires a standard robot-parsable format for the information. This often differs from creator or author when the publisher is an institution. An institutional name, personal name, or other text entry is permissible.<br />One element represents only one publisher. Multiple publishers are to be represented with multiple tags, although multiple publishers are less common than multiple authors or creators; multiplicity is more likely for a legal name and a well-known name.<br />Search engines may index by any component of a name, so a publisher need only enter a name once in one order.
| defacto standard, used in nearly every website, e.g. [http://www.gaijin.at/olsmgen.php][http://developers.evrsoft.com/metagen.shtml][http://www.html-seminar.de/metatags.htm]
|
| Proposal

|-valign="top"
| review_date
| The date a resource is scheduled for review by content creator in order to determine if it should be archived, updated or retained as is.
| [http://www.hc-sc.gc.ca/home-accueil/alt_formats/pacrb-dgapcr/pdf/Metadata_Application_Profile_2009.pdf Health Canada Web Metadata Application Profile March 2009 ]
|
| Proposal

|-valign="top"
| es.title
| Object Title, where this is not the TITLE or H1 tag content, but the resource title
| [http://www.eibs.co.uk/reference/ EIBS EasySite CMS - Content Attributes Reference]
| dcterms.title
| Proposal

|-valign="top"
| format-detection
| Enables or disables automatic detection of possible phone numbers in a webpage in Safari on iOS.
| [http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html Apple Safari HTML Reference]
|
| Proposal

|-valign="top"
| geo.position
| Geographic position to which the page is related.
<meta name="geo.position" content="48.02682000000001;7.809769999999958">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]
| icbm (different value syntax)
| Proposal

|-valign="top"
| geo.country
| Case-insensitive ISO 3166-1 alpha-2 code of a country to which the page is related.
<meta name="geo.country" content="de">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]<br>[http://en.wikipedia.org/wiki/ISO_3166-2 ISO-3166-2]
|
| Proposal

|-valign="top"
| geo.a1
| National subdivision (state, canton, region, province, prefecture) of civil address to which the page is related. For resources within the US and Canada, corresponds to the common 2-character State/Province codes.
<meta name="geo.a1" content="AB">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]<br>RFC 4776
|
| Proposal
|-valign="top"
| geo.a2
| County, parish, gun (JP), district (IN) of civil address to which the page is related.
<meta name="geo.a2" content="Warwickshire">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]<br>RFC 4776
|
| Proposal
|-valign="top"
| geo.a3
| City, township, shi (JP) of civil address to which the page is related.
<meta name="geo.a3" content="Calgary">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]<br>RFC 4776
|
| Proposal

|-valign="top"
| geo.lmk
| A landmark or vanity address to which the page is related.
<meta name="geo.lmk" content="Auwaldstraße 11, 79110 Freiburg im Breisgau, Deutschland">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]
|
| Proposal

|-valign="top"
| geo.region
| Superseded by either geo.country alone or geo.country plus geo.a1. Name of geographic region to which the page is related. Content is specified by ISO-3166.
<meta name="geo.region" content="DE-BW">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]<br>[http://en.wikipedia.org/wiki/ISO_3166 ISO-3166]
|
| Proposal

|-valign="top"
| geo.placename
| Superseded by geo.lmk. Name of geographic place to which the page is related.
<meta name="geo.placename" content="London, Ontario">
| [http://tools.ietf.org/html/draft-daviel-html-geo-tag-08 IETF Draft]<br>[http://geotags.com/geo/geotags2.html GeoTags.com]
|
| Proposal

|-valign="top"
| google-site-verification
| Used to verify ownership for Webmaster Tools.
| [http://www.google.com/support/webmasters/bin/answer.py?hl=en&answer=79812 Google documentation]
|
| Proposal

|-valign="top"
| verify-v1
| Superseded by google-site-verification. Legacy verification for Google Sitemaps.
| [http://sitemaps.blogspot.com/2006/05/more-about-meta-tag-verification.html Inside Google Sitemaps: More about meta tag verification]
|
| Proposal

|-valign="top"
| googlebot
| Synonym of <code>robots</code> for targeting Googlebot only.
| [http://www.google.com/support/webmasters/bin/answer.py?hl=en&answer=93710 Google documentation]
|
| Proposal

|-valign="top"
| revisit-after
| revisit-after is used to tell search engines how often to recrawl the page. To our knowledge only one search engine has ever supported it, and that search engine was never widely used — at this point, it is nothing more than a good luck charm.
| [http://code.google.com/webstats/2005-12/metadata.html Google documentation]
|
| Proposal

|-valign="top"
| icbm
| Defines geographic position to which page is related to. The acronym stands for ICBM Intercontinental Ballistic Missile - an old, humorous allusion to the possible use of such coordinates.<br>Example:
<meta name="ICBM" content="47.0667, 15.4500" />
| [http://geourl.org/add.html GeoURL documentation]
| geo.position (different value syntax)
| Proposal

|-valign="top"
| HandheldFriendly
| Denotes handheld-friendly content
| [http://learnthemobileweb.com/tag/handheldfriendly/]
|
| Proposal

|-valign="top"
| markosweb.com/validation
| Used to verify ownership of Markosweb.com
| [http://www.markosweb.com/help/ownership/ Markosweb Validation Help]
|
| Proposal

|-valign="top"
| MobileOptimized
| Denotes content optimized for mobile browsers
| [http://learnthemobileweb.com/tag/mobileoptimized/]
|
| Proposal

|-valign="top"
| itemsPerPage
| Used to identify the number of search results returned per page.
| [http://www.opensearch.org/Specifications/OpenSearch/1.1#Response_metadata_in_HTML.2FXHTML OpenSearch Specification]
|
| Proposal

|-valign="top"
| msapplication-task
| '''"Jump List" or "Pinned Sites" in Windows 7'''
Jump List items act as entry points into the website even when the browser is not running. A Jump List can contain commonly used destinations and tasks. Some items apply to the whole site, and some apply only to specific users.
For example, to add a single task called "Check Order Status" specify a meta element in the head of your webpage, as follows:
<META name="msapplication-task" content="name=Check Order Status;
action-uri=./orderStatus.aspx?src=IE9;
icon-uri=./favicon.ico" />
| [http://msdn.microsoft.com/en-us/library/gg491725(v=vs.85).aspx Tasks in Jump List]
|
| Proposal

|-valign="top"
| msapplication-starturl
| '''"Jump List" or "Pinned Sites" in Windows 7'''
The "msapplication-starturl" metadata contains the root URL of the application. The start URL can be fully qualified, or relative to the current document. Only HTTP and HTTPS protocols are allowed. If this element is missing, the address of the current page is used instead.
<meta name="msapplication-starturl" content="./" />
| [http://msdn.microsoft.com/en-us/library/gg491732(v=VS.85).aspx Declaring Pinned Site Metadata]
|
| Proposal

|-valign="top"
| msapplication-tooltip
| '''"Jump List" or "Pinned Sites" in Windows 7'''
The "msapplication-tooltip" metadata provides additional tooltip text that appears when you hover over the Pinned Site shortcut in the Windows Start menu or on the desktop.
<meta name="msapplication-tooltip" content="Channel 9 Podcasts" />
| [http://msdn.microsoft.com/en-us/library/gg491732(v=VS.85).aspx Declaring Pinned Site Metadata]
|
| Proposal

|-valign="top"
| msapplication-navbutton-color
| '''"Jump List" or "Pinned Sites" in Windows 7'''
The "msapplication-navbutton-color" metadata define the custom color of the Back and Forward buttons in the Pinned Site browser window. Any named color, or hex color value is valid.
<meta name="msapplication-navbutton-color" content="#FF3300" />
| [http://msdn.microsoft.com/en-us/library/gg491732(v=VS.85).aspx Declaring Pinned Site Metadata]
|
| Proposal

|-valign="top"
| msapplication-window
| '''"Jump List" or "Pinned Sites" in Windows 7'''
The "msapplication-window" metadata sets the initial size of the Pinned Site window when it is launched for the first time. However, if the user adjusts the size of the window, the Pinned Site retains the new dimensions when it is launched again.
The following properties can be used in the value of the <code>content</code> attribute:
* width - The window width in pixels. The minimum value is 800.
* height - The window height in pixels. The minimum value is 600.
<meta name="msapplication-window" content="width=1024;height=768" />
| [http://msdn.microsoft.com/en-us/library/gg491732(v=VS.85).aspx Declaring Pinned Site Metadata]
|
| Proposal

|-valign="top"
| msvalidate.01
| One of the verification elements used by Bing.
| [http://onlinehelp.microsoft.com/en-us/bing/hh204490.aspx Bing Webmaster Tools]
|
| Proposal

|-valign="top"
| og:audio
| A URL to an audio file to accompany this object.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:description
| A one to two sentence description of your object.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:determiner
| The word that appears before this object's title in a sentence. An enum of (a, an, the, "", auto). If auto is chosen, the consumer of your data should chose between "a" or "an". Default is "" (blank).
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:image
| An image URL which should represent your object within the graph.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:locale
| The locale these tags are marked up in. Of the format language_TERRITORY. Default is en_US.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:locale:alternate
| An array of other locales this page is available in.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:site_name
| If your object is part of a larger web site, the name which should be displayed for the overall site. e.g., "IMDb".
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:title
| The title of your object as it should appear within the graph, e.g., "The Rock".
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:type
| The type of your object, e.g., "video.movie". Depending on the type you specify, other properties may also be required.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:url
| The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "http://www.imdb.com/title/tt0117500/".
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| og:video
| A URL to a video file that complements this object.
| [http://ogp.me/ The Open Graph protocol]
|
| Proposal

|-valign="top"
| norton-safeweb-site-verification
| Used to verify ownership of Website for Norton SafeWeb.
| [http://safeweb.norton.com/help/site_owners#verification_tips Norton SafeWeb Help Documentation]
|
| Proposal

|-valign="top"
| rating
| The Restricted to Adults label (RTA) provides a way for adult oriented websites to indicate that their content is off limits to children. RTA was introduced in 2006 and is currently used by a large number of adult web content providers. RTA is recognized by all major parental control filters.
Example:
<meta name="RATING" content="RTA-5042-1996-1400-1577-RTA" />
| [http://www.rtalabel.org/index.php?content=howto RTA documentation]
|
| Proposal
|-valign="top"
| referrer
| Controls whether the user agent includes the Referer header in HTTP requests originating from this document
| [http://wiki.whatwg.org/wiki/Meta_referrer Meta referrer]
|
| Proposal
|-valign="top"
| rights-standard
| The purpose is to enable search engines and other cataloging services to compile the types of rights allocated to the work. (Does any search engine actually implement this? [[User:Hsivonen|hsivonen]] 07:34, 14 July 2011 (UTC))

'''This keyword does not provide, remove or alter any legal protections or designations.'''

Format:
<pre><meta name="rights-standard" content="element id;rights" /></pre>

* element id - the HTML Element ID of the item these rights apply to
* rights - what rights are assigned to the item
** "pd" - Public domain
** "cc by-sa" - Creative Commons Attribution
** "cc by-nd" - Creative Commons NoDerivs
** "cc by-nc" - Creative Commons Attribution-NonCommercial
** "cc by-nc-sa" - Creative Commons Attribution-NonCommercial-ShareAlike
** "cc by-nc-nd" - Creative Commons Attribution-NonCommercial-NoDerivs

| [http://sites.google.com/site/metarightsstandard/ Spec]
|Redundant with [http://www.whatwg.org/specs/web-apps/current-work/multipage/microdata.html#licensing-works Microdata vocabulary for licensing works].
|Proposal

|-valign="top"
| robots
| A comma-separated list of operators explaining how search engine crawlers should treat the content. Possible values are "noarchive" to prevent cached versions, "noindex" to prevent indexing, and "nofollow" works as the link rel value with the same name. This meta name is already supported by every popular search engine.<br />The content value "NOODP" has been offered elsewhere, so I'm proposing it here. It blocks robots from using [http://www.dmoz.org Open Directory Project] descriptions of a website instead of Web pages' own meta descriptions. It may have been introduced by Microsoft.<br />The content value "NOYDIR" has been offered by Yahoo, so I'm proposing it here. It blocks Yahoo's robot from using the Yahoo directory's descriptions of a website instead of Web pages' own meta descriptions. Whether any other robot supports this is unknown but possibly no other search engine uses Yahoo's directory anyway.
| [http://www.robotstxt.org/wc/exclusion.html#meta Robots exclusion protocol], NOODP value: [http://www.google.com/support/webmasters/bin/answer.py?hl=en&answer=35264 Google], [http://help.yahoo.com/l/us/yahoo/search/indexing/indexing-11.html Yahoo], NOYDIR value: [http://ysearchblog.com/2007/02/28/yahoo-search-support-for-noydir-meta-tags-and-weather-update/ Yahoo], as accessed 4-28-09
|
| Proposal

|-valign="top"
| skype_toolbar
| Prevents the Skype browser extension from automatically seeking through the page and replacing telephone numbers (or any number the program's algorithm thinks is a telephone number) with its own custom presentation that allows direct invocation of the Skype program to call the telephone number.

Example:
<meta name="skype_toolbar" content="skype_toolbar_parser_compatible" />
| [http://skype.otherlinks.co.uk/page.asp?id=toolbar_number_formatting Skype Info]
|
| Proposal

|-valign="top"
| slurp
| Synonym of <code>robots</code> for targeting Yahoo! only.
| [http://help.yahoo.com/l/au/yahoo7/search/indexing/indexing-11.html Yahoo! documentation]
|
| Proposal

|-valign="top"
| startIndex
| Used to identify the index of the first search result in the current set of search results.
| [http://www.opensearch.org/Specifications/OpenSearch/1.1#Response_metadata_in_HTML.2FXHTML OpenSearch Specification]
|
| Proposal

|-valign="top"
| teoma
| Synonym of <code>robots</code> for targeting Teoma and Ask.com only.
| [http://about.ask.com/en/docs/about/webmasters.shtml Ask.com documentation]
|
| Proposal

|-valign="top"
| totalResults
| Used to identify the number of search results available for the current search.
| [http://www.opensearch.org/Specifications/OpenSearch/1.1#Response_metadata_in_HTML.2FXHTML OpenSearch Specification]
|
| Proposal

|-valign="top"
| <span id="viewport">viewport</span>
| Provides a way for documents to specify (using markup rather than CSS) the size, zoom factor, and orientation of the viewport that is used as the base for the document's [http://www.w3.org/TR/CSS21/visudet.html#containing-block-details initial containing block]. The following properties can be used in the value of the <code>content</code> attribute:
* width
* height
* initial-scale
* minimum-scale
* maximum-scale
* user-scalable
Examples:
<meta name="viewport" content="initial-scale=1.0">
<meta name="viewport" content="width=480, initial-scale=2.0, user-scalable=1">
For more details, see the [http://dev.w3.org/csswg/css-device-adapt/#viewport-meta-element Viewport META element] section of the [http://dev.w3.org/csswg/css-device-adapt/ CSS Device Adaptation] draft specification.
| For <code>meta</code> elements that have a <code>name</code> attribute whose value is <code>viewport</code>, the [http://dev.w3.org/csswg/css-device-adapt/ CSS Device Adaptation] draft specification defines the recognized properties for the <code>content</code> attribute>, as well as an algorithm for parsing the value of that attribute.
|
| Proposal

|-valign="top"
| wt.cg_n
| '''Name of the Content Group'''
Used to configure the appropriate Webtrends advanced feature. These are just some of the more popular ones. These appear in your META tags. – showing you the web page, the source (meta tag), the log files entry and the subsequent WT report.
Example:
<meta name="wt.cg_n" content="My content">
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| wt.cg_s
| '''Name of Content Sub-Group'''
Used to configure the appropriate Webtrends advanced feature. These are just some of the more popular ones. These appear in your META tags. – showing you the web page, the source (meta tag), the log files entry and the subsequent WT report.
Example:
<meta name="wt.cg_s" content="My content">
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| wt.ac
| '''Advertising Click parameter'''
When a visitor to your site clicks on an ad, that action is referred to as an Ad Click. The following META tag tracks advertising clicks:
<META NAME="WT.ac" CONTENT="name">
Defines the name of the advertisement clicked to reach a particular web page. The Ad Click must contain an external redirect back to the client. The redirect needs to include the necessary code to generate a hit to the SDC server. You can designate multiple Advertising Clicks using semicolons.
Examples:
<a href="file111.html?WT.ac=CONTENT111">
<a href="file222.html?WT.ac=CONTENT222">
The name of the advertisement clicked to reach a particular web page. To capture this information with DCS, the Advertising Click must contain an external redirect back to the client. The redirect needs to

include the necessary code to generate a hit to the DCS. The maximum length for each name is 64 bytes.
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| wt.ad
| '''Advertising View parameter'''
Visitors often view advertisements that they do not necessarily click on. You can use On-Site Advertising to determine the number of visitors to your web site who view particular ads. With this feature you can produce advertising reports for each of your clients.
If you are selling advertising space on your web site, for example, you can collect traffic statistics to help determine pricing schedules.
The following META tag tracks advertising views:
<meta name="WT.ad" content="My content">
An Ad View occurs when a visitor views a page containing an ad. An ad is a link or graphic that contains an Ad Click parameter in the query portion of it's URL.
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| wt.mc_id
| '''Identifies the ID of the marketing campaign'''
To attract new students, a university launches a marketing campaign by sending recruitment email to all graduating high school seniors in a metropolitan area. The email links to a special landing page in the university’s web site, containing the following META tag to track marketing campaigns.
Example:
<META NAME="WT.mc_id" CONTENT="1X2GG34">
You may use this parameter on the URL.
Example:
<a href="link?WT.mc_id=1X2GG34">
The Campaign ID 1X2GG34 represents recruits to be contacted by email
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| wt.sv
| '''Tracking Servers parameter'''
If your site is hosted on multiple servers, a server cluster, or a server farm, and you want to evaluate the performance of your load balancer, Webtrends can track page views for each server. To do so, populate the following META tag on all pages on each server:
Example:
<meta name="WT.sv" content="My Server">
Defines the name of the machine that serves the web page. If you have two servers (Server1 and Server2), you would make two copies of the META tag and designate CONTENT=“Server1” for deployment to pages on the first server and CONTENT=“Server2” for deployment to the same pages on the second server.
For a server farm, you can extract the value of the built-in server name and dynamically assign it to the
META tag using server-side scripting.
Example:
<meta name="WT.sv" content="Server1">
<meta name="WT.sv" content="Server2">
An Ad View occurs when a visitor views a page containing an ad. An ad is a link or graphic that contains an Ad Click parameter in the query portion of it's URL.
| [https://tagbuilder.webtrends.com/Help/Miscellaneous/AdSearch.aspx?keepThis=true&TB_iframe=true&height=450&width=650 About WT.ad].
|
| Proposal

|-valign="top"
| wt.ti
| '''Tracking Page Titles'''
You may want to modify a page title before sending it to Webtrends in the following cases:
* You are dealing with dynamic content pages identified by URL parameters, and the page title represents the title of the base URL page rather than the dynamic content page.
Unless you modify the page titles, all pages have the same title in the reports.
* All pages have been assigned the same title, for reasons of style or company policy.
Even though URLs are displayed in addition to page title, the entire URL cannot be depended upon to distinguish one page from another.
Use server-side scripts to change the title to something that reflects the content of the pages so that you can identify them in reports. Next, pass the customized page titles to Webtrends, using the following META tag:
<META NAME="WT.ti" CONTENT="title">
Defines the name of the title for this page.
| [http://product.webtrends.com/WRC/OnDemand/ResourceCenter/rc/Library/PDF/IGOD/WebTrendsAnalyticsOnDemandImplementationGuide.pdf Webtrends Parameters]
|
| Proposal

|-valign="top"
| y_key
| Used to verify ownership for Yahoo! Site Explorer
| [http://help.yahoo.com/l/us/yahoo/search/siteexplorer/siteexplorer-06.html Yahoo! documentation]
|
| Proposal

|-valign="top"
| yandex-verification
| Used to verify ownership for Yandex Webmaster.
| [http://help.yandex.ru/webmaster/?id=995300#995356 Yandex Webmaster ownership verification]
|
| Proposal

|-valign="top"
| globrix.instruction
| Globrix property information: Property to Buy or Rent
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.price
| Globrix property information: Price for the property
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.postcode
| Globrix property information: Postcode of the property
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.bedrooms
| Globrix property information: Number of bedrooms the property has
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.bathrooms
| Globrix property information: Number of bathrooms the property has
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.type
| Globrix property information: Type of property e.g. 'semi-detatched house'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.condition
| Globrix property information: Condition of the property e.g. 'renovated'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.features
| Globrix property information: Features of the property e.g. 'double glazing'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.outsidespace
| Globrix property information: External features of the property e.g. 'garden'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.parking
| Globrix property information: Parking available for property e.g. 'parking for 2 cars'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.period
| Globrix property information: Period of the property e.g. 'victorian terrace'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.poa
| Globrix property information: If the property price is only available on application
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.tenure
| Globrix property information: The tenure of the property e.g. 'leasehold'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.underoffer
| Globrix property information: Indicates if the property is under offer
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.priceproximity
| Globrix property information: The region of the attached price e.g. 'guide price of'
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.latitude
| Globrix property information: The latitude of the property
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| globrix.longitude
| Globrix property information: The longitude of the property
| [http://content.globrix.com/web-tools/8-technical-guide/74-what-are-globrix-meta-tags-and-how-can-i-use-them FAQ About the Globrix meta tags.]
|
| Proposal

|-valign="top"
| meta_date
| The date used to indicate that the Metadata has been prepared and/or reviewed and approved by the Metadata Unit. Its purpose is administrative. (Used by "Autonomy".)
| [http://www.hc-sc.gc.ca/home-accueil/alt_formats/pacrb-dgapcr/pdf/Metadata_Application_Profile_2009.pdf Health Canada Web Metadata Application Profile March 2009 ]
|
| Proposal

|-valign="top"
| Site-Type
| Used to define the body of the document content type offered
| [http://programadorweb.net.tc/?page_id=124 Information and values accepted by Metatag]
|
| Proposal

|-valign="top"
| wot-verification
| Used to verify ownership of WOT (Web Of Trust)
| [http://www.mywot.com/wiki/Verify_your_website WOT's verify your site wiki page]
|
| Proposal

|-valign="top"
| gwt:property
| Used to specify the locale client property
| [https://developers.google.com/web-toolkit/doc/latest/DevGuideI18nLocale Locales in GWT]
|
| Proposal

|-valign="top"
| mobile-agent
| Specifies the mobile-compatible url of the web page. Used by mobile browsers and search engines to redirect mobile phone visitors to the proper mobile page. <br>
The following properties can be used in the value of the content attribute:<br>url - The mobile-compatible url of the web page.<br>format - The format of the mobile page. An enum of "wml", "xhtml" and "html5".<br>Example:
<meta name="mobile-agent" content="format=html5; url=http://3g.sina.com.cn/">
| [http://open.shouji.baidu.com/?page=developer&action=pcandmo Baidu Mobile SEO]
|
| Proposal

|}

== Proposals that don't meet the [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#other-metadata-names requirements] for a registration ==

Note that these proposals can be moved back to the registry table if the problems listed in the rightmost column of this table are addressed.

{| class="wikitable sortable"
! Keyword
! Brief description
! Link to specification
! Synonyms
! Status
! Registration requirement failure

|-valign="top"
| gm-gpx-v
| Wordpress Plugin Google Maps GPX Viewer
| [http://wordpress.org/extend/plugins/google-maps-gpx-viewer/ Google Maps GPX Viewer]
|
| Incomplete proposal
| Claimed spec link is not a link to a spec

|-valign="top"
| og:title
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| og:type
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| og:url
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| og:image
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| og:site_name
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| fb:admins
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| og:description
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| fb:page_id
| Open Graph Protocol by Facebook developers
| [http://developers.facebook.com/docs/opengraph/ Facebook developers]
|
| Incomplete proposal
| The spec specifies this to be a value of the property attribute--not a meta keyword

|-valign="top"
| audience
| To aid search engines in classifying and to aid directory compilers, an audience most appropriate for the page may be suggested. Subject matter may not be a good clue; for example, an analysis of children's literature may be directed to teachers.<br />A value is free-form case-insensitive text without a comma. Multiple values are to be comma-separated. Singular and plural forms have the same meaning.<br />Recognized values:<br />-- "all" and "everyone", which have the same meaning<br />-- "adult" and "mature" have the same meaning and are for content that only adults may access, but no one responsible for preventing a nonadult or the immature from accessing the page or its content should rely on either or both of these values to do so without other means (not the same as "grownup", which see)<br />-- "child" and "juvenile", which have the same meaning<br />-- "teen"<br />-- "grownup" is not identical to "adult" or "mature" in not implying a precise boundary but is approximately any person who may be able to understand and apply the content (e.g., car driving instruction that may be read by a minor not yet old enough to drive a car but who would likely benefit from somewhat early exposure to the instruction)<br />-- "parent" to include guardian and temporary caregiver<br />-- "teacher" to include professor and ad hoc instructor<br />-- "elementary school student" to include any student below high school<br />-- "high school student"<br />-- "elhi" to include any student in elementary school through high school<br />-- "college student" including graduate and professional school<br />-- "business" including management, finance, and prospective customers (this includes e-commerce and investor sites)<br />-- "health" including any health care provider including alternative and ad hoc<br />-- "patient" for any health care recipient<br />-- "lawyer" including judge, paralegal, and jailhouse lawyer<br />-- "law client" for any prospective recipient of a lawyer's service (not usually a social work client) with ''lawyer'' including paralegal and jailhouse lawyer but not necessarily judge<br />-- "craft" for any craftworker including laborer and artisan<br />-- "artist" including musician, actor, dancer, and sculptor and including creator and performer<br />-- "military" including paramilitary<br />-- "news" including any consumer of rapidly-developing news<br />-- "introductory" and "beginner", which have the same meaning<br />-- "intermediate" and "midlevel", which have the same meaning<br />-- "advanced" and "advance", which have the same meaning<br />-- "scholarly" and "scholar", which have the same meaning<br />-- "popular" generally referring to a writing style<br />-- "older" including retiree<br />-- "institution" including from corporation to conspiracy (such as for management advice)<br />-- "government" including agencies and prospective politicians<br />-- values using any integer or single-digit decimal in the form of "grade 8" or "grade 6.4" including to refer to a reading comprehension level (this generally will not exceed 12 and might be meaningless above 20 so higher values may be interpreted as the highest meaningful value)<br />-- "viewers" for when content (such as a movie) is intended almost entirely to be seen rather than read<br />-- "listeners" for when content (such as music) is intended almost entirely to be heard rather than read but not generally including text-to-speech support<br />-- "tts", "text-to-speech", or "text to speech", which three have the same meaning and which are for a page that has substantial support for TTS or that will be readily understood through TTS without need for such support (TTS is often aided by, e.g., pre-resolving pronunciation ambiguities in page coding)<br />-- values using any numbers in the form of "3-6 years old", whether a range or a single-number value<br />-- values using any decade in the form of "born in 1970s"<br />Unrecognized values such as "botanists", "Texans", and "writers who use red ink" may be used but at a risk that a search engine or directory editor will either fail to recognize it or will interpret it in unpredictable ways, or will in the future.<br />Spellings that are erroneous or slightly different from a recognized value may be interpreted by a search engine or directory editor as representing a recognized value.<br />The absence of the keyword defaults to a value of "all" but without overriding another indication arrived at by other means.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| blogcatalog
| Used to verify ownership of Blog Catalog.com
| [http://www.blogcatalog.com/ Blog catalog site]
|
| Incomplete proposal
| Claimed spec link is not a link to a spec

|-valign="top"
| bot-. . .
| Robot owners, to allow page authors access to robotic capabilities, e.g., to deny them, should prefix "bot-" to the name of their robot, especially for proprietary bots.<br />Example: If a robot were to be named "dullbucklequiz", the name in the meta element would be "bot-dullbucklequiz".<br />The value "bot-" alone represents all bots so prefixed, like a wildcard.<br />Arguably, there's no need for a list here of any specific bots if http://user-agents.org or http://www.botsvsbrowsers.com/ (and perhaps other sites) is reliable.
|
|
| Incomplete proposal
| Lacks link to a spec, tries to register a space of names instead of enumerated names

|-valign="top"
| created
| The datetime at which the document was created. The value is an ISO8601 date. The date MUST follow the [http://www.w3.org/TR/NOTE-datetime W3C Profile of ISO 8601] with a granularity of "Complete date:" or finer. The [http://www.bbc.co.uk/guidelines/futuremedia/desed/previousversions/searchmetadata_vs_1_0.shtml#metadata BBC] use this name.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| creator
| The creator is an off-Web or pre-Web creator of a work for which an author authored a Web page, so that the creator and the author may be different people.<br />Searching for one content creator's work requires a standard robot-parsable format for the information. A personal name, institutional name, or other text entry is permissible.<br />One element represents only one creator. Multiple creators are to be represented with multiple tags.<br />Search engines may index by any component of a name, so a content creator need only enter a name once in one first-last or family-given order (e.g., Pat Thunderbird or Thunderbird, Pat, but not requiring both).
| [[Talk:MetaExtensions#Re:_Proposed_'creator'_MetaExtension|Talk]]
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| msnbot
| Synonym of <code>robots</code> for targeting Bing only.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| ia_archive
| Synonym of <code>robots</code> for targeting Internet Archive and Alexa only.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| datetime-coverage
| The author may be the best expert on which time frame is most relevant to the content. Leaving that to search engine analysis may be too chancy without search engine optimization, which analysis is difficult to apply by algorithm to, e.g., historical papers that may focus on the 1800s but mention 1731 and 1912 perhaps unimportantly.<br />The value for this keyword is a date or time -- not a range and not vague, for which other keywords are proposed -- in a format in accordance with http://www.w3.org/TR/NOTE-datetime (albeit a note that's at W3C only for discussion). Any of the six levels of granularity in that note are acceptable, such as expressing only a year.<br />Should this keyword appear more than once, all the values so appearing are determinative. Multiple values are to be expressed with separate meta elements lest the note be revised in the future in a way incompatible with comma-separating a list.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| property="og:*"
| Metadata used by the Open Graph protocol (used by Facebook). Note: currently these are defined as: <meta property="og.*" content="x"/>
| [http://developers.facebook.com/docs/opengraph/ FAQ About the Open Graph protocol from Facebook.]
|
| Doesn't belong in this registry
| Not a value to be used in the <code>name</code> attribute

|-valign="top"
| datetime-coverage-end
| This is identical to the keyword datetime-coverage except that it represents only the end. If this keyword is used without datetime-coverage-start (also proposed), its value is interpreted as ending a range without a start.<br />Should this keyword appear more than once, all the values so appearing are determinative, in which case each represents the end of a different range assumed to be nonnesting. Example: If four elements happen to be in the order of datetime-coverage-end=1865, datetime-coverage-start=1914, datetime-coverage-end=1918, and datetime-coverage-start=1862, assuming proper formatting, the ranges should be interpreted as 1862-1865 and 1914-1918.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| datetime-coverage-start
| This is identical to the keyword datetime-coverage except that it represents only the start. If this keyword is used without datetime-coverage-end (also proposed), its value is interpreted as starting a range without an end.<br />Should this keyword appear more than once, all the values so appearing are determinative, in which case each represents the start of a different range assumed to be nonnesting. Example: If four elements happen to be in the order of datetime-coverage-start=1862, datetime-coverage-start=1914, datetime-coverage-end=1865, and datetime-coverage-end=1918, assuming proper formatting, the ranges should be interpreted as 1862-1865 and 1914-1918.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| datetime-coverage-vague
| This is identical to the keyword datetime-coverage except that its value is not necessarily crisp. This keyword should be used only when datetime-coverage, datetime-coverage-start, and datetime-coverage-end are inappropriate, but there's no ban on using all four. Any text without a comma can be the value (e.g., Pleistocene, 1820s, Tuesdays, or before we were born); multiple values are comma-separated.<br />If this keyword is used with datetime-coverage, datetime-coverage-start, or datetime-coverage-end, the vague value should be exploited along with the value/s for the other keyword/s.<br />Should this keyword appear more than once, all are determinative.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| DC.
| Dublin Core, maintained by Dublin Core MetaData Initiative (DCMI), is an extensive system with some overlap with non-DC names.<br />This reserves all strings that begin with DC and a dot. ''Not true; DC-HTML doesn't use hardwired prefixes, but defines the prefixes using link/@rel="scheme.prefix"''
| [http://www.DublinCore.org DCMI]
|
| Incomplete proposal
| Tries to register a space of names instead of enumerated names

|-valign="top"
| dir-content-pointer
| When several pages in a directory include main content, a table of contents, an index, and the like, a search engine may be able to organize results more usefully by identifying which is which with a standard vocabulary, helpful when different publishers use different conventions when displaying or printing content.<br />A value is free-form case-insensitive text without a comma and optionally with a trailing number. Multiple values are to be comma-separated (multiple values are appropriate when one document serves multiple purposes). Singular and plural forms have the same meaning.<br />Recognized values, which are pointer types to which numbers may be suffixed, are limited to "start" meaning 'the first page that should be seen by a user' (this may be anywhere in the directory and anywhere within content), "toc" meaning 'table of contents', "intro" including introductions, forewords, prefaces, and tables of figures, "abstract", "main", "bibliography" and "biblio", which have the same meaning, "index" which may mean 'sitemap' or not, "afterword" and "update" which have the same meaning and need not actually update, "credit" meaning 'credits and acknowledgments', and "author bio" meaning 'author's biography', including any information about the author including credentials and contact information. The number suffix may be spaceless or not.<br />When numbers are suffixed, a search engine or directory should arrange like items in numerical order in the results, with unnumbered items following like items that are numbered, e.g., intro 1, intro 2, main 1, main 2, main, main, and so on.<br />Each directory and each subdirectory has its own sequence.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
|expires
|<code>meta name='expires'</code> defines the expiration date of the page. This can be used for web pages in preparation for an upcoming event, e.g. a registration form for an exposition or competition, or other cases with a pre-set date when the document will no longer be valid, e.g. a product offer in a special sale or a support page for a product known not to be supported anymore from a given time onward.

Search engines should respond to this meta tag in a reasonable way, i.e. by removing the page from their main search results after the expiration date (possibly still returning the result in a special search for expired pages as long as the page exists and is not explicitly excluded via <code>robots.txt</code> or <code>meta name='robots'</code> etc.) or simply by indicating to the user that this result is out-of-date.

The content attribute should define the expiration date in accordance with http://www.w3.org/TR/NOTE-datetime . The meta tag should not be used for pages without expiration date. However, for historical reasons, search engines should also interpret other date formats where possible and should be prepared to find values such as "", "0", "no" and "never". Such non-date values are to be interpreted as no expiration date.

Correctly formatted example:
<code><pre><meta name='expires' content='2012-12-31T23:59Z'></pre></code>

This tag is not to be confused with and has a different meaning than <code>meta http-equiv='expires'.</code>
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| format-print
| This is to allow a user agent to inform an operating system or a printer driver of the preferred print medium, such as the paper size.<br />A value is free-form case-insensitive text without a comma. Multiple values are to be comma-separated (multiple values might be appropriate because standard paper sizes vary around the world). Singular and plural forms have the same meaning.<br />Recognized values are limited to "letter", "A4", "legal", "A5", "B5", "monarch", "envelope 10" meaning size #10, "envelope 6-3-4" meaning size #6 3/4, values with integers and decimals in the form of "8.5 x 11" or "8.5x11" in which spacing of the "x" does not affect meaning, "paper", which means 'paper of the default color (usually white) and weight (usually 20-lb. stock)', "white", "yellow", "pink", "blue", "green", "violet", or "multicolor", which means a medium of the given color or mixed, "letterhead", "p2 letterhead" meaning 'letterhead intended for any page except the first', "watermark" meaning a 'special watermark such as an organization's own', and "plain" meaning 'not preprinted and not letterhead (it may have a paper manufacturer's watermark not related to letterhead)'.<br />Omitting "paper" when another recognized value is given defaults to an implied meaning of 'paper' with the other value; e.g., "letter" means 'letter paper'; the same principle applies to a medium's color (the default being white for paper and colorless for transparency) and plainness or lack thereof (the default being plain).<br />Other values should be proposed before being recognized here. Label sizes should be proposed here for labels that are not on backing sheets that fit one of the recognized values, e.g., labels on narrow rolls. Blueprint paper sizes should be proposed here. Media other than standard paper, such as onion skin, heavier paper, card, and clear or color transparency, should be proposed here.<br />The user agent may, with the user's or user sysadmin's permission (as by a menu-driven default), interpret a value to offer an alternative the user might accept and software and firmware other than the UA may interpret a value to the same end with or without permission, so this keyword is only suggestive; e.g., "letter" may be interpreted as "A4".<br />The absence of the keyword defaults to a value determined by other than the page, e.g., by the printer driver or the user agent.
| [[Talk:MetaExtensions#Re:_Proposed_'format-print'_MetaExtension|Talk]]
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| geographic-coverage
| The author may be the best expert on the geographic relevance of the content. Leaving that to search engine analysis may be too chancy without search engine optimization, which analysis is difficult to apply by algorithm to, e.g., historical papers and epidemiological studies which may mention locales only once.<br />Absence of the keyword defaults to a value of world (not universe), unless the search engine chooses to interpret the page or larger unit for some other value, probably based on other than just contact information given in the website.<br />The value for this keyword is a semicolon-separated list of one or more place-values, the order of which do not matter. One place-value will use commas to separate, in order, an optional standard natural language symbol applicable to the place-value (when omitted the language applicable to the page will control), a place-class, one or more place-subclasses if any, and one or more place name parts (where, e.g., in "Cape Town, South Africa", "Cape Town" is a place name part but "Town" is not). Spaces after semicolons and commas are optional; spaces within place-values are present when required for each place-value (e.g., "Quezon City", not an invented "QuezonCity").<br />To distinguish names that might otherwise be too similar, place-classes, all lower-case and hyphenatably spaceless, include ''outer-space'', ''region'' (on Earth and crossing or larger than a nation, e.g., southern hemisphere, polar region, temperate zone, or Asia), ''intntl-water'' (an 'international water body'), ''intntl-agcy'' ('international agency' or 'international collection', e.g., all U.N. member nations), ''nation'', ''within-nation'' (limited to only one political level down from nation, e.g., state, province, territory, possession, city not included within other political units of a nation, or any comparable unit), ''city'' (including town, village, hamlet, and any comparable political unit below the level of ''within-nation''), ''addr'' (including address, full-length street, building, institution, and neighborhood without political boundaries), ''pol-unit'' (''pol'' abbreviating 'political') (e.g., a place of disputed nationhood), ''hist-pol-unit'' (''hist'' abbreviating 'historical') (e.g., the Roman Empire), ''feature'' (e.g., river), ''num'' (e.g., latitude and longitude or outer-space equivalent in numbers), and ''ethereal'' (including thealogical/theological, fictional including from modern popular entertainment, and ancient secular mythical, but not including that which is asserted to be a state of mind or existence but not a place, such as nirvana). (Example for one hypothetical page: name="geographic-coverage" content="region, sub-Saharan Africa; nation, Panama; city, Panama, Panama; within-nation, Sao Paulo, Brazil; city, Sao Paulo, Sao Paulo, Brazil; within-nation, Mississippi, United States of America; region, Middle East; region, Midwest, United States of America; hist-pol-unit, Northwest Territory, United States of America; feature, river, Indus; outer-space, Indus; ethereal, ultima Thule; ethereal, Heaven; ethereal, Flatland; ethereal, Valhalla; en-US, addr, Hotel Valhalla, Fredrikstad, Norway; es, nation, Espana" (Indus is both a river and a constellation, illustrating the need for place-classes)).<br />Ambiguity of place-values should be avoided despite convenience in coding because search engines may each interpret them as they see fit, e.g., it would be hard for an engine to distinguish New York from New York.<br />For consistency of spelling, several authority lists should be settled upon, with legal, well-known, and disputed names and common abbreviations all being acceptable; but I'm not proposing one here now (relying on IANA's ccTLD list might be too complex to implement and still assure coding consistency, e.g., occasionally ccTLDs can be phased out and off of IANA's list) (a standard vocabulary possibly usable here is the [http://www.getty.edu/research/conducting_research/vocabularies/tgn/index.html Getty Thesaurus of Geographic Names Online], subject to licensing and charset choice); and promulgating authority lists may best be done publicly by search engine managements, who may disagree with each other.<br />Allowing Unicode for non-Roman alphabet-using locales is desirable, but at present that may raise technical problems, including computer security issues, that are not yet readily soluble.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| keywords-not
| A comma-separated list of negative keywords that distinguish a closely-related theme from this page's true theme, to support Boolean NOT searches often more realistically than visible text can, especially when both themes share the same lexicon.<br />If keywords is no longer a supported name for a meta element, keywords-not is superfluous; however, debate has been revived on whether keywords should be supported or not; see the keywords entry in this Wiki.
| [http://www.w3.org/Bugs/Public/show_bug.cgi?id=6609 W3C Bug 6609]
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| nextgen
| Used for nextgen gallery plugin in wordpress
| [http://www.alexa.com/faqs/?p=188 Alexa FAQ About this meta attribute Reference]
|
| Incomplete proposal
| Unrelated spec link

|-valign="top"
| page-datetime
| Better ranking in search engine results for recency or relevance to an event date would be aided by a standard format robots can parse. Users would save search time by not having to load many pages to find which ones are new or date-relevant.<br />To supply a consistent and known format, the value for this keyword is a date-time expression formed in accordance with http://www.w3.org/TR/NOTE-datetime (albeit a note that's at W3C only for discussion). Any of the six levels of granularity in that note are acceptable, such as expressing only a year.<br />Should this keyword appear more than once, only the first one so appearing is determinative.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| page-version
| Pages may be revised several times daily. While date-time given to a granularity of a fraction of a second would often suffice, when a page has to be approved more than once before posting, any or no such time may be correct (without this keyword, a comment could be necessary but probably not parsable by an engine). In addition, versions regardless of date may show consecutiveness and can replace a date that must be vague. In that case, a version number may be more useful for searches and so a robot-parsable format is needed.<br />The keyword's value is stated in ASCII digits, is any nonnegative base-10 rational number expressed as an integer or a decimal, with any number of decimal places allowed, and may be padded with any number of leading zeros to support extraction for ASCII sorting.<br />Should this keyword appear more than once, only the first one so appearing is determinative.<br />The versions 0 and 0.''n'', with ''n'' being to any number of places, signify beta versions, i.e., drafts, in the tradition of beta software, while versions 1 and higher ordinarily signify final-release versions. After a final-release version is released, a draft of a later version is not given a version number of 0 or 0.''n'', but is numbered higher than the last final-release version. It is suggested to page authors that draft status, if applicable, be shown in the visibly displayed text of the page, rather than that this meta tag be relied upon as the sole notice of draft status, as it may be inadequate notice if alone.<br />To assign a low page-version such as 0.''n'' or 1, the page's URL, if static, may be used as the relevant premise. Thus, if a page is copied or moved to a new URL, the author may choose to restart page-version numbering from 0.''n'' or 1. If a page's URL is dynamic, e.g., if created on the fly from a script, the page author may prefer to use as the relevant premise for assigning a low page-version such as 0.''n'' or 1 the URL of the script or other technology that generates the dynamic-URL page, placing this meta element containing this attribute within the script or other technology, not within the generating page's head element (the generating page's head element may have its own meta element with this attribute describing the generating page). If one page containing the script or other technology that generates another page has more than one means for generating dynamic-URL pages, each means should contain its own meta element with this attribute. Page-version is thus largely independent of the page's date, although both would likely advance roughly in parallel.
|
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| resolutions
| Authoring web sites to use resolution independent images that display beautifully on high-resolution displays should be made as easy as possible for developers and should not require JavaScript to accomplish.

To accomplish this, I propose a new HTML Meta Tag, <code>resolutions</code>, that can be used to specify that high-resolution versions of images linked to from the page are available and that the browser should use them in place of the lower-resolution default images if it detects that a user is using a high-resolution screen. The resolutions meta tag lists the device-pixel ratios supported by images in the page.

So, for example…

<code><pre><meta name="resolutions" content="2x"></pre></code>

… means that the developer is telling the browser that she has created 2x resolution images for the images linked to from the current page and named them with a @2x suffix.

To illustrate, if her image tag is as follows…

<code><pre><img src="/images/flower.jpg" alt="A flower"></pre></code>

… then she has two image files under /images: the low-resolution default (flower.jpg), and a higher-resolution (200%) version named flower@2x.jpg.

(This is the same naming convention already used by Apple in its Cocoa Touch framework for automatically loading in higher-resolution versions of images.)

Based on the meta tag, if the browser detects that the user is running at a <code>min-device-pixel-ratio</code> of 2.0, it will automatically ask for the 2x version of the image (flower@2x.jpg) instead of the default image as specified in the image tag.

Finally, so as not to flood external sites with high-resolution image requests, this functionality would only work for local images specified via relative links.

<b>Multiple resolutions</b>

The resolutions tag can also contain a list of supported device-pixel ratios so as to support even higher-resolution displays when and if they become available in the future.

For example:

<code><pre><meta name="resolutions" content="2x, 4x, 8x"></pre></code>

In this case, the developer would provide 2x, 4x, and 8x versions of all images. So, in the running example, she would make flower.jpg, flower@2x.jpg, flower@4x.jpg, and flower@8x.jpg.

<b>Advantages</b>

The advantages of this approach are several:

<ol>
<li>Makes it very simple for developers to support high-resolution displays like the iPhone 4's Retina screen</li>
<li>Does not require JavaScript</li>
<li>Does not change the default way that things work (if the meta tag is not specified, the browser simply behaves as it always has).</li>
</ol>

| [http://aralbalkan.com/3355 Proposal for native browser support of high-resolution image substitution]
[http://aralbalkan.com/3331 How to make your web content look stunning on the iPhone 4’s new Retina display]
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| rights
| As a page effectively appears in at least two forms, usually one as interpreted and displayed on a device and the other as source code, arguably intellectual property rights that must be asserted must be asserted in ways understandable in both contexts. For example, &copy; is a raw representation that may legally fail as part of copyright notice to someone seeing source code and not the display, important when someone wants to copy source code for use elsewhere and may rely on a defense of innocent infringement (at least in U.S.). While such assertions can be made in a comment element, it may be helpful to have a tag that search engines can parse and index verbatim.<br />The value may include standard and nonstandard notices, invocations of licenses such as GFDL and ASCAP, and any other information. Content is defined as free-form, leaving the page author discretion for the entry.<br />Statements in one tag may discuss several portions of the page differently, e.g., with different licenses.<br />More than one license may be offered, along with the page's relationship to all.<br />Not all statements need be license grants. A statement may state whom to ask for reprint permission or may reserve all rights, for example.<br />Only one meta tag with this keyword may be present. Page authors must not use more than one. A UA finding multiple such tags on one page must ignore all of them.<br />The copyright symbol that would be generated by its character entity is not recommended for legal notice in source code when the word 'Copyright' may be used instead, because the entity may be read in raw form, but use is up to the page author. The same concept applies to any intellectual property rights symbol for which a suitable alternative is available, such as for trademark or service mark.<br />ASCII text would not suffice when a name or notice legally may have to be in a non-Roman alphabet, but no alternative may yet exist in HTML5.<br />Search engine storage may impose a length limit, but, because of legal consequences, if the value's length exceeds a given limit the search index should retain or interpret none of it but only refer to it.<br />The content string may only be copied verbatim in its full length, referred to, or ignored. It may not be, for example, paraphrased, truncated, interpreted, or classified except in addition to being copied verbatim in its full length.<br />Ignoring shall not void, nullify, or alter any rights stated in such tag.<br />For the synonymy, ''IP'', ''IP-rights'', and ''IP-right'' are not reserved; while the abbreviation ''IP'' 'intellectual property' is common among attorneys in the U.S., page authors will more likely be computerate, and the abbreviation may be wanted for 'Internet Protocol'.
| [[Talk:MetaExtensions#rights:_why_reversion|Talk]]
|
| Incomplete proposal
| Lacks link to a spec

|-valign="top"
| subj-. . .
| To classify by subject a page's content, a standard subject taxonomy that will be recognized by a search engine or directory will help. Because many such high-quality taxonomies exist, only a prefix is proposed. Over time, particular taxonomies, in print or online, may be recognized here and keywords assigned for each.<br />The keyword will be constructed case-insensitively with subkeywords in the form subj-[nationAbbrev]-[taxonomy]-[edition][-optionalSubedition], e.g., subj-US-MeSH-2009online (perhaps). After "subj-", the second subkeyword will identify the nation where the taxonomy is published or offered as an aid in identifying the taxonomy and does not limit the subject coverage; e.g., a taxonomy published in Japan may be ideal for classifying Canadian botany or Peruvian economy.<br />As subject values may vary between editions of one taxonomy, an edition and optionally a subedition is to be identified in the third and optionally the fourth subkeywords. The subedition, if any, is any update or revision occurring between editions, such that a value drawn from that edition and subedition is stable. The means of identifying edition and subedition should be included in the registration of a keyword.<br />Examples of taxonomies from the U.S. include MeSH (medical) and the Library of Congress Subject Headings.<br />The value identifying a subject for a Web page will be drawn from the cited taxonomy's edition and subedition.<br />If the value should have a style to prevent ambiguity in interpretation, that style is to be registered here for that keyword. Multiple values are expressed with multiple meta elements, one value for each, since comma-separation is probably not compatible with all taxonomies.<br />If a value requires case-sensitivity to prevent confusion, the entry here registering the keyword must accommodate that need with the needs of HTML 5 with an appropriate rule. To that end, a proposal to allow case-sensitivity in meta tags under some circumstances has been offered in the W3C bug reporting system.
| [http://www.w3.org/Bugs/Public/show_bug.cgi?id=6854 W3C Bug 6854]
| subject-. . .
| Incomplete proposal
| Lacks link to a spec, tries to register a space of names instead of enumerated names

|-valign="top"
| nibbler-site-verification
| Used to verify ownership of Nibbler site
| [http://nibbler.silktide.com/ Nibbler site]
|
| Incomplete proposal
| Claimed spec link does not link to a spec

|-valign="top"
| MSSmartTagsPreventParsing
| Microsoft introduced into Internet Explorer 6 Beta a feature that some website designers wished to preclude from applying in order to prevent public misunderstanding of their websites. The feature allowed a browser to add information but at a risk that users wouldn't know that it wasn't supplied by the website. This keyword was provided by Microsoft for those of us who wanted it.<br />Its value was "TRUE". Microsoft spelled the keyword with some capitals and the value in all capitals but whether capitalization was required for either is unknown; some opinions vary. Since it need be understood by only one browser, and that one a beta version, full standards compliance should not be assumed, and original case may be required. (This tag is used by Google: "<meta content='true' name='MSSmartTagsPreventParsing'/>" appeared (with internal quote marks as singles) in the source code for <http://googleblog.blogspot.com/2009/04/listening-to-google-health-users.html>, as accessed 4-27-09.)<br />Microsoft has apparently removed this instruction from its website on the ground that the beta version is no longer available and is not supported, but that doesn't assure that some users aren't still using the beta browser, perhaps inadvertently. Therefore, designers may wish to continue using the keyword and value and they are preserved here.
| e.g., [http://www.theregister.co.uk/2001/06/25/web_sites_banish_those_winxp/ The Register (U.K.)], [http://cc.uoregon.edu/cnews/summer2001/summer2001.pdf Univ. Oregon (U.S.) (PDF p. 18)], & [http://trillian.mit.edu/~jc/demo/SmartTagsOff.html John Chambers (U.S.) (job résumé near root)], all as accessed 4-19-09
|
| Incomplete proposal
| Lacks spec, potentially never minted by MS as a meta name (as opposed to a http-equiv value), even if minted by Microsoft, abandoned before shipping in any final release of IE

|}

== Failed Proposals ==

{| class="wikitable sortable"
! Keyword
! Brief description
! Link to more details
! Synonyms
! Status

|-valign="top"
| cache
| This doesn't actually work; use HTTP headers instead.<br />Value must be "public", "private", or "no-cache". Intended as a simple way to tell user agents whether to store a copy of the document or not. An alternate for HTTP/1.1's cache-control; for publishers without access to modifying cache-control.
| none
|
| Unendorsed

|-valign="top"
| no-email-collection
| HTML5 prohibits URL-valued meta names. They should be rel keywords instead.<br />Intended to reference legal policy of web site indicating that harvesting of e-mail addresses on the site is not permitted and in violation of applicable laws such as the CAN-SPAM Act of 2003.
| [https://www.ProjectHoneyPot.org/how_to_avoid_spambots_5.php Project Honey Pot]
|
| Unendorsed

|}

== Process ==

For the "Status" section to be changed to "Ratified", the proposed keyword must be defined by a W3C specification in the Candidate Recommendation or Recommendation state. If it fails to go through this process, it is "Unendorsed".

For more details, see [http://whatwg.org/specs/web-apps/current-work/#concept-meta-extensions the HTML5 specification].

[[Category:Registries]]

HTML vs. XHTML

2011-08-21T12:41:12Z

Brettz9: /* Syntax and Parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data. An exception is made for foreign content such as SVG or MathML.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below or for SVG/MathML).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
| Unicode characters except for U+0000, non-characters, and control characters (besides space) characters.
| XML 1.0 only allows the following Unicode <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code>

XML 1.1 allows all Unicode (including all in 1.0) except for U+0000, U+FFFE, and U+FFFF (i.e., it allows <code>[#x1-#xFFFD], [#x10000-#x10FFFF]</code>)

Both XML 1.0 and 1.1 discourage control-characters and non-characters:

Discouraged in XML 1.0 only: <code>[#xFDE0-#xFDEF]</code> (spec typo?)

Discouraged in XML 1.1 only (these are not allowed at all in 1.0): <code>[#x1-#x8], [#xB-#xC], [#xE-#x1F]</code>

Discouraged in XML 1.0-1.1: <code>[#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|
| Use <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code> while avoiding <code>[#xFDE0-#xFDEF] (?), [#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace unless the elements genuinely have no namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T12:40:11Z

Brettz9: /* Syntax and Parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data. An exception is made for foreign content such as SVG or MathML.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below or for SVG/MathML).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
| Unicode characters except for U+0000, non-characters, and control characters (besides space) characters.
| XML 1.0 only allows the following Unicode <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code>

XML 1.1 allows all Unicode (including all in 1.0) except for U+0000, U+FFFE, and U+FFFF (i.e., it allows <code>[#x1-#xFFFD] | [#x10000-#x10FFFF]</code>)

Both XML 1.0 and 1.1 discourage control-characters and non-characters:

Discouraged in XML 1.0 only: <code>[#xFDE0-#xFDEF]</code> (spec typo?)

Discouraged in XML 1.1 only (these are not allowed at all in 1.0): <code>[#x1-#x8], [#xB-#xC], [#xE-#x1F]</code>

Discouraged in XML 1.0-1.1: <code>[#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|
| Use <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code> while avoiding <code>[#xFDE0-#xFDEF] (?), [#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace unless the elements genuinely have no namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T12:39:14Z

Brettz9: /* Syntax and Parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data. An exception is made for foreign content such as SVG or MathML.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below or for SVG/MathML).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
| Unicode characters except for U+0000, non-characters, and control characters (besides space) characters.
| XML 1.0 only allows the following Unicode <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code>

XML 1.1 allows all Unicode (including all in 1.0) except for U+0000, U+FFFE, and U+FFFF (i.e., it allows <code>[#x1-#xFFFD] | [#x10000-#x10FFFF]</code>)

Both XML 1.0 and 1.1 discourage control-characters and non-characters:
Discouraged in XML 1.0 only: <code>[#xFDE0-#xFDEF]</code> (spec typo?)
Discouraged in XML 1.1 only (these are not allowed at all in 1.0): <code>[#x1-#x8], [#xB-#xC], [#xE-#x1F]</code>
Discouraged in XML 1.0-1.1: <code>[#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|
| Use <code>#x9, #xA, #xD, [#x20-#xD7FF], [#xE000-#xFFFD], [#x10000-#x10FFFF]</code> while avoiding <code>[#xFDE0-#xFDEF] (?), [#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF]</code>
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace unless the elements genuinely have no namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T12:34:59Z

Brettz9: /* Syntax and Parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data. An exception is made for foreign content such as SVG or MathML.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below or for SVG/MathML).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
| Unicode characters except for U+0000, non-characters, and control characters (besides space) characters.
| XML 1.0 only allows the following Unicode #x9 | #xA | #xD | [#x20-#xD7FF] | [#xE000-#xFFFD] | [#x10000-#x10FFFF]

XML 1.1 allows all Unicode (including all in 1.0) except for U+0000, U+FFFE, and U+FFFF (i.e., it allows [#x1-#xFFFD] | [#x10000-#x10FFFF])

Both XML 1.0 and 1.1 discourage control-characters and non-characters:
Discouraged in XML 1.0 only: [#xFDE0-#xFDEF] (spec typo?)
Discouraged in XML 1.1 only (these are not allowed at all in 1.0): [#x1-#x8], [#xB-#xC], [#xE-#x1F]
Discouraged in XML 1.0-1.1: [#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF])
|
| Use #x9 | #xA | #xD | [#x20-#xD7FF] | [#xE000-#xFFFD] | [#x10000-#x10FFFF] while avoiding [#xFDE0-#xFDEF] (?) and [#x7F-#x84], [#x86-#x9F], [#xFDD0-#xFDDF], [#x1FFFE-#x1FFFF], [#x2FFFE-#x2FFFF], [#x3FFFE-#x3FFFF], [#x4FFFE-#x4FFFF], [#x5FFFE-#x5FFFF], [#x6FFFE-#x6FFFF], [#x7FFFE-#x7FFFF], [#x8FFFE-#x8FFFF], [#x9FFFE-#x9FFFF], [#xAFFFE-#xAFFFF], [#xBFFFE-#xBFFFF], [#xCFFFE-#xCFFFF], [#xDFFFE-#xDFFFF], [#xEFFFE-#xEFFFF], [#xFFFFE-#xFFFFF], [#x10FFFE-#x10FFFF])
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace unless the elements genuinely have no namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T12:01:55Z

Brettz9: /* Scripts */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace unless the elements genuinely have no namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T11:59:14Z

Brettz9: /* Scripts */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
!
|
|
|
|
|-
! DOM APIs and case sensitivity
| Some DOM APIs are case insensitive in HTML (which are sensitive?). (This does not apply to elements which are not in the HTML namespace.)
| DOM APIs are case sensitive in XHTML
|
| Use lower-case elements, attributes, and attribute values (or as appropriate with SVG camel-cased elements and attributes (and the "definitionURL" attribute should use proper casing when used in MathML)).
|-
! Element.tagName and Node.nodeName properties
| These properties return the value in uppercase in HTML. (Node.localName is consistent now, as of HTML5.)
| These properties return the value in lower-case in XHTML.
|
| For older browsers, compare after converting to lower case.
|-
! Document.createElement()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Element.setAttributeNode()
| Changes the attribute name to lowercase.
|
|
| Do not expect to use upper-case attribute names.
|-
! Element.setAttribute()
| Case insensitive
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.getElementsByTagName() and Element.getElementsByTagName()
| Case insensitive in HTML
|
|
| Use the canonical form, lowercase, for polyglot documents.
|-
! Document.renameNode()
| If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
|
|
| Do not expect to keep upper-case attribute names for HTML-namespaced elements after a rename.
|-
!
|
|
|
|
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:35:29Z

Brettz9: /* MIME Types */ clarification

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type (which may or may not be determined by file extension) that determines what type of document you are using. Any document served as <code>text/html</code>, including a document authored with the intention of being XHTML, is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:32:46Z

Brettz9: /* Syntax and Parsing */ fix table

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:31:47Z

Brettz9: /* Syntax and Parsing */ Fix table and add info on char. refs

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|
|-
! RCDATA elements
|
|
|
|
|-
! Foreign elements
|
|
|
|
|-
! Normal elements
|
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
| The 'x' in a hexadecimal character reference can be upper-case.
| The 'x' in a hexadecimal character reference cannot be upper-case.
|
| Only use the lower-case 'x' for hexadecimal character references.
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:28:02Z

Brettz9: /* Scripts */ periods

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML.
| These cannot be used in XHTML.
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used.
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace.
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:27:15Z

Brettz9: /* Scripts */ starting table

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>document.write()</code> and <code>document.writeln()</code>
| Available in HTML
| These cannot be used in XHTML
|
| Use DOM methods to replace or add content dynamically.
|-
! <code>innerHTML</code> property
| Any HTML can be used
| The use of this property requires that the string be a well-formed fragment of XML.
|
| Ensure one sets <code>innerHTML</code> to well-formed fragments.
|-
! Document.createElement() and namespaces
| In HTML, this will create an element in the HTML namespace.
| In XML (including true XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
| In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
| '''If operating within a browser which supports it, use Document.createElementNS to avoid the ambiguity.'''
|-
! XPath expressions
| In pre-HTML5 browsers, the XHTML namespace must be used for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)
| In XHTML, all XPath will require a namespace
|
| Detect whether the browser is pre-HTML5 and omit namespaces in XPath expressions if so (otherwise, use a namespace).
|}

* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:11:42Z

Brettz9: /* Stylesheets */ make into table

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML. Use DOM methods to replace or add content dynamically.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML. Ensure one sets <code>innerHTML</code> to well-formed fragments.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! CSS Selectors
| Match case insensitively in HTML.
| Match case sensitively in XHTML
|
| For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
|-
! Styling of html/body elements
| CSS requires special handling of the body element in HTML for painting backgrounds on the canvas
| XHTML does not require special handling.
|
| Style the html and body elements appropriately (?).
|}

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:08:43Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML. Use DOM methods to replace or add content dynamically.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML. Ensure one sets <code>innerHTML</code> to well-formed fragments.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML. For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* Style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T09:06:26Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====

{| class="wikitable" border="1"
|-
! Element(s)
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
! <code>script</code> and <code>style</code>
| In HTML, these are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML).
| In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
|
| '''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.
|-
! <code>title</code> and <code>textarea</code>
| In HTML, these elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML).
| There is no <code>RCDATA</code> in XML
|
| Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).
|-
! <code>noscript</code>
| In HTML, if scripting is enabled, this element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element.
| In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
|
| Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).
|-
! <code>iframe</code>, <code>noembed</code> and <code>noframes</code>
| In HTML, these elements are parsed as <code>CDATA</code> elements.
| In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
|
| '''Do not add content within these elements (or hide them on page load/DOMContentLoaded by JavaScript).'''
|-
! <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code> when appearing out of context
| In HTML, the tags for these elements, when appearing out of context, are ignored. (How so?)
|
|
| '''Do not use these elements out of context. In the case of <tr> directly inside a <table>, one may use an explicit tbody to avoid potential confusion.'''
|-
! <code>plaintext</code>
| This element has a special parsing requirement in HTML. (It is, however, forbidden.)
|
|
| '''Do not use plaintext.'''
|-
! <code>pre</code>, <code>listing</code> or <code>textarea</code>
| In HTML, a line feed that immediately follows any of these element's start tag is ignored.
| In XML, it is treated as other content.
|
| '''Add any line break before the element begins using HTML or CSS.'''
|-
! In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)
| These elements are void elements in HTML.
| In XHTML, these may use explicit closing tags as well as self-closing ones (just as non-void elements can).
|
| '''Do not use an explicit closing tag for these void elements to avoid double-inclusion when shown in HTML (and avoid self-closing tags on non-void elements which can sometimes accept content (such as <script>)).'''
|}

<em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML. Use DOM methods to replace or add content dynamically.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML. Ensure one sets <code>innerHTML</code> to well-formed fragments.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML. For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* Style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:30:30Z

Brettz9: /* Scripts */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML. Use DOM methods to replace or add content dynamically.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML. Ensure one sets <code>innerHTML</code> to well-formed fragments.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace.) Use lower-case (or as appropriate in SVG).
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5.) For older browsers, compare after converting to lower case.
** Document.createElement() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Element.setAttributeNode() will change the attribute name to lowercase. Do not expect to use upper-case attribute names.
** Element.setAttribute() is case insensitive. Use the canonical form, lowercase, for polyglot documents.
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive in HTML. Use the canonical form, lowercase, for polyglot documents.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place. Do not expect to use upper-case attribute names.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML. For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* Style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:16:39Z

Brettz9: /* Stylesheets */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML. For polyglot documents, use lower-case selectors or as appropriate (e.g., for SVG CamelCased items).
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* Style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:14:32Z

Brettz9: /* HTML Elements with Optional Tags */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

'''For polyglot texts, always use the start and ending tag (unless it is a void element, in which case, self-closing tags must be used).'''

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:12:51Z

Brettz9: /* Syntax and Parsing */ make possible exception to avoiding CDATA

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections (except possibly for script and style tags--see element-specific behavior below).'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:11:38Z

Brettz9: /* Element-specific parsing */ move underspecified item to end

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T08:10:36Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

'''The following code with escaping can ensure script and style elements will work in both XHTML and HTML, including older browsers.'''

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require them (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled. '''Add content to the page which should be shown when JavaScript is disabled and use JavaScript to hide these elements when the page has loaded (DOMContentLoaded can be used for modern browsers).'''
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used. '''Do not add content for these elements or hide them by JavaScript.'''
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>. '''Do not use these elements out of context.'''
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation). '''One may use an explicit tbody to avoid potential confusion.'''
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.) '''Do not use plaintext.'''
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored. '''Add line breaks before the element using HTML or CSS.'''
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>). '''Always use the self-closing version of these tags to avoid double-inclusion in HTML.'''

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T07:53:45Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

The following ensures script and style elements will work in both XHTML and HTML, including older browsers.

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use &amp; and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''.
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T07:52:32Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

The following ensures script and style elements will work in both XHTML and HTML, including older browsers.

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML). '''Use & and &lt; escape forms (and "]]&gt;" if the sequence "]]>" is required) within these elements even though HTML does not require (CDATA sections apparently cannot be added here in a polyglot-supportive fashion).'''.
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T07:28:54Z

Brettz9: /* Element-specific parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).

The following ensures script and style elements will work in both XHTML and HTML, including older browsers.

In both cases, XML ignores the first comment and then uses the CDATA section to avoid the need for escaping special characters < and & within the rest of the contents (with subsequent JavaScript comments added within to ensure the HTML-oriented code is ignored by JavaScript).

In HTML, older browsers might display the content without the content being within a comment, so comments are used to hide this from them (while modern HTML browsers will run code inside the comments). The subsequent JavaScript comment is added to negate the text added for the sake of XHTML.

The <style> requires the /**/ comments since CSS does not support the single line ones.

'''<script type="text/javascript"><![CDATA[//><!]]></script>

<style type="text/css"><![CDATA[/*></style>'''

If not concerned about much older browsers (from which one is hiding the HTML) one can use the simpler:

<script>//<![CDATA[

//]]></script>

<style>/*<![CDATA[*/

/*]]>*/</style>

Also note that the sequence "]]>" is not allowed within a CDATA section, so it cannot be used in true XHTML-embedded JavaScript without escaping.

* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-08-21T06:56:31Z

Brettz9: /* Element-specific parsing */ link and meta allowed in body now

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>, and now also <code>link</code> and <code>meta</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dd
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2011-05-02T02:16:46Z

Brettz9: /* Differences Between HTML and XHTML */ +w3c link

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

The document at http://dev.w3.org/html5/html-xhtml-author-guide/html-xhtml-authoring-guide.html provides a similar analysis.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T08:25:48Z

Brettz9: /* Syntax and Parsing */ +element content

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values (or elements with exclusively element content) in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T08:10:19Z

Brettz9: /* Syntax and Parsing */ empty namespaced elements in HTML guidance

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>. You should explicitly close (not self-close) all empty elements defined in a non-XHTML namespace, since otherwise when used in HTML, HTML will treat them as though they have not been closed.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T08:07:51Z

Brettz9: /* Syntax and Parsing */ namespaced elements are non-void as far as HTML is concerned

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements (and be aware that self-closing elements cannot be used as such since unrecognized elements will be treated as though they are non-void; thus one cannot, for example, type <code><caesura /></code> in HTML or it will be treated as though there is no immediate closing tag). Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T08:03:02Z

Brettz9: /* Syntax and Parsing */ non-namespaced, non-HTML attributes

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements. Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value).
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes. Non-namespaced attributes not belonging to HTML will be included in the DOM tree and accessible to script and stylesheets, but it is discouraged to use these due to the potential for future naming conflicts; <code>data-</code> attributes can be used instead, or if in an XML-only environment, namespaced attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:56:06Z

Brettz9: /* Syntax and Parsing */ +prefixing of XHTML elements

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements. Namespaced prefixes are not allowed on HTML elements; a prefixed xmlns attribute cannot be used even if it is defined in the XHTML namespace.
| The XHTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly and do not prefix XHTML elements. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:50:05Z

Brettz9: /* Element-specific parsing */ rmv on optional tags as in tables

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:48:09Z

Brettz9: /* Element-specific parsing */ void elements already in table

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* The following are void elements in HTML (see void elements in table): In head (<code>base</code>, <code>link</code>, <code>meta</code>), in body (<code>area</code>,<code>br</code>, <code>col</code>, <code>embed</code>, <code>hr</code>, <code>img</code>, <code>input</code>, <code>param</code>)

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:45:34Z

Brettz9: /* Element-specific parsing */ such as?

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em> (such as?)
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:44:31Z

Brettz9: /* Syntax and Parsing */ xlink

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
| '''Do not use XLink attributes on HTML elements and do not depend on them on foreign elements as will not work as such in HTML.''' If being used, ensure they have the appropriate XLink namespace defined.
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:41:43Z

Brettz9: /* Syntax and Parsing */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML and thus trigger no quirks parsing.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:41:05Z

Brettz9: /* Syntax and Parsing */ +guidance on quirks mode

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string, respectively.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
| '''Use an explicit <code><!DOCTYPE html></code> (case insensitively) or legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code> for the sake of HTML.'''
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:37:35Z

Brettz9: /* Stylesheets */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.
* For polyglot documents, use lower-case element selectors and style the html and body elements appropriately (?).

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:35:54Z

Brettz9: /* Scripts */ localName

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase in HTML but lower-case in XHTML (Node.localName is consistent now, as of HTML5).
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:30:08Z

Brettz9: /* Syntax and Parsing */ sp.

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hyphen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:27:51Z

Brettz9: /* Syntax and Parsing */ comment & proc. inst guidance

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>" (bogus comments such as those beginning with "<?" are deprecated). The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
| Only use comments of the "<code></code>" variety. Do not use two consecutive U+002D HYPHEN-MINUS (-) characters in comment content or end with such a hyphen (especially for the sake of XML). '''Do not begin comments with a single U+003E GREATER-THAN SIGN ('>') character, nor with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character.'''
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely). Processing instructions might need to be avoided entirely in case HTML may in future disallow them completely.'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:18:02Z

Brettz9: /* Syntax and Parsing */ namespaces

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaced elements
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm. Elements in the HTML, SVG, or MathML namespaces may have an <code>xmlns</code> attribute explicitly specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the xmlns attribute itself ends up in no namespace. Foreign elements are also not treated as being in another namespace and will have no effect except for displaying by default as inline elements.
| The HTML namespace must be declared for HTML elements according to the rules defined by the ''[http://www.w3.org/TR/REC-xml-names/ Namespaces in XML]'' specification. Namespaces must be explicitly declared. The <code>xmlns</code> attribute ends up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace. Foreign elements can be used independently of HTML elements, as long as they are assigned to their own namespace.
|
| Declare HTML namespaces (or other namespaces) explicitly. '''Do not depend on the behavior of foreign namespaced elements in an HTML setting; if you need to include these, you will probably wish to set this foreign markup via CSS to <code>display:none</code>.'''
|-
!Namespaced attributes on HTML elements
| Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
| The <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
| '''Do not use namespaced attributes on HTML elements. Do not depend on the behavior of foreign attributes in an HTML setting.'''
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:05:33Z

Brettz9: /* Markup */ rmv now included section

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T07:05:27Z

Brettz9: /* Syntax and Parsing */ +namespace and further encoding info

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8 (and included in the first 512 bytes of the document), in which case it is probably a good idea to include it for the sake of HTML (as <nowiki><meta charset="UTF-8"></nowiki>) in case you cannot specify such in a content header.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code> (see [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration]). The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T06:53:35Z

Brettz9: /* Overlap Language */

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents. Guidelines are listed below for how one can construct such a polyglot document which will work in either environment. Besides following the well-formedness rules of XML, there are some other restrictions to which one must adhere (for the sake of text/html documents).

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8, in which case it is probably a good idea to include it for the sake of HTML.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code>. The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T06:49:03Z

Brettz9: /* Character Encoding */ remove now already included section

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents.

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8, in which case it is probably a good idea to include it for the sake of HTML.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code>. The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T06:48:27Z

Brettz9: /* Syntax and Parsing */ move to correct section

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents.

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>.
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8, in which case it is probably a good idea to include it for the sake of HTML.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code>. The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Character Encoding ===

* In XHTML, the XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding]. In HTML, the XML declaration is forbidden
* In HTML, the <code>meta</code> element with a <code>charset</code> attribute may be used instead. It is forbidden in XHTML unless it specifies 'UTF-8' (case insensitively) and is ignored if included.
* The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>. If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T06:47:42Z

Brettz9: /* Syntax and Parsing */ remove list bullet

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents.

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>. If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8, in which case it is probably a good idea to include it for the sake of HTML.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code>. The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Character Encoding ===

* In XHTML, the XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding]. In HTML, the XML declaration is forbidden
* In HTML, the <code>meta</code> element with a <code>charset</code> attribute may be used instead. It is forbidden in XHTML unless it specifies 'UTF-8' (case insensitively) and is ignored if included.
* The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>. If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]

HTML vs. XHTML

2010-06-26T06:47:00Z

Brettz9: /* Syntax and Parsing */ encoding

== Differences Between HTML and XHTML ==

<p style="border: 1px dashed lightgray; background-color: #FFEEEE; padding: .5em 1em;"><strong>This page is currently being revised. Some information is incomplete or missing.</strong></p>

<p style="border: 1px dashed lightgray; background-color: #FFF8E4; padding: .5em 1em;">Please note that the information in here is based upon the current spec for (X)HTML5. Some of the issues technically do not apply to previous versions of HTML.</p>

Although HTML and XHTML appear to have similarities in their syntax, they are significantly different in many ways.

:'''Note''': As the current WHATWG document is a draft, this section will need to track to a moving target.

=== Overlap Language ===

There is a community who find it valuable to be able to serve HTML5 documents which are also valid XML documents. They may, for example, use XML tools to generate the document, and they and others may process the document using XML tools. These documents are served as text/html.

This language is sometimes called "polyglot". It is the overlap language of documents which are both HTML5 documents and XML documents.

This wiki web page is an example of such a document. You can parse it with an XML parser or an HTML parser.

=== MIME Types ===

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
|-
| Mime Type
| Must use <code>text/html</code>.
| Must use an XML MIME type, such as <code>application/xml</code> or <code>application/xhtml+xml</code>.
| It is the MIME type that determines what type of document you are using. Any document, including a document authored with the intention of being XHTML, served as <code>text/html</code> is technically an HTML document.
|}

Note that XHTML 1.0 previously defined that documents adhering to the compatibility guidelines were allowed to be served as <code>text/html</code>, but HTML 5 now defines that such documents are HTML, not XHTML.

=== Syntax and Parsing ===

XHTML uses XML parsing requirements. HTML uses its own which are defined much more closely to the way browsers actually handle HTML today. The following table describes the differences between how each is parsed.

The column on "Guidance for XHTML-HTML compatibility" lists ways in which a document can be crafted to work in either XHTML or HTML. The item will be bolded if it is a requirement for XHTML-compliant code to be changed, since XHTML will otherwise usually work as HTML, at least if its full features are constrained.

{| class="wikitable" border="1"
|-
! Feature
! HTML Requirement
! XHTML Requirement
! Notes
! Guidance for XHTML-HTML compatibility
|-
!Parsing Modes
|Three parsing modes are defined: ''no quirks mode'', ''quirks mode'' and ''limited quirks mode''. The mode is only ever changed from the default by the HTML parser, based on the presence, absence, or value of the DOCTYPE string.
|XML parsing rules are used. There is only one mode.
|The parsing modes in HTML also have an effect upon script and stylesheet processing. XHTML is considered to be in ''no quirks mode'' for these purposes.
|-
!Error Handling
|HTML does not have a well-formedness constraint, no errors are fatal. Graceful error handling and recovery procedures are thoroughly defined.
|Well-formedness errors are fatal
|
| Ensure there are no well-formedness errors.
|-
! Character Encoding (including XML Declaration, <code>meta</code>)
| The XML declaration is forbidden (treated as a bogus comment, but such style of comments are deprecated), but the <code>meta</code> element with a <code>charset</code> attribute may be used instead.
| The XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding], while <code>meta</code> is only allowed as case-insensitive "UTF-8" (and is ignored if included).
* The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>. If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).
|
| '''If you need to include XML 1.1-only markup, if you do not wish to convert the encoding of the document to UTF-8 or UTF-16 (since use of other encodings also requires a declaration), or if you wish to define an external SYSTEM DTD in the DOCTYPE but use standalone=yes (redundant?), you must use an XML Declaration for XHTML, but this may not be allowable in the future in HTML. For future compatibility, it would be best to avoid XML 1.1-only markup, convert to UTF-8 or UTF-16 (probably UTF-8 which could allow use of a <code>meta</code> tag), and avoid use of a SYSTEM DTD (rendering the standalone=yes unnecessary), respectively. Do not use a <code>meta</code> tag, unless it is UTF-8, in which case it is probably a good idea to include it for the sake of HTML.'''
|-
!Namespaces
|Elements and attributes for known vocabularies (HTML, SVG and MathML) are implicitly assigned to appropriate namespaces, according to the rules specified in the parsing algorithm.
|The rules defined in the [http://www.w3.org/TR/REC-xml-names/ Namespaces in XML] specification apply. Namespaces must be explicitly declared.
|
|-
!Namespace attributes on HTML elements
|Elements in the HTML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xhtml"</code>. The attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in no namespace.

Attributes of the form <code>xmlns:<var>prefix</var></code> may not be used on HTML elements.
|The HTML namespace must be declared for HTML elements according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!Namespace attributes on foreign elements
|
Elements in the SVG namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/2000/svg"</code>. The attribute is optional because the namespace is implied during parsing.

Elements in the MathML namespace may have an <code>xmlns</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1998/Math/MathML"</code>. The attribute is optional because the namespace is implied during parsing.

Foreign elements may also have an <code>xmlns:xlink</code> attribute specified, if, and only if, it has the exact value <code>"http://www.w3.org/1999/xlink"</code>. This attribute is optional, even if XLink attributes are used, because the namespaces for XLink attributes is implied during parsing.

When parsed by an HTML parser, the <code>xmlns</code> and <code>xmlns:xlink</code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|The SVG and MathML namespaces must be declared for SVG and MathML elements, respectively, according to the rules defined by ''Namespaces in XML''. The <code>xmlns</code> and <code>xmlns:<var>prefix</var></code> attributes end up in the <code>"http://www.w3.org/2000/xmlns"</code> namespace.
|
|-
!XLink attributes
|Foreign elements may use the attributes <code>xlink:actuate</code>, <code>xlink:arcrole</code>, <code>xlink:href</code>, <code>xlink:role</code>, <code>xlink:show</code>, <code>xlink:title</code> and <code>xlink:type</code>. These attributes are placed in the <code>"http://www.w3.org/1999/xlink"</code>. The prefix used must be "<code>xlink</code>".
|XLink attributes may be specified on foreign elements using any prefix, subject to the conformance rules defined by ''Namespaces in XML''. The XLink namespace must be declared according to the conformance rules defined by ''Namespaces in XML'' if XLink attributes are used within the document.
|
|-
!XML attributes
|
Foreign elements may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".

HTML elements may use the <code>xml:lang</code> attribute. The attribute in no namespace with no prefix and with the literal localname "<code>xml:lang</code>" has no effect on language processing (as does "<code>lang</code>". HTML elements must not use the <code>xml:base</code>, <code>xml:space</code>, or <code>xml:id</code> attributes.
| Any element, including HTML elements, may use the attributes <code>xml:lang</code>, <code>xml:id</code>, <code>xml:base</code> and <code>xml:space</code>. These attributes are placed in the <code>"http://www.w3.org/XML/1998/namespace"</code>. The prefix used must be "<code>xml</code>".
|
| '''Though they can be used on foreign elements, do not use <code>xml:base</code>, <code>xml:id</code>, or <code>xml:space</code> on HTML elements; use both xml:lang and lang attributes whenever one is to be needed on HTML elements.'''
|-
!Attributes
| Names are not case sensitive. Attribute minimization is allowed (i.e. omitting the equals sign and the value)
| Names are case sensitive (and lower case). Attribute minimization is not allowed.
|
| Use lower case attribute names. Do not minimize attributes.
|-
!Attribute values
| White space characters are not normalized. Unquoted attribute values are allowed. Fixed or default attribute values ...?
| White space characters are [http://www.w3.org/TR/REC-xml/#AVNormalize normalized] to single spaces (unless attribute is of CDATA type?). Unquoted attribute values are not allowed. Default attribute values could conceivably be defined with a DTD.
|
| Create whitespace in attribute values which is already normalized (converted to single spaces). Always quote attribute values. '''Do not rely on defining default or fixed attribute values in a DTD (unless it matches HTML behavior).'''
|-
!Space characters
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000C FORM FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The space characters are defined as:
* U+0009 CHARACTER TABULATION
* U+000A LINE FEED
* U+000D CARRIAGE RETURN
* U+0020 SPACE
|The difference is the inclusion of Form Feed. Form feed characters are discouraged in XML 1.1.
| Do not use the form feed character.
|-
! The DOCTYPE
|
A DOCTYPE is a mostly useless, but required, header. The DOCTYPE is used during parsing to determing the parsing mode. The keywords "<code>DOCTYPE</code>", "<code>PUBLIC</code>" and "<code>SYSTEM</code>", and the name "<code>html</code>" are treated case insensitively. The system identifier <code>"about:legacy-compat"</code> (and the public and system identifiers for previous versions of HTML) are case sensitive.

Conforming HTML documents are required to use <code><!DOCTYPE html></code> (case insensitively) or the legacy-compat version <code><!DOCTYPE html SYSTEM "about:legacy-compat"></code>.

When using the obsolete but conforming DOCTYPEs based on the HTML 4.0 and 4.01 Strict DTDs, the system identifier is optional. The obsolete but conforming DOCTYPEs based on XHTML 1.0 Strict and XHTML 1.1 may also be specified.

Use of an internal subset is forbidden. The system identifier is never de-referenced by HTML implementations.
|
The DOCTYPE is optional. XML rules for case sensitivity apply (everything is case sensitive).

Either of the DOCTYPEs defined in HTML5 may be used, or any other custom DOCTYPE. If the public identifier is specified, the system identifier must also be specified. The obsolete status of the ''obsolete permitted DOCTYPEs'' defined for HTML does not apply to XHTML. Any DOCTYPE may be used, subject to the conformance rules defined by XML.

Use of an internal subset is permitted according to the requirements of XML. Some validating XML processors may dereference the system identifier, if used, but most browsers use non-validating processors.
|
| '''Use the empty DOCTYPE with no SYSTEM or PUBLIC identifiers and no use of internet subset.'''
|-
! Element names
| Element names are case insensitive.
| Element names are case sensitive and lower-case.
|
| Only use lower-case element names (as with attributes).
|-
! Void vs. Non-void Elements
| Void elements only have a start tag; end tags must not be specified for void elements, and it is impossible for them to contain any content. A trailing slash may optionally be inserted at the end of the element's tag, immediately before the closing greater-than sign. For non-void elements (e.g., <nowiki><script></nowiki>), the trailing slash is a parsing error (ignored and thus treated as unclosed).
| Void elements may use either the empty-element tag syntax (''EmptyElemTag'') or use a start tag immediately followed by an end tag, with no content in between. While it is possible for the element to contain content, this is non-conforming.
|
| '''For void elements (e.g., <nowiki><br /></nowiki>), do not include content or use a closing tag; only use a self-closing element with closing slash at the end (with a space preceding it for the sake of older browsers). For non-void elements, i.e., where content can exist (e.g., <nowiki><script></nowiki>), always use an explicit closing tag (not a self-closing tag) even if there is no content.'''
|-
! Unexpected end tags
| Unexpected end tags (in HTML, an unexpected <code></br></code> or <code></p></code> can cause the start tag to be implied before it).
| Unexpected end tags are well-formedness errors.
|
| Do not add end tags unless there is an explicit and properly nested open tag before it.
|-
! End tag with attributes
| ?
| An end tag with attributes is not allowed.
|
| Do not use end tags with attributes.
|-
! Raw text elements
|
|
|
|-
! RCDATA elements
|
|
|
|-
! Foreign elements
|
|
|
|-
! Normal elements
|
|
|
|-
! Optional tags
|
For [[#HTML_Elements_with_Optional_Tags|some elements]], the start and/or end tags are optional and are implied by certain specified conditions. For example, the end tag for the <code>p</code> element is implied by a subsequent <code>p</code> element.

Omitting the end tag for other elements is a parse error and various error recovery procedures are applied appropriately.
| End tags must be explicitly included for all elements, except empty elements using the ''EmptyElemTag'' syntax.
|
| Always use end tags (or self-closing tags for void elements).
|-
! Comment syntax
| Comments must start with the four character sequence "<code></code>". The content of comments must not start with a single U+003E GREATER-THAN SIGN ('>') character, nor start with a U+002D HYPHEN-MINUS (-) character followed by a U+003E GREATER-THAN SIGN ('>') character, nor contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a U+002D HYPHEN-MINUS (-) character. Violating these constraints is a parse error and various error recovery procedures are applied appropriately.
| The content of comments must not contain two consecutive U+002D HYPHEN-MINUS (-) characters, nor end with a hypen. Violating this is a well-formedness error.
|
|-
!Processing Instructions
| HTML does not allow processing instructions and deprecates the bogus comments which appear in their form, whether in the form <code><?foo ...></code> (without a closing '?') or <code><?foo ...?></code>.
| XHTML allows the use of XML processing instructions which are only closed by "?>".
|
| '''Avoid ">" inside processing instructions (as these will close the "instruction" (comment) prematurely) (or one must strip out processing instructions entirely).'''
|-
!CDATA sections
| <code><![CDATA[...]]></code> is a a bogus comment. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is just regular character data.
| <code><![CDATA[...]]></code> is a <code>CDATA</code> section. The sequence of characters "<code>]]></code>" in content when it does not mark the end of a <code>CDATA</code> section is a well-formedness error.
|
| Ensure sequence "<code>]]></code>" in content is escaped (not necessary to escape in attribute values). '''Do not use CDATA sections.'''
|-
! Unescaped Special Characters
|
Unescaped ampersands (U+0026 AMPERSAND - <code>&</code>, instead of <code>&amp;</code>) are permitted within the content of ''normal elements'', ''RCDATA elements'', ''foreign elements'' and ''attribute values'' where they are not considered to be ''ambiguous ampersands'', and within ''Raw text elements''.

Unescaped less than signs (U+003C LESS-THAN SIGN - <code><</code>, instead of <code>&lt;</code>) are permitted in ''Raw text elements'', ''RCDATA elements'' and ''attribute values'', excluding the ''unquoted attribute value syntax''.
| Unescaped ampersands and less-than signs may not appear within ''CharData'' or ''AttValue'' (basically, the normal text content of elements and attribute values.) Violation of this constraint is a well-formedness error.
|
| Always escape ampersands and less-than signs in text content and attribute values. See CDATA for need to escape sequence "<code>]]></code>" in text content.
|-
!Character References
|
|
|
|-
!Entity References
| In HTML, all entity references are predefined and do not require a DTD.
| There is no formal DTD for XHTML5, but one could provide an exteranl DTD (if not an internal subset?) for use with one's entity-checking (or validating) parser, but be aware that browsers do not universally use external entity-checking (or validating) parsers and may not read the external DTD. (Some still have bugs in that they mistakenly create a well-formedness error out of such missing entities instead of showing them as missing, making them clickable, or using a entity-checking or validating parser.)
|
| Do not use entity references in XHTML (except for the 5 predefined entities: <code>&amp;</code>, <code>&lt;</code>, <code>&gt;</code>, <code>&quot;</code> and <code>&apos;)</code>; use the equivalent Unicode or numeric character reference sequence instead.
|-
! Character data
|
|
| The valid set of unicode characters in XML 1.0 is limited beyond that in HTML (we need to specify this here).
|
|}

====Element-specific parsing====
* In HTML, the <code>script</code> and <code>style</code> elements are parsed as <code>CDATA</code> elements. (Note: the definition of <code>CDATA</code> differs from that in XML). In XML, they're parsed as normal elements (which means that things that look like comments are treated as <em>real</em> comments, and things that look like start tags actually are start tags).
* In HTML, the <code>title</code> and <code>textarea</code> elements are parsed as <code>RCDATA</code> elements. (Note: The definition of <code>RCDATA</code> differs from that in SGML and there is no <code>RCDATA</code> in XML).
* In HTML, if scripting is enabled, the <code>noscript</code> element is parsed as an <code>CDATA</code> element. If scripting is disabled, it's parsed as a normal element. In XHTML, the element is always parsed as a normal element, and can't really be used to stop content from being present when script is disabled.
* In HTML, the <code>iframe</code>, <code>noembed</code> and <code>noframes</code> elements are parsed as <code>CDATA</code> elements. In XHTML, they are parsed as normal elements, and therefore do not stop content from being used.
* In HTML, elements with optional tags are implied in certain conditions.
* In HTML, tags for certain elements, which appear out of context, are ignored. This includes <code>caption</code>, <code>col</code>, <code>colgroup</code>, <code>frame</code>, <code>frameset</code>, <code>head</code>, <code>option</code>, <code>optgroup</code>, <code>tbody</code>, <code>td</code>, <code>tfoot</code>, <code>th</code>, <code>thead</code>, <code>tr</code>.
* In XHTML, <code>table</code> elements may contain child <code>tr</code> elements. In the HTML serialisation, due to backwards compatibility constraints, this is not possible (though it may be done through DOM manipulation).
* The <code>plaintext</code> element has a special parsing requirement in HTML. (It is, however, forbidden.)
* In HTML, a line feed that immediately follows a <code>pre</code>, <code>listing</code> or <code>textarea</code> start tag is ignored.
* <em>Many other special handling of edge cases and error conditions, not all of which are listed here, occur in HTML.</em>
* In XHTML, empty elements may use either the empty element syntax (<code><br/></code>) or have an end tag immediately follow the start tag (<code><br></br></code>). In HTML, the empty element syntax (trailing slash) is allowed on void elements, but forbidden on other elements. However, it serves no purpose whatsoever and can be omitted. End tags for void elements are forbidden.
** <code>base</code>, <code>link</code>, <code>meta</code>, <code>hr</code>, <code>br</code>, <code>img</code>, <code>embed</code>, <code>param</code>, <code>area</code>, <code>col</code> and <code>input</code>

==== HTML Elements with Optional Tags ====

{| class="wikitable" border="1"
|-
! Element
! Start Tag
! End Tag
|-
!html
|optional
|optional
|-
!head
|optional
|optional
|-
!body
|optional
|optional
|-
!li
|required
|optional
|-
!dt
|required
|optional
|-
!dt
|required
|optional
|-
!p
|required
|optional
|-
!colgroup
|optional
|optional
|-
!thead
|required
|optional
|-
!tbody
|optional
|optional
|-
!tfoot
|required
|optional
|-
!tr
|required
|optional
|-
!th
|required
|optional
|-
!td
|required
|optional
|-
!rt
|required
|optional
|-
!rp
|required
|optional
|-
!optgroup
|required
|optional
|-
!option
|required
|optional
|}

=== Markup ===

(Need to move these into the above table)

* The [http://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F namespace declaration] (<code>xmlns</code> attribute) is required in XHTML. The xmlns attribute is also allowed to appear on any element in HTML on the condition that is has the value <code><nowiki>"http://www.w3.org/1999/xhtml"</nowiki></code>.
** <code><nowiki><html xmlns="http://www.w3.org/1999/xhtml"></nowiki></code>
** In HTML, the xmlns attribute has absolutely no effect. It is basically a talisman. It is allowed merely to make migration to and from XHTML mildly easier. When parsed by an HTML parser, the attribute ends up in the null namespace
** In XML (with an [http://www.w3.org/TR/xml-names/ XML Namespaces]-aware parser), an xmlns attribute is part of the namespace declaration mechanism, and an element cannot actually have an xmlns attribute in the null namespace. In DOM implementations, the attribute ends up in the "<code><nowiki>http://www.w3.org/2000/xmlns/</nowiki></code>" namespace.
* XHTML allows non XHTML elements and attributes (in different namespaces) to be used, HTML does not.

=== Character Encoding ===

* In XHTML, the XML declaration may be used to [http://wiki.whatwg.org/wiki/FAQ#How_do_I_specify_the_character_encoding.3F specify the character encoding]. In HTML, the XML declaration is forbidden
* In HTML, the <code>meta</code> element with a <code>charset</code> attribute may be used instead. It is forbidden in XHTML unless it specifies 'UTF-8' (case insensitively) and is ignored if included.
* The default character encoding for XHTML is, according to XML rules, <code>UTF-8</code> or <code>UTF-16</code>. If the encoding is unspecified in HTML, it should be determined through implementation specific heuristics or fallback to a default value (Note: this section of the spec is not yet finished).

=== Scripts ===

* <code>document.write()</code> and <code>document.writeln()</code> cannot be used in XHTML, they can in HTML.
* In XHTML, the use of the <code>innerHTML</code> property requires that the string be a well-formed fragment of XML.
* DOM APIs are case sensitive in XHTML and some are case insensitive in HTML. (This does not apply to elements which are not in the HTML namespace)
** Element.tagName and Node.nodeName return the value in uppercase.
** Document.createElement() is case insensitive (the canonical form is lowercase).
** Element.setAttributeNode() will change the attribute name to lowercase.
** Element.setAttribute() is case insensitive (the canonical form is lowercase).
** Document.getElementsByTagName() and Element.getElementsByTagName() are case insensitive.
** Document.renameNode(). If the new namespace is the HTML namespace, then the new qualified name will be lowercased before the rename takes place.
* In HTML, Document.createElement() will create an element in the HTML namespace. In XML (including XHTML), the namespace is defined by both DOM2 and DOM3 to be null.
** In XHTML, browsers lack interoperability in this area. In Firefox and Safari, the namespace is dependent upon the MIME type. In Opera, it's dependent upon the root element.
* XPath expressions targeted at pre-HTML5 browsers need to use the XHTML namespace for XHTML and null for HTML. (HTML5 browsers would use the XHTML namespace even in HTML.)

=== Stylesheets ===

* Selectors, as used in CSS, match case sensitively in XHTML, but case insensitively in HTML.
* CSS requires special handling of the body element in HTML for painting backgrounds on the canvas, which do not apply to XHTML.

== Differences Between HTML4 and HTML5 ==

See [http://dev.w3.org/html5/html4-differences/ HTML5 differences from HTML4].

== Differences Between DOM Level 2.0, 3.0 and the HTML 5 DOM APIs ==

'''This section might belong on a separate page.'''

* TODO (need to talk about the changes to the DOM API that HTML5 is making, compared with DOM2 and DOM3)

== Translations ==

* [http://meiert.com/de/publications/translations/whatwg.org/html-vs-xhtml/ German translation: "HTML 5 und XHTML 5 im Vergleich (WHATWG)"]
* [http://dancewithnet.com/2007/10/28/differences-between-html-and-xhtml/ Chinese translation: "HTML和XHTML的不同"]