View Single Post
  #1  
Old 07-07-2009, 11:01 PM
jesichamika jesichamika is offline
D-Web Trainee
 
Join Date: Jul 2009
Posts: 2
jesichamika is on a distinguished road
Default HTML vs XHTML: Nesting, The Difference

Quote:
The move from html to xhtml is mainly because of the ability to use "Bad Code" withing the html walls.. Here i will try to explain the proper "NESTING" techniques..

Code:

Example.. This code would work fine for HTML.. Not for XHTML:
<html>
<head>
<title>This will work...</title>
<body>
<h1>This is the line with the bad html.. notice i don't the close the h1 or the head
</body>

So with the combination of the XML document (used for describing the data) and HTML (used for displaying the data) every piece of information needs to be valid code..


Code:

Example.. This code would work fine for XHTML.. :
<html>
<head>
<title>This will work...</title>
</head>
<body>
<h1>Now i have closed all the tags properly.. now it is NESTED correctly</h1>
</body>
</html>

The proper NESTING of old tags..
With old HTML documents you were able to completely get the tags the wrong way around but it would still be displayed correctly..

Take the following code for example:
Code:

Old HTML Style: (invalid XHTML)
<u><b>Take note of where i am placing the closure of the tags..</u></b>

Now with the implementation of proper XHTML NESTING:
Code:

New XHTML Style: (valid XHTML because it is properly NESTED)
<u><b>Now take note of the order in which i place the closure of the tags..</b></u>

YOU MUST ALWAYS CLOSE XHTML TAGS... YOU MUST

Paragraphs, Page Breaks, Horizontal Rules, Images etc.... It's all changed..

Take the following form of VALID HTML:
Code:

This is not valid XHTML though.. Remember that...
<p> This is all you used to need for paragraphs
<p> Now i would have two
<hr> Now i would have also added a Horizontal Rule
<br> And a page Break..
<img src="http://forums.learnwebdesign.org/styles/prosilver/imageset/site_logo.gif" alt="LWD logo">
Yet all of this would have been acceptable....

But now with the use of XHTML to be NESTED and valid the previous would need to look like this:
Code:

This is valid XHTML
<p> This is now how you write paragraphs.. notice the closing of the tag ---></p>
<p> Now i would have two</p>
<hr /> Now i have also added a Horizontal Rule
<br /> And a page Break..
<img src="http://forums.learnwebdesign.org/styles/prosilver/imageset/site_logo.gif" alt="LWD logo" />
Now it is XHTML Valid!....
Reply With Quote