HTML 5 and Expression Web

*** IMPORTANT UPDATE ***

This Add-in is now superseded by Expression Web 4 SP1! Service Pack 1 adds many more features than just HTML 5 intellisense, including support for the CSS3 draft specification! If you’ve downloaded this HTML 5 Add-In the past, it’s no longer needed and can be be removed.

*************

If you wish to use the HTML 5 doctype in Expression Web AND have the Intellisense help for HTML 5 available, you will need to install the HTML5 Schema Configuration Add-In for Expression Web available for download in the Microsoft Expression Gallery. The HTML5 Schema Configuration Add-In for Expression Web enables the new HTML5 schema to check your markup for errors and provide IntelliSense for HTML5 tags, attributes and values in code view.

Download HTML5 Schema Configuration Add-In for Expression Web from the Gallery. Remember where you saved the file on your computer.  Follow these instructions for  Installing Expression Web 4 Add-ins.

If the add-in is correctly installed, it will appear in the Manage Add-In dialog, and the Standard toolbar will display a new “HTML5” button.

Manage Add-ins Dialog Box.

Standard Toobar with HTML5 button.

Standard Toobar with HTML5 button.

Using the HTML5 Schema Configuration Add-In

Before you can use the HTML5 Schema, you will need to configure it.

  • To do this you will need to restart Expression Web 4  with administrative privileges (Right-Click the EW4 program icon and select“Run as Administrator”).
  • Click the HTML5 button on the standard toolbar (pictured above). The Configure HTML 5 Schema dialog box allows you to enable or disable the new HTML5 schema.

    Enable HTML5 Schema.

    Enable HTML5 Schema.

  • Click the Enable HTML 5 button to update the Expression Web HTML 5 schemas. Close the dialog box.
  • Restart Expression Web 4. Click the HTML5 button on the standard toolbar and you will see the schemas are now enabled.
  • HTML5 schema has been configured.

    HTML5 schema has been configured.

  • To change your page editor options choose  Tools > Page Editor Options. On the Authoring tab, set both the Document Type Declaration option and Secondary Schema options to HTML5.

    Page Editor Options for HTML5 schemas.

    Page Editor Options for HTML5 schemas.

Once you have changed the Page Editor options Authoring tab to reflect the HTML5 schemas, whenever you create a new web page in Expression Web, the new page contains the HTML5 doctype which is:

<!DOCTYPE html>

Now, when you edit an HTML5 document in code view, Expression Web 4 now provides IntelliSense for HTML 5 elements, attributes and their values.

There are some known issues with the add-in which you can read about on the MSDN Blog post Add HTML5 support to Expression Web 4! and scroll down to “Known Issues.”

Trackbacks

  1. […] This post was mentioned on Twitter by T Clarke and P Geary. T Clarke and P Geary said: RT @patgeary: HTML 5 & Expression Web If U wish 2 use the HTML 5 doctype in EW & have the Intellisense helP… http://bit.ly/fC7wIS […]

  2. […] um tempo atrás no blog Expression Web Tips eles recomendavam um add-in para utilizar o Doctype do HTML5: HTML5 Schema Configuration Add-In for […]

Speak Your Mind

*