XHTML Syntax - accessible web design

BAM - Providing html code to artists, agencies, designers & developers since 1996.

XHTML Specifications

XHTML stands for eXtensible HyperText Markup Language

XHTML 1.0 became a W3C Recommendation January 2000.

XHTML 1.0 will be replaced by XHTML 2 and many tags will Not be backward compatible see note

XHTML does Not replace HTML - HTML 5 is on the way and should be backward compatible in parts to version 4.01

XHTML elements must always be closed, or self closing tags are used.
XHTML elements must be properly nested.
XHTML elements must be in lowercase.
XHTML element styles are controlled by an external CSS file or an in line style sheet.
Structure must be separated from content.
All values for attributes must be encased in single or double quotes, "value" or 'value' .
The quotes Must be the same for the beginning and ending a value, ["value" is correct], ["value' is incorrect]
An id has to have an individual name which can only be used once in an id on a page,
you can have multiple id's but each must have a unique name e.g. <div id="top"></div>
A class can be used many times in a page <div class="top"></div>

Note: In 2009, the W3C allowed the XHTML 2 Working Group's charter to expire, acknowledging that HTML 5 would be the sole next-generation HTML standard, including both XML and non-XML serializations. Source

XHTML Self closing/ contained tags

Type	Example
meta data	<meta name="author" content="Your Name" >
	<meta content="RiverDocs" name="GENERATOR" />
	meta data should not include symbols
Horizontal rule (line)	<hr />
Meta links	<link rel="stylesheet" type="text/css" href="style.css" />
Line Breaks	<br />
Image	<img src="image.jpg" alt="image" />
Form elements	<input name="example" type="text" />
Form exceptions	An exception in form elements is made for the select tag, i.e. dropdown and multi selection lists Use the full opening and closing tags. <select>.</select> <p> <select id="list" name="Drinks" title="Select a Drink" size="1"> <option value="null" selected="selected">Please Select</option> <option>Apple</option> <option>Orange</option> <option>Milk</option> <option>Cola</option> </select> </p>