XHTML/Printable version

XHTML

The current, editable version of this book is available in Wikibooks, the open-content textbooks collection, at
https://en.wikibooks.org/wiki/XHTML

Permission is granted to copy, distribute, and/or modify this document under the terms of the Creative Commons Attribution-ShareAlike 3.0 License.

What is XHTML

Extensible Hypertext Mark Up Language (XHTML) is the successive markup language to the near ubiquitous Hypertext Mark Up Language (HTML). Rooted in Standard Generalized Markup Language (SGML), HTML is flexible but complex, leaving the liberties with which web browsers take with its rules to cause a number of problems. Based on the strict and simple Extensible Markup Language (XML) standard, XHTML aims to resolve said problems while offering extensibility with other XML-based applications. In summation, XHTML is HTML rewritten to comply with XML, hence its name.

XHTML, being a subset of XML, will also be extensible to other XML applications and featured. For example, it may also include fragments from other XML based languages, such as Scalable Vector Graphics or MathML through the usage of namespaces.

What HTML Stands For

The abbreviation of HTML stands for HyperText Mark-Up Language. Explained in more detail, this means:

• H (Hyper): The opposite of linear. Instead of going from the first line to the following one, the decision in where and when everything is set is up to the programmer (Specifically, you.).
• T (Text): This one is self-explanatory. The programming language is created through text.
• M (Mark-Up): This is what you can do with the text; you can mark-ups to edit a text's style, such as boldness, headings, bullets, and so on.
• L (Language): Also self-explanatory. HTML is a programming language.

The Components

An XHTML document is made up of four main components:

• Document Type Definition (DTD): This used to be optional in HTML, but it is compulsory in XHTML. The DTD describes the language or script in which the text has been encoded.
• Text content: the headers and paragraphs that appear on the page.
• References: Advanced content like links and images.
• Mark-Up: Instructions on how the content should be displayed.

Each of these components is comprised of text. This means that the page can be saved in text format and viewed in any browser.

XHTML stands for extensible Hypertext Markup Language. It is a different version of HTML, it is based off of XML. XHTML is used to make webpages and has a very specific way to be written to be correct and without error. XHTML is also very case-sensitive. the tags are written in lowercase and need to be closed.The order of the tags also need to be in correct order for the information to come out correct. there are three main sections of XHTML consist of A declaration statement, a Head statement and a body.

• 
  XHTML

History of XHTML

XHTML 1.0

This was the first XHTML standard to be released. It was created to redesign HTML 4.0 to act more like an XML file. To make the change from HTML 4.0 to XHTML 1.0, there was three standards: strict, transitional and frameset.

• Strict was the standard that accepted the full XHTML standard.
• Transitional was used by developers to either make it easier to migrate over from HTML 4.0 or to allow certain standards from HTML version 4.01 Transitional in the XHTML file.
• Framset was very simply the standard that allowed frames in the XHTML file.

XHTML has the capability to be used with XML files and applications that work with XML files.

XHTML 1.1

XHTML 1.0 was made with the intention of allowing developers to move from HTML standards to XHTML standards more easily.

XHTML 2.0

XHTML 2.0 was drafted between August 2002 and July 2006. It was designed to supersede HTML 4.0 and XHTML 1.1. In July 2009, World Wide Web Consortium announced plans to discontinue work on XHTML 2.0 by the end of the year in order to focus its effort on HTML 5. HTML 5 is expected to include a XML scheme in place of XHTML 2.0 currently called XHTML 5.

XHTML 5.0

Broadly similar to HTML5.

Media Types

Media Types

XHTML as XHTML

The recommend media type for XHTML is application/xhtml+xml; ideally, this would serve XHTML as XHTML. As of 31 December 2006, only Gecko and Presto based layout engines (Firefox and Opera respectively) support this media type. To have your XHTML read as XHTML, save your markup with an .xht file extension.

Best Practices for serving XHTML as XHTML

In addition to conformation to all of the rules of XML, we strongly recommend that you adhere to the following practices when serving XHTML as XHTML:

• An XML stylesheet PI (processing instruction) is recommended for associating external stylesheets:

Rather than this:

<link rel="stylesheet" type="text/css" href="/mystyle.css">

XHTML as XHTML should include this:

<?xml-stylesheet type="text/css" href="/mystyle.css"?>

<?xml-stylesheet type="text/xsl" href="/mystyle.xsl"?>

XHTML as XML

A secondary media type for XHTML is the generic XML media type, application/xml. This media type is supported by most layout engines, including Gecko, Presto, Web Core, KHTML, and even Trident, though only two—Gecko and Presto—serve it as XHTML; the rest serve it as XML, which could result in several quirks. That said, this is the media type of choice for cross-compatibility. Serving XHTML as XML has the benefit of XML parsing, meaning that, unlike text/html which serves XHTML as HTML, there will be no conflicts between XML syntax and XHTML syntax, since they are both the same. To have your XHTML read as XML, save your markup with an .xml file extension.

Best Practices for serving XHTML as XML

In addition to conformation to all of the rules of XML, we strongly recommend that you adhere to the following practices when serving XHTML as XML:

• We encourage all authors to set a charset parameter through a higher level protocol (this can be done with a scripting language like PHP). If you are unable to go that route (and even if you are), you should define your character encoding via XML declaration:

Rather than this:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

XHTML as XML should include this:

<?xml version="1.0" encoding="utf-8"?>

XHTML as HTML

A third option is serving XHTML as HTML via text/html. This essentially defeats most purposes of programming with XHTML, since HTML is neither subjected to XML parsing nor extensible. Further, the only way to write valid XHTML as HTML is to adhere to the rules of both languages—even when those rules conflict with each other (such as those pertaining to empty elements). Finally, HTML rules apply for DOM scripting and stylesheets.

Before serving XHTML as HTML, we encourage you to examine the purposes of doing so. Some questions worth asking might include the following: Do I want to take advantage of the extensibility of XML? Do I want to my markup to be parsed as XML? Am I going to take advantage of XSL stylesheets? If the answer to all of those questions is no, then HTML 4.01 may be the way to go. However, if you have your heart set on serving XHTML as HTML, XHTML 1.0 Transitional does technically allow for it. To have your XHTML read as HTML, save your markup with an .htm file extension and be sure your DTD is XHTML 1.0 Transitional.

Content Negotiation

For the purposes of XHTML, content negotiation is the practice of serving one media type to certain layout engines, while serving another to others via embedded scripting languages (Javascript, PHP). The difference between using content negotiation and simply serving XHTML with a text/html media type is that content negotiation often (though not necessarily) serves HTML as HTML as opposed to XHTML as HTML. In other words, depending on the UA (user agent), a peek at the source code would reveal either an HTML DTD or XHTML DTD, an XML declaration or a Content-type meta tag, an XML stylesheet PI or a linked one. This means that with judicious scripting, one could author valid XHTML without regard to the rules of HTML and take advantage of the extensibility and efficient processing of XML for supporting layout engines while authoring valid HTML (sans aforementioned extensibility, processing) for other layout engines using much of the same markup.

Media Types and Layout Engines

Comparison of Media Types and Layout Engines

The responses when a well-formatted XHTML document is served with different media types.

	Trident	Tasman	Gecko	WebCore	KHTML	Presto	iCab
application/xhtml+xml	Prompt for download	Prompt for download	XHTML	XML	HTML	XHTML	(X)HTML
application/xml	XML	Crash	XHTML	XML	XML	XHTML	Text
text/html	HTML	HTML	HTML	HTML	HTML	HTML	HTML

Presto media type notes

1. application/xml — In order to receive the benefits of XML processing in Presto-based layout engines (such as Opera or Opera Mini or Opera Mobile), one must use an XSL stylesheet to transform the XHTML into XML. [1].

WebCore media type notes

1. application/xhtml+xml, application/xml, text/xml — HTML entities and custom entities defined by custom DTD are not recognized.

KHTML media type notes

1. application/xhtml+xml — KHTML supports this media type, but processes the document as HTML.
2. application/xml, text/xml — HTML entities and custom entities defined by custom DTD are not recognized.

iCab media type notes

1. application/xhtml+xml — Type selector in CSS is matched case-insensitively.

XML Parsing

Save two copies of the following document, one as badlyFormed.html and one as badlyFormed.xhtml.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <title>Not well-formed</title>
 </head>
 <body>
  <p>An XHTML-compliant browser should refuse to render any part of this page.</p>
  <p>This paragraph is <b><i>not</b> well-formed</i>.
 </body>
</html>

According to the XML specification, on which the XHTML specification is based, a compliant browser should refuse to render any part of the document. Instead it should return an error message. Open badlyFormed.xhtml. You should get an error message similar to this one:

XML Parsing Error: mismatched tag. Expected: </i>.
Location: file:///D:/Practice/XHTML/BadlyFormed.xhtml
Line Number 8, Column 35:

  <p>This paragraph is <b><i>not</b> well-formed</i>.
----------------------------------^

If you don't get an error message then either the MIME type is set incorrectly or your browser is non-compliant. Microsoft Internet Explorer, version 7.0 and lower, is non-compliant. Mozilla Firefox is compliant (at least from version 1.0 upwards, possibly in earlier versions).

Using Firefox you can check the MIME type for the page. From the Tools menu select the Page Info option. Three lines down on the General tab is 'Type:'. The type for badlyFormed.xhtml should be application/xhtml+xml. If it isn't you don't have the extension .xhtml mapped to application/xhtml+xml.

Now try opening badlyFormed.html with Firefox. The page will probably be displayed, contrary to the XHTML specification. Check the MIME type. It should be text/html. This means that Firefox parses the document as HTML not XHTML. Web browsers normally display HTML regardless of any errors on the page, so the page is rendered.

A Basic XHTML Document

File Extension

A user can still use the standard .html or .htm extension, but now the user can use the following:

• .xhtml
• .xht
• .html
• .htm

You can use any of these for all the XHTML standards.

XML Declaration

It is a good idea to begin all XHTML, or indeed any XML application, with an XML declaration. XML declarations explicitly state which version of XML and which character encoding we are going to use. For example, if we wanted to use XML 1.0 with Western European character encoding, our XML declaration might look something like this:

<?xml version="1.0" encoding="iso-8859-1"?>

Note that if no XML declaration is stated, the document is assumed to be XML 1.0 with UTF-8 character encoding.

Doctype Declaration

Your XHTML isn't valid unless it has a doctype. Doctypes are actually SGML statements which tell the browser what version of XHTML you are using. For example, to let the UA know that we want our markup to be served as XHTML 1.0 Strict, we need only input the following:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Tags and Elements

XHTML uses tags. Tags are pieces of text enclosed in less-than (<) and greater-than (>) signs. An example of a tag in XHTML is the <html> tag, in which all XHTML documents are enclosed. In XHTML, all tags should be in lower case.

Tags are composed of the tag name and the attributes. The tag name determines the type of tag, and the tag attributes give more information about the tag. For example, in the <a> tag, used mainly to make links, the href attribute is used to say where those links should go. A hyper-link to https://www.wikibooks.org would be written as <a href="https://www.wikibooks.org/">.

Tags are useless unless they are part of an element, or a tag with information between an opening tag and a closing tag. A link to https://www.wikibooks.org with the text "Wikibooks" written inside of it would be written as <a href="https://www.wikibooks.org/">Wikibooks</a>. That comes out to Wikibooks. The closing tag is the same as the opening tag except it starts with a slash (/) and doesn't repeat the attributes.

Elements can be nested. That means that there can be elements that are completely inside another element. An example of this would be

<a href="https://www.wikibooks.org/"><span id="wikibooks">Wikibooks.org</span></a>

You'll learn what the <span> tag does later.

A Sample Document

As I said before, the document starts with an <html> tag. The document also ends with </html>. These two tags and everything in between are referred to as an html element. Two elements must be nested inside the html element: the <head> element and the <body> element. Of course, other elements may be nested or sub-nested within these elements.

The <head> element is, for now, only to house the <title> element. The title is put between the <title> begin and end tags. So the overall syntax of the <head> element is, for a title of "Wikibooks":

<head>
  <title>
    WikiBooks
  </title>
</head>

Of course, this cannot be in a .html file alone, but making this into a complete XHTML file isn't much more work. As I already said, you have to put an <html> tag around the whole thing. But you also need a place for the content. Hence, the <body> element. The <body> element is put within the <html> element. For now, we'll just put text within the <body> element. The text will show up in most browsers in Times New Roman 12-point font and wrapped around the screen. Any kind of whitespace will show up as one space. So here's a sample XHTML document with the title "Wikibooks" and the content "Wikibooks is a great website.":

 <?xml version="1.0" encoding="iso-8859-1"?>
 <!DOCTYPE html 
   PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   <head>
     <title>
       Wikibooks
     </title>
   </head>
   <body>
     <p>
       Wikibooks is a great website.
     </p>
   </body>
 </html>

The first line is the doctype. This tells the browser what type of document the file is. All valid HTML and XHTML documents have a doctype. We will be using the XHTML 1.0 Strict doctype.

DTD (Document Type Definition)

Introduction

An XHTML DTD describes the allowed syntax and grammar of XHTML markup. Every XHTML document must start with a DTD declaration and a line of code that declares that you are starting to write XHTML code.

This is the mandatory minimum way to start an XHTML document:

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

The Three Document Type Definitions

There are currently three XHTML 1.0 document types:

• Strict
• Transitional
• Frameset

XHTML 1.0 Strict

This is used when the user wants a clean markup, free of presentational clutter. Use this in conjunction with Cascading Style Sheets.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org
/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML 1.0 Transitional

Use this when taking advantage of XHTML's presentational features and when you want to support browsers that do not understand Cascading Style Sheets. This is the one that is favored to use among developers and is used commonly.

<!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 when you want to use XHTML Frames to partition the browser window into two or more frames.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

XHTML 2.0

XHTML was a working draft, but its development was halted in favor of HTML 5.0. Even though the specification will not be completed, its doctype is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 2.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml2.dtd">

XHTML Grammar

Introduction

There is little difference in grammar between HTML coding and XHTML coding. In this chapter we will discuss the similarities and the differences in the coding.

What Is Still The Same In XHTML?

A lot actually, but it has to be more structured. For example, in HTML you do not have to put p (paragraph) tags in; they are optional. In XHTML you have to.

In other words you cannot put text directly into the body anymore, the user must add elements to the text. The elements have not changed drastically. The following sections discuss changes.

Casing in XHTML

As mentioned, the coding is strict compared to HTML. One such case is that the tags and attributes have to be lowercase. In HTML you could get away with this:

<P>This is a paragraph</p>

In XHTML, this is not valid. ALL tags and attributes must be in lowercase, like this:

<p>This is a paragraph</p>

This is correct XHTML, all the tags are in lowercase.

Opening and Closing Tags in XHTML

As in normal HTML, you must close the tags. In HTML browsers, you could get away with it, it would still show the webpage, but it ends up looking unusual. Now in XHTML, Opening and Closing tags are musts. Like this:

<p>The <b>Cat</b> sat on the mat.</p>

This is good XHTML coding, remember to open and close a tag. Notice that the tags are also well formed. The b (bold) tag is within the p (paragraph) tag.

Empty Tags

No tag pair should be empty. If you need to represent an empty tag, you need to include a slash within the tag itself. For example, <br> is replaced with <br />.

Dealing with Attributes

As mentioned, attributes must be lowercase. For example:

content="text/html; charset=iso-8859-1"

Also notice that the value of the attribute is quoted. There are also some attribute values that are in capitals, such as:

http-equiv="Content-Type"

This is a rare case. The attributes must have a value; they cannot stand alone any more.

Linking and URL Techniques

When it comes to internal linking, things have changed. This is the XHTML way of doing it:

This is the link that takes you to the section on the page:
<a href="#Fred">Go to Fred</a>
This is the position where the link will take you:
<p id="Fred">This is Fred</p>

Some criticize that the developer still has to add the old "name" attribute to the tag. This is still okay to do, as some old browsers may not read the new command.

The developer also has to worry about ampersand characters. These are special characters in page addresses or forms, such as those used in PHP forums. If the user has to code one of these into XHTML, he or she has to change the following:

<a href="forum.php?&style=orange">Forum</a>

becomes

<a href="forum.php?&amp;style=orange">Forum</a>

Notice that the & became &.

Images

Nothing much has changed in the way of images. The only thing that the user has to consider is the alt attribute. In HTML, it was optional to have this. Now it is compulsory to put this in, in the event that the image cannot be rendered:

<img src="photo.gif" alt="Photo of the Beach" />

What this does is display a text were the photo is supposed to be when it cannot be found in the source file.

Applets

Although the applet tag was usable but considered bad development, strict XHTML no longer allows it. If you want to use an applet, whether Java or Flash, you will have to use the object tag from now on.

Deprecated Tags

You can still use these tags when you declare the DTD Transitional or Frameset (except for <xmp>) but it is recommended that you do not use these:

• <applet>
  

• <basefont>
  

• <b>
  

• <center>
  

• <dir>
  

• <font>
  

• <i>
  

• <isindex>
  

• <menu>
  

• <s>
  

• <strike>
  

• <u>
  

• <xmp>
  

These tags are invalid in XHTML 1.1

XHTML Documents

Basic XHTML documents

All XHTML documents follow a minimal pattern for document layout:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

The <!DOCTYPE> tag is the document type definition (described in the previous chapter) that identifies the standard being used.

The <html>...</html> tag pair is the root tag that specifies an XHTML document. It requires two tags: the xmlns is the namespace tag that restates the specific context of the standard, and is normally a URL to the W3 specification. The xml:lang tag specifies the language of the document.

<head>
  <title>My Document's title</title>
</head>

The <head> tag pair of the document concerns the meta data of the document. It must contain the title of the document enclosed within the <title tags.

<body>
  <p>Hello World!</p>
</body>

The <body> tag pair indicates the main content of the XHTML document. Within this tag, it encloses additional sub-tags to indicate paragraphs and other formatting information that is presented to the user.

XHTML Structure

Within the body of the html document, content is broken into a discrete structure. The most common form of separation involves the <p> tag pair, which marks a section of text as a paragraph. A paragraph is a section of text, and may also also include quotes, listings or other components that are contained in nested tags. However, it does not directly contain another paragraph.

Headers of text are identified the numbered series ranging from <h1> through <h6>. They may also be identified by <h> tag pair, in combination with the <section> tag pair; the sections may contain additional headers or paragraphs.

Additional structure to the document can be created using the <div. This tag pair is used to aid layouts within the document, and may contain additional paragraphs or headers within the container.

To separate two parts of the document, the <separator /> is places between two paragraphs or elements.

Other structure tags

• <address> is used to mark contact information, normally with the href attribute.
• <blockcode> is used to mark a block of code where whitespaced layout is important.
• <blockquote> is used to identify a large quotation.
• <pre> is used to identify preformatted text.

Inline text tags

A set of text within text may have tags to describe modifiers to the text.

Element	Description
<a [href="(link)" | id="#tag"] >	Defines an anchor for an explicit link or tag location. In XHTML, the href and id attributes can be placed on almost any tag as desired.
<abbr full="#tag">	Defines an abbreviation. The full attribute references an id within the same document as the abbreviation.
<cite cite="(source)">	Provides a citiation, where the cire attribute references the source material.
<code>	Refers to computer code.
<dfn>	Refers to a definition
<em>	Puts emphasis on the text, such as italics. Less important than <strong>.
<kbd>	Refers to user input.
<l>	Refers to a line of text.
<q>	Refers to quoted text, but does not add quotation marks. May use the cite attribute.
<samp>	Refers to sample output from a computer program.
<span>	A generic container for use with styling.
<strong>	Puts emphasis on the text, such as bolding. More important than <em>.
<sub>	Indicates a subscript.
<sup>	Indicates a superscript.
<var>	Indicates a variable in a computer program.

Lists

Outer list tag	Innter list tag	Description
<ol>	<li>	An ordered list. <li> may contain a value attribute.
<ul>	<li>	An unordered list.
<dl>	<di>	A definition listing.
<dl> or <di>	<dt>	A word being defined. May appear multiple times to indicate separate spellings.
<dl> or <di>	<dd>	The definition of a word. May appear multiple times to indicate separate definitions.
<nl>	<li>	Entry in a navigation listing.
<nl>	<label>	A label for a navigation listing. Labels may appear in other types of lists.

Hyperlinking

Hyperlinks work in XHTML in the same manner as HTML. An href attribute is added to the an anchor element:

<a href="http://www.example.com/">Example</a>

In XHTML 2.0, hyperlinks be placed directly on any element without the need of an anchor tag. As such, elements such as images can be used for a hyperlink.

Image maps

A more advanced form of hyperlinking involved navigation maps. This requires an element to use an image, and to include the usemap attribute to reference an id of a navigation map. Within the navigation list, there are two additional attributes to use: shape, and coords. The coordinates are comma-delimited.

shape	Description	coords
default	Specifies the entire region.	N/A
rect	Specifies a rectangle, with the two corners.	Two X-Y coordinate pairs.
circle	Specifes a circle with a given radius.	An X-Y pair, and a radius.
poly	Specifies an arbitrary shape.	Multiple X-Y pairs outlining the polygon.

Within the navigation list, items apparing first within the list take priority if they overlap with another entry in the navigation map. In addition, navigation lists that do not include an href attribute will be inactive.

If ismap="ismap" is used on the image attribute, the image map is treated as a server-side map. The client will automatically append the coordinates to the URL sent to the server on this form of map (or "0,0" if they are unable to do so.)

Tables

Tables are created in an XHTML document using the <table> tag pair. A table is a grid of cells that is displayed.

Within a table, the <colgroup> and <col> tags are used to specify a formatting or class to a set of columns. These two tags, which allow the span attribute, will cause a given column of cells to obtain a specific format (such as background colour or style sheet).

The <summary> tag pair is used to provide a summary of the table. This is usually a caption about the table, such as a brief description about the table itself.

The <tbody> tag pair identifies the body of the table. It will enclose the row and cell tags that will be described shortly.

The <tr> tag pair identifies a row within the table. Each pair of this tag will contain the cell definitions, whether they are a header or content cell.

The <td> tag pair identifies a cell within a table. The <th> tag pair identifies a cell within a table, which is treated as a header and given emphasis. Cells may span multiple columns or rows with the colspan or rowspan attribute. Some cells may require uting an abbreviation, which is performed using the abbr attribute.

The <thead> tag pair identifies the table's header.

The <tfoot> tag pair identifies the table's footer.

Stylesheets

Style sheets give a description on how to render an XHTML document. Style sheets are not a direct part of the XHTML standard, but are extremely important for determining the layout or display of the document.

They are declared using an empty <style tag, and use the src attribute for the document source and type to specify the type of style sheet (usually "text/css"). An inline style sheet omits the src attribute and contains the affected text within the main element.

External stylesheets may also be included by using <?xml-stylesheet ?> with the href and type showing the source and type of stylesheet.

If desired, a style can be included directly within an HTML element using the style attribute.

Metadata

The <head> tag pair contains the initial description of the document. In addition to the basic title, this section of the document contains metadata useful for categorizing the document.

Meta data has the following attributes available:

Attribute	Description
about	An about URL for the page.
content	Specifies meta data for the associated content. By default, it uses the content within the tags.
datatype
rel	Used with about; specifies relationship.
property	Identifies a property with the XHTML document (see below)

Metadata also provides properties that describe additional information in the document. When the property attribute is set to an entry in the following table, it has the following effect or result:

Property	Description
description	Provides a description of the resource.
generator	Identifies software used to write the resource.
keywords	Comma separated list of keywords for search engines.
reference
robots	Advises robots on behaviour; specific to web crawlers.
title	Specifies a title for the resource.

Meta hyperlinks

In the head tag, you can include hyperlinks to provide information about the next and previous documents. This is done using an empty <link tag, with the href and rel attribute.

XHTML Attributes

In XHTML, attributes are used to give additional context or description to an element. Most commonly, you will see them as hyperlinks, but they also aid in the presentation of the text.

Common attributes

Attribute	Description
class	Assigns a class to an XHTML element; used to assist in reader interpretation (such as style sheets.)
style	Assigns a style to an XHTML element. This applies to one element; for multiple items or layout, you may want to use classes.
id xml:id	Assigns a unique id to an element within the document. Used for anchor targets.
title	Provides a title to an element (such as a link).
xml:lang	Specifies the language of an element.

Formatting attributes

Attribute	Description
edit	Used to indicate a change in text. May be "inserted", "deleted", "changed" or "moved".
datetime	Indicates a time something was changed. Normally used in combination with edit attribute.
dir	Direction of text, for use with left-to-right or right-to-left languages. May be one of "ltr", "rtl", "lro", or "rlo"
layout	Either "irrelevant" (default) or "relevant" (as with the <pre> tag). Determines whether excess whitespace is ignored.
media	Specifies the content the media is intended to be displayed on; it is ignored if it doesn't match. Defaults to "all", but may be "aural", "braille", "embossed", "handheld", "print", "projection", "screen", "tty", "tv", or other value not-yet specified.

Hyperlinking

Attribute	Description
cite	Indicates that the material in question arrived from a different source.
href	Indicates a destination when a link is activated or clicked on.
hreflang	Indicates the language of the given link.
hrefmedia	Indicates the type of media of the given link.
hreftype	Descrives the type of content from the link (e.g. "text/html").
nextfocus prevfocus	Determines the order for the elements concerning user input. Implementation specific.
target	Determines the environment where the link will be opened.
key	Determines the access key for the element.
targetid	Used in combination with the key attribute. Specifies which element receives the event when a key is pressed.
targetrole	Specifies the role of the target.
xml:base	Specifies the base URL, when relative links are used in the document.
rel	When used with href, identifies the relation of the linked document. May be one of "alernate", "start", "next", "prev", "up", "contents", "index", "glossary", "copyright", "chapter", "section", "subsection", "appendix", "help", "bookmark", "meta", "icon", "p3pv1" (policy reference file), "profile", "role", and "cite".
rev	The inversion of rel; the document referenced by href has the designated relationship with this document.

XHTML Objects

In HTML, objects could only be attached to specific image tags or object tags. This changed with XHTML, where these images or resources can be attached to almost any tag.

Images

Images can be explicitly specified with the img tag. XHTML also provides the ability to attach images to span tags as described blow. A significant change from HTML is that there is no longer an alt attribute to describe the image if it cannot load; instead, the content enclosed within the tag pair (if any) is displayed if the resource cannot be loaded.

The src attribute contains a URL to the resource in question. If the resource can be loaded, it replaces the tag with the object itself. Otherwise, the content within the tags is displayed instead. This attribute is used in combination with srctype, which provides information about the resource in question. Typically, it may appear as "image/png" or "image/jpeg".

The encoding attribute identifies the character set of the resource, if it is a text document.

An image can also be used as a navigation map with the usemap attribute, which refers to an id of a navigation list within the element. The <li tags within the navigation list will have the shape and coords elements to specify the details of the navigation map.

Objects

Arbitrary objects within XHTML are declared by the <object tag. The object itself is loaded from the src attribute. If the object is loaded successfully, it will be loaded with the parameters enclosed within the object tag. However, a failure will cause the enclosed to be rendered instead.

The following attributes are used:

Attribute	Description
src	The source of the object.
srctype	The type of object, such as "image/png", "audio/mpeg", or "application/x-java-applet". Other types are possible.
id	A unique identifier for the object, if applicable.
archive	Provides additional URLs which are related to the object.
content-length	Provides the size of the object in question.
declare="declare"	If present, causes the object to be loaded after the document finished loading.

Parameters

Within the object tag, parameters can be included to provide information to the loaded object.

The <param> tag uses two base attributes; name which is the name of the parameter, and value which is the content of the parameter. In addition, the param tag can also use valuetype if the parameter's value is a reference (ref) or object (object). Be default, the value type of the parameter is data.

Standby

Content within a <standby> tag is displayed when an object is loading, but hasn't yet finished.

Scripting objects

The <handler> tag indicates a script that handles events within the document. If the browser is unable to load the handler, it will process the content enclosed within the handler tag pair instead, including additional nested handler elements.

With the handler element, the type attribute is mandatory. It describes the scripting language used, such as "text/javascript".

XHTML Validating

Introduction

Validating is done through the W3C Markup Validation Service. The W3C allows the user to check the documents for conformance to XHTML.

The Website

The validating website is http://validator.w3.org/

HTML vs. XHTML

Despite what the title may suggest, the aim of this module is not state which version is "better". Each language has a specific use cases, and this guide simply exists to clarify these scenarios.

What are the Differences Between the Two?

Syntax

XHTML has a stricter, XML-based syntax that does not appear in HTML, therefore making it slightly more advanced for new users.

The most important change is that there are no unpaired tags such as or <->.As such, there is now a corresponding closing tag, or the tag is immediately closed within the tag itself. + JavaCorehtml5

Which Version is Right For Me?

(This section is only meant to highlight the positives for each language.)

The Case for HTML5

You should use HTML if the following conditions are met:

• I want cross-compatibility without resorting to complex methods.
• I want to use the most established, thus most bug-free version of HTML.
• I want more flexibility when it comes to error-handling.

The Case for XHTML

You should use XHTML if the following conditions are met:

• I want to take advantage of XML applications such as MathML and XSL.
• I want to take advantage of XML's more efficient parsing processing.
• I want to use XHTML's inherent extensibility to create custom elements.