Valid xhtml (html)? Why?

Submitted by Laura on Wed, 26/11/2008 - 12:53pm

You may be wondering why following the W3C recommendations is so important.

From experience, if your code isn't valid, at least one of the different browsers will not display the page how you intended it to look. I also find that WYSIWYG editors like Dreamweaver can mess up your brilliant code. So be careful.

Clean table-less validating websites are more likely to be accessible.

This article covers the xhtml/html side of things. Css will be covered in a future article.

Common reasons why your website doesn't validate.

  1. No DOCTYPE. Or incorrect DOCTYPE

    The DOCTYPE goes at the very top of the page, with no white space before it.

    At this time there are 6 commonly used DOCTYPES for new documents. Three for HTML 4.01 and 3 for XHTML 1.0 (Strict, Transitional & Frameset).

    1. HTML 4.01 Strict

      Use with Cascading Style Sheets (CSS) when you have clean code with no presentational tags.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    2. HTML 4.01 Transitional

      This includes presentation attributes and elements, which in the future will be deprecated. But enables some styling for very old browsers that don't render CSS.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    3. HTML 4.01 Frameset

      The Frameset DTD should be used for documents with frames. Frameset is the same as Transitional except the body element is replaced by the frameset element. May not be accessible.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

    1. XHTML 1.0 Strict

      Use this with Cascading Style Sheets (CSS). For clean code with no presentational tags. This is what I use now for new documents.

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    2. XHTML 1.0 Transitional

      This includes presentation attributes and elements, which in the future will be deprecated.

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    3. XHTML 1.0 Frameset

      Use this DTD when you want to use frames. Not recommended. Frames have accessibility issues.

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

    I prefer to use XHTML 1.0 Strict for new documents, but can code to any of these recommendations. I can't wait for html5 to be finalised.

  2. Character "&" is the first character of a delimiter but occurred as data.

    You get this error when you use & instead of using the entity &amp;. & is a special character used at the beginning of an html entity. It is not safe to use it on its own.

  3. Document type does not allow element "p" here; missing one of "object", "ins", "del", "map", "button" start-tag

    This occurs when you try to nest a <p> element inside of a <p> element i.e. <p><p>...</p></p>. Paragraph or <p> is a block element that only contains inline elements. So when you try to nest a block element in <p> you get this error.

    It usually occurs when you delete a paragraph but not all the tags associated with it. Sometimes WYSIWYG editors get confused and make this mistake too.