In case you're wondering why XHTML is important to learn, it's because XML is the wave of the future. Learning to write your Web pages using XHTML now will help you to learn and use XML later. Don't worry, it won't happen overnight, you have plenty of time to learn XML step by step as the technology changes and the browsers catch up. I'm not suggesting that you rewrite all your Web pages, just keep these rules in mind when creating future Web pages.
Here are some simple, basic rules for you to follow when changing your Web design from HTML to XHTML:
- Use All Lowercase Tags All tags must be written in lowercase letters. No longer is it allowable to write <HTML>, from now on it will be written <html>.
- Nest Elements Correctly HTML will forgive you but XHTML will not. Here is a common problem: <b><i>This is wrong.</b></i>. You may notice in this example that the bold and italic elements overlap. Here is the right way to nest these elements: <b><i>This is right.</i></b>.
- Always UseEnd Tags Every tag must have an end tag. When you start a paragraph you use the <p> tag, when you end a paragraph you must use the </p> tag. Same goes for the <li> tag and all other tags.
- End Empty Elements Now you're wondering what you should do with elements like the <br> tag, yes you need an end tag for this one too. You can either write it as <br></br> or you can use an alternative. Instead you can write <br /;>. This can be used in both HTML and XHTML so start using it now to get used to it. This feature can be used with other empty tags too such as the <hr> tag.
- Use Quotes for Values When you write something like: <table border=1 bgcolor=red>, you've left something out. Values must be surrounded by quotation marks. The proper way to write this would be: <table border="1" bgcolor="red">.
- Give Every Attribute a Value Here's where things start to get different. In HTML some attributes have no value. One such attribute is disabled. When using such an attribute you should assign the value of the attribute with the same name at the attribute itself. This is how it would look: disabled="disabled".
- Use Code for Special Characters XHTML can get confused when you use such symbols as < or & inside attribute values. Instead use code to write them. Try these lists of codes to help you: Common Symbols and Less Common Symbols. Instead of writing: <img src=my_picture.gif alt="Me & My Son">; you would write: <img src=my_picture.gif alt="Me & My Son">.
- Use id Insead of name The <a>, <frame>, and <img> elements have an attribute called <name> that is used to specity a location within the HTML page. In XML the <id> attribute is used instead. It's recommended that you start using the <id> attribute now, instead of the <name> attribute. It's not mandatory for now but it will make it easier for you later.
- Separate Styles and Scripts If you are using CSS, JavaScript or another type of language in your Web pages you need to put them in a separate file. Link to them where you want them to show up on your page but keep them separate.
