XHTML basics

13
A Reformulation of HTML 4 in XML 1.0 (Yes, I am a nerd)

description

a very basic look at XHTML. Covers the basics of the structure not how to make a web page.

Transcript of XHTML basics

Page 1: XHTML basics

A Reformulation of HTML 4 in XML 1.0

(Yes, I am a nerd)

Page 2: XHTML basics

XHTML

What is it? Why use it? How do I use it correctly?

Page 3: XHTML basics

What is XHTML?

Extensible HyperText Markup Language

Combination of HTML and XML The elements from HTML The syntax from XML

Page 4: XHTML basics

Why should I care?

Based on industry standards Cross browser support Validated and proper code Will run properly on all XML

devices

Page 5: XHTML basics

Basic Structure

One root element per document Properly nested elements Closed elements lowercase elements More syntax

Page 6: XHTML basics

One root element The basic mandatory structure<!DOCTYPE – more in a second><html>

<head><title></title>

</head><body></body>

</html>

Page 7: XHTML basics

Properly Nested BAD<p>

This <strong><em>is</strong></em> fun.

</p>

HAPPY FUN TIME<p>

This <strong><em>is </em></strong>fun.

</p>

Page 8: XHTML basics

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”

/>

Page 9: XHTML basics

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>

Page 10: XHTML basics

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”

Page 11: XHTML basics

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">

Page 12: XHTML basics

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/

Page 13: XHTML basics

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