From strict HTML to XHTML 1.0 in three steps

written by: Octavian Draganescu; article published: year 2009, month 01;


  

In: Categories » Computers and technology » HTML » From strict HTML to XHTML 1.0 in three steps

 

  1. Change your DOCTYPE to XHTML 1.0 Strict.

    You already know all about DOCTYPEs and you're used to seeing the HTML 4.01 Strict document type. Well, there's also a document type for XHTML 1.0 Strict, and you need to change your DOCTYPE to use it instead. Here's what it looks like:

    <!DOCTYPE html
    Just like the HTML
    DOCTYPE, this is a public document type.

    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    It's for the XHTML 1.0 Strict
    version of XHTML.

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    And it has a URL pointing to
    the definition of XHTML 1.0 Strict.

  2. Add the xmlns, lang and xml:lang attributes to your <html> element.

    Remember that XML can be used to define many markup languages other than XHTML. To keep all those languages straight, XML needs to know which language you're talking about when you use the element <html>(after all, someone could come along and make up their own language with XML and call it the "Hippo Tipping Markup Language," which would cause mass confusion). So, to keep things straight, the xmlns attribute specifies which language the <html> element belongs to. And what about all the rest of the elements inside the <html> element? By default, they inherit the xmlns attribute of their parent.

    The <html> element also needs lang and xml:lang attributes, which specify the language being used in the XML document. Here's what your <html> opening tag should look like in XHTML:

    <html xmlnsThe xmlns attribute is
    used to identify which XML language "html" belongs to.

    ="http://www.w3.org/1999/xhtml"
    XML uses a URL as a unique
    identifier for a language. If someone has written a "Hippo Tipping Markup Language" they
    might have used "http://www.hippotipping.com/html" as their identifier. It doesn't matter
    what is at the URL the URL alone is enough to make it unique.

    lang="en" xml:lang="en">
    And we just need to specify that
    we're using English. Depending on the way your XHTML is interpreted by the browser, you
    may need either one of these, so it's best practice to use both.


  3. All empty tags should end in " />", not ">".

This is the final, and most bizarre step of the HTML to XHTML 1.0 transformation. But it's not so mysterious if you know the background.

We've told you XHTML is stricter than HTML, and one area where it is stricter is with closing tags. In HTML, you can have an empty element without a closing tag. But in XHTML, if you aren't going to have a closing tag, you have to tell the browser about it by putting a slash before the final ">". So, take the <br> element as an example. In HTML we just write <br>. But in XHTML, we write <br/>. That little slash on the end tells the browser it shouldn't expect a closing tag, because the <br/> is all there is.

Now you might have noticed we didn't include a space before the "/>". That's because XHTML doesn't require it. However, some older browsers can't recognize "/>" without a space before the slash, so, to be backwards compatible, just put a space before your slash in " />".

legal disclaimer

1) Our website is not responsible for the information contained by this article as well for any and all copyright infringements by authors and writers. E-articles is a free information resource. If you suspect this article for any copyright infringements, please read the Terms of service and contact us to investigate the problem.
2) The E-articles directory team is not responsible for inaccuracies, falsehoods, or any other types of misinformation this tutorial may contain and will not be liable for any loss or damage suffered by a user through the user's reliance on the information gained here. Please read the Terms of service

Useful tools and features

Translate this article to...    Send this article to you or to a friend

Link to this article from your page   
If you like this article (tutorial), please link to it from your web page using the information above. Linking to this page, this is the only way to help us improve our service, the same time providing your visitors with a way to improve their online experience.