After reviewing the correct XHTML syntax, let's see how a basic valid page is coded. The minimal elements are:
- Doctype
- html tag, tells the browser it's an HTML document
- head tag, gives the browser information about the page, it's invisible to the visitor
- title tag, defines the page title
- body tag, everything that the visitor will see in the browser
The Doctype (DTD)
It will define the syntax your page is going to use, this is important for validation. You have to choose an appropriate doctype for your website.
XHTML 1.0 Strict: you can't use deprecated elements
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional: you can use deprecated elements
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset: use this one if you use frames
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
The html element
You have chosen a doctype, good, now let's add the html element.
<!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">
</html>
The xmlns attribute is required.
The head element
You have to give at least basic informations about your page in the document's head. Use the title element to give it a title.
<!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">
<head>
<title>Hello World</title>
</head>
</html>
The body element
Start adding your content in the body element.
<!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">
<head>
<title>Hello World</title>
</head>
<body>
<p>Hello World, you can read this.</p>
</body>
</html>
If you save this as index.html, it will show a page with "Hello World, you can read this." and "Hello World" in the browser title bar.
