If you’re designing for the web (especially with HTML5 and CSS3), take a look at Expression Web 4, a design-focused environment for HTML, CSS, validation, SEO, and more. See “Top 10 Features” for an introduction.
Expression Web 4 Service Pack 1 has just been released, adding a bunch of new features:
Let’s dive into the first three items in this post. The Expression Web team blog has a detailed post on the release, and there’s a What’s New page as well.
While some HTML5 support was available via add-ins prior to SP1, SP1 directly integrates support for all HTML5 tags. For example, semantic elements like article and aside:
Expression Web will flag HTML5 schema violations in real time:
And you can run the Compatibility Checker (Tools –> Compatibility Reports) for a detailed report:
Notice the hr element’s size attribute, deprecated in HTML5, has been flagged:
CSS3 support includes IntelliSense and error checking for the CSS3 draft specification. To enable this, open the Authoring tab in Tools –> Page Editor Options and ensure the CSS Schema is set to “CSS 3 draft”:
You’ll have IntelliSense for new CSS3 properties like pseudo-classes and pseudo-elements:
And by the way, IntelliSense goes beyond listing text:
CSS3 also extends to tools like the New/Modify Style dialog (including border-radius and box-shadow):
CSS Properties is CSS3-aware as well. For example, here are CSS3 border-radius and box-shadow properties, along with an HSL color model:
A constant challenge for web developers is seeing how a page renders in different browsers. The problem is, a single machine often can’t run all of the browsers (and multiple versions of the same browser) a designer wants to test.
Part of Expression Web, SuperPreview makes that easier. Fire up a web page and compare how it renders in multiple browsers, including Internet Explorer 9:
Here’s an overview of SuperPreview features to get you started. But let’s focus on what’s new…
Some pages you’ll want to test require a user to log in. The new Page Interaction Mode (CTRL+I) adds support for many of these login-protected pages. Just turn it on then head to the page and log in.
Additional browsers are available remotely via the SuperPreview Online Service. This service renders pages for you so you don’t need to install additional browsers/versions to compare results.
View the Online Service status to see which browsers/versions are available:
Now that you’ve seen all of this, how do you get Expression Web 4?
Then head to these places to learn more:
Enjoy creating those designs!
Too bad I can't install it! Keep getting an error that the Web_en.msi file is missing. Have post in forum, but no response.