HTML / XHTML How To


Summary


Many different versions of HTML and XHTML tags as well as rules have been changed to reflect new standards in web coding. In HTML, Transitional tag attributes do not need quotation marks. However, in XHTML, all tags require them. In XHTML, all tags must be closed, even sort tags like <br> and <img>. HTML text can be placed anywhere in the document. In XHTML, the rules change and all text must be in a paragraph, header, span, or equivalent tag. All tags must be lowercase. For example, <P> must be <p>. Most of the changes that come to XHTML are the removal of non-CSS formatting code, proper closure and placement of tags.



10 Common Tags that change

<br> to <br />
<img> to <img />
<html> to <html xmlns="http://www.w3.org/1999/xhtml">
<hr> to <hr />
<meta> to <meta />
<link> to <link />
<param> to <param />
<input> to <input />
<option> to <option />
<col> to <col />
 



Code snippets that change

Normal Text

In HTML

<body>
    This is text that is free floating and would work with HTML
</body>

IN XHTML

<body>
    <p>Free floating text must be put into paragraph tags in XHTML</p>
</body>


Tag Nesting

In HTML

<b><i>Improper nesting</b></i>

In XHTML

<b><i>Proper Nesting</i></b>


Attribute Quoting

In HTML

<table width=800></table>

In XHTML

<table width="800"></table>


Name vs. ID Attribute

In HTML

<a href="somewhere.html" name="someWhereName">A Link</a>

In XHTML

<a href="somewhere.html" id="someWhereName">A Link</a>


The Blockquote

IN HTML

<blockquote>This is text in a block quote</blockquote>

IN XHTML

<blockquote>
    <p>This is text needs to be in a paragraph</p>
</blockquote>



Web Resources


W3 Schools

- Learn about many different web languages from HTML / XML / JavaScript / AJAX and more
http://www.w3schools.com

Web Monkey

- Tutorials for the web, and some cheat sheets as well
http://www.webmonkey.com/

About.com Web Design

- Host of many good tutorials for web languages
http://webdesign.about.com/