Post on 18-Jan-2015
description
A Reformulation of HTML 4 in XML 1.0
(Yes, I am a nerd)
XHTML
What is it? Why use it? How do I use it correctly?
What is XHTML?
Extensible HyperText Markup Language
Combination of HTML and XML The elements from HTML The syntax from XML
Why should I care?
Based on industry standards Cross browser support Validated and proper code Will run properly on all XML
devices
Basic Structure
One root element per document Properly nested elements Closed elements lowercase elements More syntax
One root element The basic mandatory structure<!DOCTYPE – more in a second><html>
<head><title></title>
</head><body></body>
</html>
Properly Nested BAD<p>
This <strong><em>is</strong></em> fun.
</p>
HAPPY FUN TIME<p>
This <strong><em>is </em></strong>fun.
</p>
Closed Elements BAD<p>Paragraph 1<p>Paragraph 2<br><hr><img
src=“pic.jpg”>
HAPPY FUN TIME<p>Paragraph
1</p><p>Paragraph
2</p><br /><hr /><img src=“pic.jpg”
/>
lowercase elements BAD<P> another
paragraphwith an image
<Img Src=“pic.jpg” />
</p>
HAPPY FUN TIME<p> another
paragraphwith an image
<img src=“pic.jpg” />
</p>
HAPPY FUN TIME<table width=“100%”></table>
<input checked=“checked” />
<option selected=“selected”>
</option>
BAD<table WIDTH=100%></table>
<input checked><option SELECTED></option>
More syntax Attribute names must be lowercase, their
values quoted, and no “minimization”
DOCTYPE
Only really have to worry about this if you create the page from scratch
Don’t really worry about what everything means except for…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Now What? XHTML Cheat Sheet v1.03
-http://floele.flyspray.org/htmlcheatsheet.pdf
Official HTML 4 page – http://www.w3.org/TR/html4/
Official list of elements (HTML 4) - http://www.w3.org/TR/html4/index/elements.html
Official list of attributes (HTML 4) - http://www.w3.org/TR/html4/index/attributes.html
Official XHTML 1 page – http://www.w3.org/TR/xhtml1/
Who am I?
C. Todd Barber Webmaster University of Tennessee Health Science
Center Memphis, TN 38163
Also at http://ctbarber.com http://twitter.com/ctbarber