Setting Up Dreamweaver to Follow XHTML Specifications

You are required to follow the XHTML 1.0 transitional specifications when creating all of your Web pages this term. (Review the specifications located at http://www.mccinfo.net/webresources/xhtml_specs.htm.)  The World Wide Web Consortium (W3C) has introduced Cascading Style Sheets (CSS) and XHTML (eXtensible HyperText Markup Language as a suggested replacement to HTML.  The layout and "look" of a Web page would be controlled by Cascading Style Sheets while the structure of the page would be controlled by XHTML.

XHTML 1.0 is written in XML and is the up-and-coming standard that will help Web designers prepare for the future.  XHTML 1.0 and HTML 4 are very similar.  The tags and attributes are nearly the same, but there are a few simple rules that have to be followed in order to adhere to the XHTML 1.0 specification.  For this course, these XHTML 1.0 Transitional specifications are required. 

Even though Dreamweaver will do a good job creating valid code, it isn't perfect. The validator tool in Dreamweaver will not catch all of the errors so you should still validate your code using the W3C's Validator (http://validator.w3.org).  This is the tool that will be used when grading your assignments, tests, and projects.

Dreamweaver provides several ways to help you accomplish this. When you create a new page, you can make it XHTML-compliant. You can also make an existing HTML document XHTML-compliant.

To create a new, XHTML-compliant document:

  1. Select File, New.

The New Document dialog box appears.

  1. Select Blank Page as the Category and HTML in the page list
  2. Select XHTML 1.0 Transitional in the docType drop down menu
  3. Click Create.

To create XHTML-compliant documents by default:

  1. Select Edit, Preferences or Dreamweaver, Preferences (Mac OS X) and select the New Document category.
  2. In the New Document category, select XHTML 1.0 Transitional in the Default Document Type (DTD) drop down menu
  3. Click OK.

To make an existing HTML document XHTML-compliant:

  1. Open the existing document
  2. Select File, Convert, XHTML 1.0 Transitional

About the XHTML code generated by Dreamweaver
(Information provided in Dreamweaver Help)

Dreamweaver generates new XHTML code and cleans up existing XHTML code in a way that meets most of the XHTML requirements. The tools that you need to meet the few XHTML requirements that remain are also provided.

Note: Some of the requirements also are required in various versions of HTML.

The following table describes the XHTML requirements that Dreamweaver meets automatically:

XHTML requirement

Actions Dreamweaver performs
There must be a DOCTYPE declaration in the document prior to the root element, and the declaration must reference one of the three Document Type Definition (DTD) files for XHTML (strict, transitional, or frameset).

Adds an XHTML DOCTYPE to an XHTML document:

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

Or, if the XHTML document has a frameset:

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

The root element of the document must be <html>, and the html element must designate the XHTML namespace. Adds the namespace attribute to the <html> element, as follows:

<html xmlns="http://www.w3.org/1999/xhtml">

A standard document must have the head, title, and body structural elements. A frameset document must have the head, title, and frameset structural elements.

In a standard document, includes the head, title, and body elements. In a frameset document, includes the head, title, and frameset elements.

All elements in the document must nest properly:

<p>This is a <i>bad example.</p></i>

<p>This is a <i>good example.</i></p>

Generates correctly nested code and, when cleaning up XHTML, corrects nesting in code that was not generated by Dreamweaver.

All element and attribute names must be lowercase.

Forces HTML element and attribute names to be lowercase in the XHTML code that it generates and when cleaning up XHTML, regardless of your tag and attribute case preferences.

Every element must have a closing tag, unless it is declared in the DTD as EMPTY.

Inserts closing tags in the code that it generates, and when cleaning up XHTML.

Empty elements must have a closing tag, or the opening tag must end with />. For example, <br> is not valid; the correct form is <br></br> or <br/>. Following are the empty elements: area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta, and param.

And for backwards-compatibility with browsers that are not XML-enabled, there must be a space before the /> (for example, <br />, not <br/>).

Inserts empty elements with a space before the closing slash in empty tags in the code that it generates, and when cleaning up XHTML.

Attributes can’t be minimized; for example, <td nowrap> is not valid; the correct form is <td nowrap="nowrap">.

This affects the following attributes: checked, compact, declare, defer, disabled, ismap, multiple, noresize, noshade, nowrap, readonly, and selected.

Inserts full attribute-value pairs in the code that it generates, and when cleaning up XHTML.

Note: If an HTML browser does not support HTML 4, it might fail to interpret these Boolean attributes when they appear in their full form.

All attribute values must be surrounded by quotation marks.

Places quotation marks around attribute values in the code that it generates, and when cleaning up XHTML.

The following elements must have an id attribute as well as a name attribute: a, applet, form, frame, iframe, img, and map. For example, <a name="intro">Introduction</a> is not valid; the correct form is

<a id="intro">Introduction</a> or <a id="section1" name="intro"> Introduction</a>.

Sets the name and id attributes to the same value, whenever the name attribute is set by a Property inspector, in the code that Dreamweaver generates, and when cleaning up XHTML.

For attributes with values of an enumerated type, the values must be lowercase.

An enumerated type value is a value from a specified list of allowed values; for example, the align attribute has the following allowed values: center, justify, left, and right.

Forces enumerated type values to be lowercase in the code that it generates, and when cleaning up XHTML.

All script and style elements must have a type attribute.

(The type attribute of the script element has been required since HTML 4, when the language attribute was deprecated.)

Sets the type and language attributes in script elements, and the type attribute in style elements, in the code that it generates and when cleaning up XHTML.

All img and area elements must have an alt attribute.

Sets these attributes in the code that it generates and, when cleaning up XHTML, reports missing alt attributes.