g
Printer Friendly Version

editor   Elizabeth Connick
BellaOnline's HTML Editor
 

Switching From HTML To XHTML

You've heard about XHTML and how it is the markup language of the future. Are you ready to convert your webpages from HTML to XHTML but you don't know where to start? Don't worry, it's easy. Read on.

XHTML is less flexible than HTML. Most web browsers will display a webpage coded in HTML even though there may be some small discrepancy in the code. However, XHTML is stricter and therefore you need to follow a few guidelines.

  • When you use more than one tag together, this is called nested tags. You must open and close nested tags in the same order. For example, you might want to make a section of text both bold and italic.

    <b><i>Text goes here</i></b> Correct

    <b><i>Text goes here</b></i> Incorrect

  • XHTML is case-sensitive which means that BR is not equal to br.

  • You should code XHTML element and attribute names in lowercase characters.

    <b></b> Correct

    <B> </B> Incorrect

  • Some HTML tags do not require a closing tag because they are optional and most browsers will still display your webpage with or without these optional tags. A common example is the opening <p> tag without the optional closing </p> tag. However, in XHTML you must remember to use these optional closing tags. <p> </p>

  • Some elements in HTML are empty tags because the opening tag does not have a matching closing tag such as the <br> and <img> tag. When using these tags that do not have a matching closing tag, you must add a space and backslash /.

    <br />

  • You should always enclose attribute values within quotation marks when coding XHTML.

    width=100 Incorrect

    width="100" Correct

  • When adding CSS style or script code to your HTML webpages, you were taught to add the HTML comment tags to enclose the code section. This was done to hide the code from older browsers. Do not use this comment code in XHTML webpages. You will use the CDATA code instead.

    <style type="text/css">
    <!--
    ----
    -->
    </style> Incorrect


    <style type="text/css">
    <![CDATA[
    -----
    ]]>
    </style> Correct

  • Some HTML attributes are stand alone attributes because they do not have a matching value. An example of this is the checked attribute for the input tag. When using stand alone attributes in XHTML, you will need to set the attribute equal to itself.

    Incorrect
    <input type="checkbox" name="sex"
    value="female" checked>


    Correct
    <input type="checkbox" name="sex"
    value="female" checked="checked">
    Note--The arrow indicates that the code is wrapped to a second line and should really be all on one line.

  • The doctype DTD tag (document type declaration) is optional for HTML webpages. However, you must include one of the DTD above the <html> tag in your XHTML webpages. You can find more information about DTD here.

  • Finally, you need to include the XML namespace in the <html> tag in your XHTML webpages.

    <html xmlns="http://www.w3.org/1999/xhtml">

    </html>



HTML Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2008 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Elizabeth Connick for details.



| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2008 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor