A DOCTYPE is a declaration at the very beginning of an HTML/XHTML file that tells the browser what kind of document it’s receiving. A valid DOCTYPE is the very first thing you need to make sure your page(s) will validate.
Expression Web 2 can work with any DOCTYPE; in fact, you’ll find the following seven in the Code Snippets library:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/ TR/html4/frameset.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/ strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/ DTD/xhtml11.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/ xhtml1/DTD/xhtml1-frameset.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/ TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ TR/xhtml1/DTD/xhtml1-transitional.dtd">
For a complete list of DOCTYPES, see the W3C’s list at http://www.w3.org/QA/2002/04/valid-dtd-list.html.
In addition to making a page valid, there’s an added benefit to a correct DOCTYPE: predictable browser rendering. To deliver consistent display in all browsers, the browser needs to be told what kind of file it’s displaying.
Troubleshooting
By default, Expression Web 2 inserts an XHTML 1.0 Transitional DOCTYPE on every page it creates and ensures that the code is appropriate for the DOCTYPE. The only time you need to consider the DOCTYPE is when you’re working on an existing site that was created by using another program or in a situation where you want to use a different DOCTYPE than the standard one that Expression Web 2 provides.
In this exercise, you will change the DOCTYPE of a file and then validate it.
Note
USE the CH3 sample site you modified in the previous exercise.
OPEN the CH3 site if it isn’t already open, and display the default.htm page in Split view.
At the top of the Code pane, locate the following DOCTYPE information:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
In the Code pane, select the entire DOCTYPE line, and then press
to open the Code Snippets list.Notice the seven different DOCTYPEs that are available from the Code Snippets list.
Click HTML 4.01 Transitional DOCTYPE, and then click Save.
Notice that the DOCTYPE is also shown on the status bar of Expression Web 2.
Preview the page in a browser.
The preview page appears to be the same as when you first opened it.
Open another tab in your browser or open another browser window and go to validator.w3.org. Click the Validate by File Upload tab, click Browse, double-click the local copy of this page, and then click Check. Instead of the previously valid page, a failing page with four errors is now displayed.
Close the browser, and in Expression Web 2, display the default.htm page.
In the Code pane, red underlines appear beneath items that don’t match the DOCTYPE you selected in step 3.
In the Code pane, select the DOCTYPE, press
to open the Code Snippets list, and click XHTML 1.0 Transitional DOCTYPE to return the page to its original state.
Setting the DOCTYPE
Besides manually setting the DOCTYPE in the source of your document, you can use the Page Editor Options dialog box of Expression Web 2. To open the dialog box and access the settings, on the Tools menu, click Page Editor Options, and then click the Authoring tab of the dialog box. You can set the default DOCTYPE for all new files, set .htm or .html file as the default extension, choose whether to use a Byte Order Mark with various file types, and an array of other options.
Troubleshooting
The DOCTYPE of a file in Expression Web 2 dictates the IntelliSense, compatibility, validity, and accessibility testing rules. If you change a DOCTYPE, Expression Web 2 changes the way it treats the page code. Don’t conclude, however, that using a looser or lower DOCTYPE is a cure for old sites that you’re trying to clean up by using Expression Web 2. Generally, it’s best to add a modern DOCTYPE and bring the code up to that standard.