Xhtml References

01/08/2009 11:29

Differences Between XHTML And HTML

How To Get Ready For XHTML

XHTML is not very different from the HTML 4.01 standard.

So, bringing your code up to the 4.01 standard is a good start. Our complete HTML 4.01 reference can help you with that.

In addition, you should start NOW to write your HTML code in lowercase letters, and NEVER skip ending tags (like </p>).

Happy coding!

The Most Important Differences:

  • XHTML elements must be properly nested
  • XHTML elements must always be closed
  • XHTML elements must be in lowercase
  • XHTML documents must have one root element

XHTML Elements Must Be Properly Nested

In HTML, some elements can be improperly nested within each other, like this:

This text is bold and italic

In XHTML, all elements must be properly nested within each other, like this:

This text is bold and italic

Note: A common mistake with nested lists, is to forget that the inside list must be within <li> and </li> tags.

This is wrong:

          <li>Black tea</li>
          <li>Green tea</li>

    This is correct:

            <li>Black tea</li>
            <li>Green tea</li>

      Notice that we have inserted a </li> tag after the </ul> tag in the "correct" code example.

      XHTML Elements Must Always Be Closed

      Non-empty elements must have an end tag.

      This is wrong:

      This is a paragraph

      This is another paragraph

      This is correct:

      This is a paragraph

      This is another paragraph


      Empty Elements Must Also Be Closed

      Empty elements must either have an end tag or the start tag must end with />.

      This is wrong:

      A break: 
      A horizontal rule: 
      An image: Happy face

      This is correct:

      A break: 
      A horizontal rule: 
      An image: Happy face


      XHTML Elements Must Be In Lower Case

      The XHTML specification defines that the tag names and attributes need to be lower case.

      This is wrong:


      This is a paragraph


      This is correct:


      This is a paragraph



      XHTML Documents Must Have One Root Element

      All XHTML elements must be nested within the <html> root element. All other elements can have sub (children) elements. Sub elements must be in pairs and correctly nested within their parent element. The basic document structure is:




      XHTML Syntax


      Some More XHTML Syntax Rules

      • Attribute names must be in lower case
      • Attribute values must be quoted
      • Attribute minimization is forbidden
      • The id attribute replaces the name attribute
      • The XHTML DTD defines mandatory elements

      Attribute Names Must Be In Lower Case

      This is wrong:

      This is correct:


      Attribute Values Must Be Quoted

      This is wrong:

      This is correct:


      Attribute Minimization Is Forbidden

      This is wrong:


      This is correct:


      Here is a list of the minimized attributes in HTML and how they should be written in XHTML:






























      The id Attribute Replaces The name Attribute

      HTML 4.01 defines a name attribute for the elements a, applet, frame, iframe, img, and map. In XHTML the name attribute is deprecated. Use id instead.

      This is wrong:

      This is correct:

      Note: To interoperate with older browsers for a while, you should use both name and id, with identical attribute values, like this:

      IMPORTANT Compatibility Note:

      To make your XHTML compatible with today's browsers, you should add an extra space before the "/" symbol.

      The Lang Attribute

      The lang attribute applies to almost every XHTML element. It specifies the language of the content within an element.

      If you use the lang attribute in an element, you must add the xml:lang attribute, like this: 

      Heia Norge!


      Mandatory XHTML Elements

      All XHTML documents must have a DOCTYPE declaration. The html, head and body elements must be present, and the title must be present inside the head element.

      This is a minimum XHTML document template:

      Title goes here



      The most common DTD is XHTML Transitional.

      <!DOCTYPE> Is Mandatory

      An XHTML document consists of three main parts:

      • the DOCTYPE declaration
      • the <head> section
      • the <body> section

      The basic document structure is:


      Note: The DOCTYPE declaration is always the first line in an XHTML document!

      An XHTML Example

      This is a simple (minimal) XHTML document:

      PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      simple document

      a simple paragraph


      The DOCTYPE declaration above defines the document type. The rest of the document looks like HTML.

      Document Type Definitions (DTD)

      • A DTD specifies the syntax of a web page in SGML
      • DTDs are used by SGML applications, such as HTML, to specify rules for documents of a particular type, including a set of elements and entity declarations
      • An XHTML DTD describes in precise, computer-readable language, the allowed syntax of XHTML markup

      There are three XHTML DTDs:

      • STRICT
      • FRAMESET

      XHTML 1.0 Strict

      PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 

      Use the strict DOCTYPE when you want really clean markup, free of presentational clutter. Use together with CSS.

      XHTML 1.0 Transitional

      PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

      Use the transitional DOCTYPE when you want to still use HTML's presentational features.

      XHTML 1.0 Frameset

      PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

      Use the frameset DOCTYPE when you want to use HTML Frames to split the web page into two or more frames.

      XHTML HowTo


      How W3Schools Was Converted To XHTML

      W3Schools was converted from HTML to XHTML the weekend of 18. and 19. December 1999, by Hege Refsnes and Ståle Refsnes.

      To convert a Web site from HTML to XHTML, you should be familiar with the XHTML syntax rules of the previous chapters. The following steps were executed (in the order listed below):

      A DOCTYPE Definition Was Added

      The following DOCTYPE declaration was added as the first line of every page:

      "-//W3C//DTD XHTML 1.0 Transitional//EN"

      Tip: Your pages must have a DOCTYPE declaration if you want them to validate as correct XHTML.

      Lowercase Tags And Attribute Names

      Since XHTML is case-sensitive, and only accept lowercase tags and attributes, a general "find-and-replace" function was executed to replace all uppercase tags with lowercase tags. The same was done for attribute names.

      All Attribute Values Were Quoted

      The XHTML 1.0 Recommendation states that all attribute values must be quoted, so every page in W3Schools.com was checked to see that attribute values were quoted.

      Empty Tags: <hr> , <br> and <img>

      Empty tags are not allowed in XHTML. The <hr> and <br> tags should be replaced with <hr /> and <br />.

      A general "find-and-replace" function was executed to swap the tags.

      We decided not to close the <img> tags with </img>, but with  /> at the end of the tag. This was done manually.

      The Web Site Was Validated

      Finally, all our pages were validated against the official W3C DTD Validator:

      W3C XHTML Validator.

      A few more errors were found and edited manually. The most common error was missing </li> tags in lists.

      We could also have used a converting tool like HTML TIDY.

      Dave Raggett's HTML TIDY is a free tool for cleaning up HTML code. It works great on the hard-to-read markup, and it can help to identify where you need to pay further attention on making your pages more accessible to people with disabilities.

      XHTML Validation


      An XHTML document can be validated with W3C's validator.

      Validate XHTML With A DTD

      Before an XHTML file can be validated, a correct DTD must be added as the first line of the file.

      The Strict DTD includes elements and attributes that have not been deprecated or do not appear in framesets:

      !DOCTYPE html PUBLIC
      "-//W3C//DTD XHTML 1.0 Strict//EN"

      The Transitional DTD includes everything in the strict DTD plus deprecated elements and attributes:

      !DOCTYPE html PUBLIC
      "-//W3C//DTD XHTML 1.0 Transitional//EN"

      The Frameset DTD includes everything in the transitional DTD plus frames as well:

      !DOCTYPE html PUBLIC
      "-//W3C//DTD XHTML 1.0 Frameset//EN"


      Validate Your XHTML With The W3C Validator

      Input a web address in the box below:

      XHTML Modularization


      The XHTML modularization-model defines the modules of XHTML.

      Why XHTML Modularization?

      XHTML contains most of the functionality a web developer will need.

      For some purposes XHTML is too large and complex, and for other purposes it's too simple.

      By splitting XHTML into modules, the W3C (World Wide web Consortium) has created small and well-defined sets of XHTML elements that can be used separately for small devices, or combined with other XML standards in more complex applications.

      With modular XHTML, designers can:

      • Choose the elements to be supported by a device
      • Simplify XHTML for small devices
      • Extend XHTML for complex applications by adding new XML functionality (like MathML, SVG, Voice and Multimedia)
      • Define XHTML profiles like XHTML Basic (a subset of XHTML for mobile devices)

      XHTML Modules

      W3C has split the definition of XHTML into 28 modules:

      Module name


      Applet Module

      Defines the deprecated* applet element

      Base Module

      Defines the base element

      Basic Forms Module

      Defines the basic forms elements

      Basic Tables Module

      Defines the basic table elements

      Bi-directional Text Module

      Defines the bdo element

      Client Image Map Module

      Defines browser side image map elements

      Edit Module

      Defines the editing elements del and ins

      Forms Module

      Defines all elements used in forms

      Frames Module

      Defines the frameset elements

      Hypertext Module

      Defines the a element

      Iframe Module

      Defines the iframe element

      Image Module

      Defines the img element

      Intrinsic Events Module

      Defines event attributes like onblur and onchange

      Legacy Module

      Defines deprecated* elements and attributes

      Link Module

      Defines the link element

      List Module

      Defines the list elements ol, li, ul, dd, dt, and dl

      Metainformation Module

      Defines the meta element

      Name Identification Module

      Defines the deprecated* name attribute

      Object Module

      Defines the object and param elements

      Presentation Module

      Defines presentation elements like b and i

      Scripting Module

      Defines the script and noscript elements

      Server Image Map Module

      Defines server side image map elements

      Structure Module

      Defines the elements html, head, title and body

      Style Attribute Module

      Defines the style attribute

      Style Sheet Module

      Defines the style element

      Tables Module

      Defines the elements used in tables

      Target Module

      Defines the target attribute

      Text Module

      Defines text container elements like p and h1

      * Deprecated elements should not be used in XHTML.

      HTML 4.01 / XHTML 1.0 Reference


      Ordered Alphabetically

      DTD: indicates in which XHTML 1.0 DTD the tag is allowed. S=Strict, T=Transitional, and F=Frameset





      Defines a comment



      Defines the document type



      Defines an anchor



      Defines an abbreviation



      Defines an acronym



      Defines an address element



      Deprecated. Defines an applet



      Defines an area inside an image map



      Defines bold text



      Defines a base URL for all the links in a page



      Deprecated. Defines a base font



      Defines the direction of text display



      Defines big text



      Defines a long quotation



      Defines the body element



      Inserts a single line break



      Defines a push button



      Defines a table caption



      Deprecated. Defines centered text



      Defines a citation



      Defines computer code text



      Defines attributes for table columns 



      Defines groups of table columns



      Defines a definition description



      Defines deleted text



      Deprecated. Defines a directory list



      Defines a section in a document



      Defines a definition term



      Defines a definition list



      Defines a definition term



      Defines emphasized text 



      Defines a fieldset



      Deprecated. Defines text font, size, and color



      Defines a form 



      Defines a sub window (a frame)



      Defines a set of frames


      <h1> to <h6>

      Defines header 1 to header 6



      Defines information about the document



      Defines a horizontal rule



      Defines an html document



      Defines italic text



      Defines an inline sub window (frame)



      Defines an image