Updating your site with standards-compliant HTML
(from the Expression Web Team Blog)
FrontPage helped bring WYSIWYG publishing to the World Wide Web. Since those early beginnings, however, the web has changed; countless new technologies have emerged, evolved, and slipped into obscurity. The World Wide Web Consortium (W3C) has led the way in defining the web’s technological common ground, referred to as web standards. Websites that conform to W3C web standards are referred to as standards-compliant.
In this article, we’ll start the migration process by cleaning up the code so that it’s more in alignment with web standards and start moving style and formatting out of the web pages and into a cascading style sheet (CSS).
Before we begin, I strongly encourage you to make a backup copy of your website.
DOCTYPE
Browsers read the DOCTYPE declaration on a page to determine which version of HTML (or XHTML) the page uses. Expression Web uses the DOCTYPE declaration for validation and IntelliSense code completion. Adding a DOCTYPE declaration to your website’s pages makes it easier to create and maintain valid code throughout your project.
If your project contains no FrontPage web components, set the DOCTYPE to XHTML Transitional. If your project does contain FrontPage web components, you’ll experience fewer problems if you set the DOCTYPE to HTML 4.01 Transitional.
To set the DOCTYPE for a single page, from the Expression Web Code view:
Press CTRL+HOME – the cursor moves to the head of the page (Line 1, Column 1)
Press CTRL+ENTER – the DOCTYPE menu displays.
Select the appropriate DOCTYPE from the drop-down list.
Repeat this procedure to set the DOCTYPE for every page in your project.
Now that the existing pages all have DOCTYPE declarations, this would be an excellent time to set the DOCTYPE for the entire project so that any new documents you add to the site are created with the correct DOCTYPE declaration. Click Tools, and then click Page Editor Options. Select the Authoring tab and set the Document Type Declaration.
Code cleanup
Once you’ve set the DOCTYPE declaration on a page and while you’re still in Code view, right-click on the page and select Reformat HTML. This will tidy up the code formatting and attempt to validate the page against the declared DOCTYPE. If there are any code errors, Expression Web will highlight them in yellow. DOCTYPE validation errors are displayed with a squiggly red underline.
Go through the code and clear up what you can. When you hover your mouse cursor over an error, a tooltip displays with details about the error to help you find a solution.
Moving the presentation out of the HTML page
More on this to follow
Tweet This Post