XHTML Syntax rules

What is XHTML & Why use it?

XHTML = Extensible HyperText Markup Language
likely the next HTML standard developed by W3C
XHTML works better with XML
HTML XHTML have syntax (rules) for
- Tags
- Extensions
You can use transitional version of XHTML, which is more forgiving than strict version
When you declare transitional.dtd in the html page heading, the browser understands what version of XHTML you are using.
You can validate the syntax of your XHTML via the Web Developers toolbar added to your browser
- chrispederick's web developer toolbar for Firefox - validation is under tools on toolbar
- IE Internet developer toolbar
  validation is under validate on toolba
- If the code is not valid, the validator will tell you what you need to fix
Link to W3C validator without web developer toolbar
- http://validator.w3.org/

XHTML is well-formed HTML

–For now, that means:

Single root element: <html>
Element names must be lower-case <p> not <P>
Elements must be properly nested
- close tags from the inside out: <p><b>dog</b></p>
All element tags must be closed
- 2-sided elements: <p>dog</p>
- 1-sided (empty) elements: <br />
Element attributes rules
- Attribute names must be lower case
- Attribute values must be quoted
- Attributes must have values: checked=“checked”
<img> tags require alt="[image description]" attribute
Certain elements cannot contain other elements:
- <body> tag cannot contain <img> tag BUT
- <body> tag can contain <p> tag which can contain <img> tag
Some tags are deprecated: “applet” replaced by “object”

XHTML Example

<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Declaration references transitional.dtd for XHTML on W3C web site
DTD=Document Type Definition

Three types of XHTML:

Strict – strictly enforces tags, best to use
Transitional – looser form– one we will use in this class
Frameset for use with frames

Comment tags within HTML files

<! -- this comment will not display -- >
<! – This comment can go on for
several lines,
written by L. Soe, September 23, 2005
-- >

Good idea to comment your HTML pages – required in your tutorial cases

When you come back later, you can see who did what, when

The Structure of an HTML File that is Valid XHTML contains

One root element: <html> marks the start of an HTML document
the closing </html> tag tells a browser when it has reached the end of that HTML document.
HTML document divided into
- <head> element – info about document, including title which displays in browser
- <body> element contains everything else that displays on page + code + display directions

XHTML template page

<h1>header</h1>
<p>
<script language="JavaScript" type="text/javascript">
</script>
</p>
</body>
</html>