Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 2 of 2)

Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 2 of 2)

Summary: This article provides detailed instructions about how to install and use the Outlook 2007 Tool: HTML and CSS Validator. Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 1 of 2) provides reference documentation related to supported and unsupported HTML elements, attributes, and cascading style sheets properties. (6 printed pages)

Zeyad Rajabi, Microsoft Corporation

Erika Ehrli, Microsoft Corporation

August 2006

Applies to: 2007 Microsoft Office System, Microsoft Expression Web Designer 2007, Microsoft Office Outlook 2007, Microsoft Office SharePoint Designer 2007, Microsoft Office Word 2007, Microsoft Visual Studio 2005

Download Outlook 2007 Tool: HTML and CSS Validator.

Contents

*

Introduction to HTML and Cascading Style Sheet Capabilities in Outlook
*

Validating HTML and Cascading Style Sheet Grammar Using HTML Editors
*

Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Visual Studio 2005
*

Walkthrough: Validating HTML and Cascading Style Sheet Grammar using Office SharePointDesigner 2007
*

Walkthrough: Validating HTML Grammar Using Expression Web Designer 2007
*

Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Dreamweaver MX 2004 or Dreamweaver 8
*

Conclusion
*

Additional Resources

Introduction to HTML and Cascading Style Sheet Capabilities in Outlook

Microsoft Office Outlook 2007 uses the HTML parsing and rendering engine from Microsoft Office Word 2007 to display HTML message bodies. The same HTML and cascading style sheets (CSS) support available in Word 2007 is available in Outlook 2007.

*

Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 1 of 2) provides reference documentation related to supported and unsupported HTML elements, attributes, and cascading style sheets properties.
*

This article provides detailed instructions about how to install and use the Outlook 2007 HTML and CSS Validator tool.

The Outlook 2007 HTML and CSS Validator tool helps you to validate HTML and cascading style sheet grammar using some of the most popular Web development tools, such as Microsoft Office SharePoint Designer 2007, Microsoft Expression Web Designer 2007, Microsoft Visual Studio 2005, Macromedia Dreamweaver MX 2004, and Macromedia Dreamweaver 8.

These articles and accompanying tools are provided for your use and can help you to understand the new capabilities offered with the switch to the Word 2007 HTML parsing and rendering engine. This information can help you understand how to create e-mail newsletters or other complex HTML documents that render in Outlook 2007.
Validating HTML and Cascading Style Sheet Grammar Using HTML Editors

Some HTML editors enable you to validate HTML and cascading style sheets grammar. The Outlook 2007 HTML and CSS Validator tool helps you to determine if your Web (HTML and cascading style sheet) files will render correctly in Outlook 2007 using some of the most popular Web development tools.

The Outlook 2007 HTML and CSS Validator tool installs and configures the following schema, XML, or text files to your computer depending on which Web development tool you are using:

*

WordHTML.xsd Schema used to validate whether the specified HTML file will render correctly in Outlook 2007. This file is used by SharePoint Designer 2007, Expression Web Designer 2007, and Visual Studio 2005.
*

WordCSS.xml XML file used to validate whether the specified cascading style sheets file will render correctly in Outlook 2007. This file is used by SharePoint Designer 2007, Expression Web Designer 2007, and Visual Studio 2005.
*

Word2007.txt Text file used to validate whether the specified HTML file will render correctly in Outlook 2007. The file is used by Dreamweaver MX 2004 and Dreamweaver 8.
*

Word2007_CSS.xml XML file used to validate whether the specified cascading style sheets file will render correctly in Outlook 2007. The file is used by Dreamweaver MX 2004 and Dreamweaver 8.

During setup of the Outlook 2007 HTML and CSS Validator tool, you can choose among five different Web development tools.

Download and install Word2007MailHTMLandCSS.exe if you work with:

*

Microsoft Office SharePoint Designer 2007
*

Microsoft Expression Web Designer 2007
*

Microsoft Visual Studio 2005

Download and install Word2007MailHTMLandCSSMacromedia.exe if you work with:

*

Macromedia Dreamweaver MX 2004
*

Macromedia Dreamweaver 8

Based on your selection, the Outlook 2007 HTML and CSS Validator tool deploys the appropriate schemas and configures your computer.
To download and install the Outlook 2007 HTML and CSS Validator tool

1.

In your browser, go to Outlook 2007 Tool: HTML and CSS Validator.
2.

Download and save the file to a folder on your computer.
3.

Run the Word2007Support.msi or Word2007SupportMacromedia.msi file from the location where you saved it. This launches the installation wizard.

Figure 1. Outlook 2007 HTML and CSS Validator Setup Wizard

Outlook 2007 HTML and CSS Validator Setup Wizard
4.

Click Next and then accept the license agreement.
5.

Click Next again. If you are running Word2007MailHTMLandCSS.exe, select one or more Microsoft HTML/cascading style sheet editors.

Figure 2. Select among the Microsoft HTML/cascading style sheet editors

Select among the Microsoft HTML/CSS editors

If you are running Word2007MailHTMLandCSSMacromedia.exe, select the installation folder for the Outlook 2007 HTML and CSS Validator files.

Figure 3. Select the installation folder

Select the installation folder
6.

Click Next, and then click Next again to finish the installation.
7.

Click Close to exit the wizard.

After installing the tool, you can start validating HTML and cascading style sheet files using your HTML editor.
Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Visual Studio 2005

To optimize performance, Visual Studio uses the Microsoft Windows registry to specify which schemas to load. You must configure Visual Studio to load this file.
NoteImportant:

Incorrectly editing the registry may severely damage your system. Before making changes to the registry, you should back up any valued data on the computer.
To configure the registry

1.

Start Registry Editor (Regedit.exe).
2.

Locate and click the following key in the registry:

HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\VisualStudio\8.0\Packages\{1B437D20-F8FE-11D2-A6AE-00104BCC7269}\Schemas

3.

Create a subkey with the next number in sequence. For example, if the highest schema number listed is Schema 20, create a subkey named Schema 21.
4.

Create additional registry keys in the folder with the keys, as shown in the following figure.

Figure 4. New registry keys for the HTML schema file

New registry keys for the HTML schema file
5.

Locate and click the following key in the registry:

HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\VisualStudio\8.0\Packages\{A764E895-518D-11d2-9A89-00C04F79EFC3}\Schemas

6.

Create a subkey with the next number in sequence. For example, if the highest schema number listed is Schema 4, create a subkey named Schema 5.
7.

Create additional registry keys in the folder with the keys, as shown in the following figure.

Figure 5. New registry keys for the cascading style sheet schema file

New registry keys for the CSS schema file
8.

Exit the Registry Editor.

To validate schemas using Visual Studio 2005

1.

Start Visual Studio 2005.
2.

Open an HTML file to validate against the Word 2007 schema or create an HTML file.
3.

From the validation schema list, select Word 2007, as shown in the following figure.

Figure 6. Choosing the validation schema

Choosing the validation schema

After selecting the schema, any invalid HTML or cascading style sheet (as defined in your schema) is marked with a red underline. In addition, Microsoft IntelliSense context help displays when you type.
Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Office SharePoint Designer 2007

1.

Start SharePoint Designer 2007.
2.

On the Tools menu, click Page Options.
3.

On the Authoring tab, under Document Type Declaration and Secondary Schema, in the DocType list, choose None.
4.

In the Secondary Schema list, choose HTML for Word 2007.
5.

Under CSS Version, in the Schema Version list, choose CSS for Word 2007, as shown in the following figure.

Figure 7. Validation schema in SharePoint Designer 2007

Validation schema in SharePoint Designer 2007

After selecting the schema, any invalid HTML or cascading style sheet (as defined in your schema) is marked with a red underline. In addition, IntelliSense context help displays when you type. By specifying no primary schema and specifying the secondary schema as Word 2007, you can validate your Web files to render correctly in Outlook 2007.
Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Expression Web Designer 2007

1.

Start Expression Web Designer 2007.
2.

On the Tools menu, click Page Options.
3.

On the Authoring tab, under Document Type and Secondary Schema, in the DocType list, choose None.
4.

In the Secondary Schema list, choose HTML for Word 2007.
5.

Under CSS Version, in the Schema Version list, choose CSS for Word 2007, as shown in the following figure.

Figure 8. Validation schema in Expression Web Designer 2007

Validation schema in Expression Web Designer 2007

After selecting the schema, any invalid HTML or cascading style sheet (as defined in your schema) is marked with a red underline. In addition, IntelliSense context help displays when you type. By specifying no primary schema and specifying the secondary schema as Word 2007, you can validate your Web files to render correctly in Outlook 2007.
Walkthrough: Validating HTML and Cascading Style Sheet Grammar Using Dreamweaver MX 2004 or Dreamweaver 8

1.

Start Dreamweaver MX 2004 or Dreamweaver 8.
2.

Click No Browser Check Errors.

Figure 9. No Browser Check Errors in Dreamweaver

No Browser Check Errors in Dreamweaver
3.

Click Settings….
4.

Verify that Word 2007 is checked, as shown in the following figure.

Figure 10. Validation schema in Dreamweaver

Validation schema in Dreamweaver
5.

Open an HTML file or create an HTML file to validate.
6.

Click No Browser Check Errors and select Check Browser Support.

After selecting the schema, any invalid HTML or cascading style sheet (as defined in your schema) is marked with a red underline.
Conclusion

This series of articles is intended to help you to create e-mail newsletters and other complex HTML documents that render in Outlook 2007. The Outlook 2007 Tool: HTML and CSS Validator validates HTML and cascading style sheets grammar using some of the most popular Web development tools.

This material provides the most up-to-date and accurate information at the time of publication, but it is not a comprehensive reference guide. Report any technical inaccuracies that you find to the microsoft.public.word.mail newsgroup.
Acknowledgments

Thanks to Rob Little, Matt Scott, Dan Costenaro, and Terry Crowley for their contributions to this article.
Additional Resources

For more information, see the following resources.

*

HTML 4.01 Specification
*

Cascading Style Sheets, Level 1 Specification
*

Cascading Style Sheets, Level 2 Revision 1 Specification
*

What's New for Developers in Microsoft Office Outlook 2007 (Part 2 of 2)
*

What's New for Developers in Word 2007
*

For more information, see Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 1 of 2).

http://www.lifewithoutcolour.blogspot.com/