Skip to main content

XHTML Doctypes

<!DOCTYPE> Is Mandatory

An XHTML document consists of three main parts:
  • the DOCTYPE declaration
  • the <head> section
  • the <body> section
The basic document structure is:
<!DOCTYPE ...>

<html>

<head>
<title>... </title>
</head>

<body> ... </body>

</html>
Note: The <!DOCTYPE> declaration refers to a Document Type Definition (DTD). A DTD specifies the rules for the markup language, so that the browsers render the content correctly.

An XHTML Example

The example below shows an XHTML document with a minimum of required tags:
<!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>Title of document</title>
</head>

<body>
</body>

</html>
Note: The xmlns attribute in <html>, specifies the xml namespace for a document, and is required in XHTML documents.

XHTML Different Doctypes

The <!DOCTYPE> declaration is the very first thing in an XHTML document, before the <html> tag.
The <!DOCTYPE> declaration is not an XHTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.
The <!DOCTYPE> declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly.

XHTML 1.0 Strict

This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional

This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed. The markup must also be written as well-formed XML.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 Frameset

This DTD is equal to XHTML 1.0 Transitional, but allows the use of frameset content.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

This DTD is equal to XHTML 1.0 Strict, but allows you to add modules (for example to provide ruby support for East-Asian languages).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 

XHTML HowTo

The following steps shows how a website can be converted from HTML to XHTML in 6 simple steps:

1. Add a <!DOCTYPE>

Add an XHTML <!DOCTYPE> to the first line of every page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Tip: Your pages must have a DOCTYPE declaration if you want them to validate as XHTML.

2. Add an xmlns Attribute

Add an xmlns attribute to the html element of every page:
<html xmlns="http://www.w3.org/1999/xhtml">
Note: The xmlns attribute specifies the xml namespace for a document, and is required in XHTML documents.

3. Change Tags And Attribute Names to Lowercase

A general "find-and-replace" function was executed to replace all uppercase tags with lowercase tags. The same was done for attribute names.

4. Quote All Attribute Values

Check every page to see that attribute values are quoted.

5. Close all Empty Tags

Empty tags are not allowed in XHTML. The <hr> and <br> tags should be replaced with <hr /> and <br />.
A general "find-and-replace" function was executed to swap the tags.
Close the <img> tags with /> the end of the tag.

6. Validate XHTML With The W3C Validator

Before an XHTML file can be validated, a correct DTD must be added as the first line of the file.

Input a web address in the box below:

Correct the few errors found.

XHTML Quiz Test

The test contains 20 questions and there is no time limit.
The test is not official, it's just a nice way to see how much you know, or don't know, about XHTML.
You will get 1 point for each correct answer. At the end of the Quiz, your total score will be displayed. Maximum score is 20 points.

Comments

Post a Comment

Popular posts from this blog

Toshiba Canada enters all-in-one PC market

Toshiba of Canada has thrown its hat into the all-in-one personal computer (PC) ring with the launch this week of the Toshiba DX730, a 23” all-in-one machine designed for users who want a large display and multimedia features in an environment where space is at a premium. It's Toshiba's first foray into this form factor, said Mini Saluja, national training manager with Toshiba of Canada, building on its experience in the laptop market. The DX730 has a 23” full HD multitouch display with a glossy black finish on an aluminum stand. It comes with a matching Bluetooth keyboard and mouse, and boasts Onkyo stereo speakers with Waves MaxxAudio sound processing. Two models of the DX730 will initially be available. The $899 model features a second-generation Intel Core i3 processor with 4GB of DDR3 memory, a 1TB 7200 RPM hard drive, a DVD SuperMulti Drive and HDMI in. For $1,049, you can move up to a model with an NVIDIA Geforce GT 540M processor and Intel Core i5, as we...
1 comment
Read more

Xiaomi Mi 11 Ultra review

  Introduction Now that the Pro moniker has gone mainstream, it's Ultra that has come to represent the cream of the crop, and the Xiaomi Mi 11 Ultra can wear that badge proudly. Limited to its home market last year, the ultimate Mi has gone global this time around, and we're happy to have it for review today. We're torn whether it's the camera system's physical appearance that is more striking or the hardware inside. A simply massive raised area on the back looks bolted on, almost after the fact, it's hard to miss, and it's a great conversation starter even if it's not everyone's cup of tea. But its size is warranted - the main camera packs the largest sensor used on a modern-day smartphone, and next to it - two more modules unmatched in their own fields, in one way or another. Oh, and yes, there's also a display here - because why not, but also because it can be useful. There's a lot more than 1.1 inches of ...
Post a Comment
Read more

JavaScript Where To

JavaScript in <body> The example below writes the current date into an existing <p> element when the page loads: Example <html> <body><h1>My First Web Page</h1> <p id="demo"></p> <script type="text/javascript"> document.getElementById("demo").innerHTML=Date(); </script> </body> </html>
Post a Comment
Read more