Microsoft Expression Web Gives Dreamweaver A Run For Its Money

It's often said that Microsoft doesn't perfect its major software apps until they reach version 3.0. In building an HTML editor, the developer appears to have needed even more versions than that.

Expression Web is a new site-development tool, now in public beta, that Microsoft is promoting as a replacement for its under-appreciated FrontPage application. If you count upwards from Vermeer FrontPage 1.0 -- the original HTML editor that Microsoft acquired in 1996 and turned into FrontPage 97, 98, 2000, 2002, and 2003 -- Expression Web must count as something like version 7.0.

The new application looks very much like FP03 when it's first started up. A user of the older application will find many familiar-looking (or even identical) menus and dialog boxes to put together Web pages.

But even bleeding-edge XHTML 1.1 developers will notice that Expression Web is a grown-up coding environment.

In fact, in conversations with coders who've used both products, I found a surprising level of respect for the maturity of Expression Web, even among people with years invested in the market-leading Macromedia Dreamweaver. (Macromedia is now a division of Adobe Systems after a late 2005 acquisition.)"I think there will be creative professional designers who will want to use Expression Web," said David Blatner, coauthor of Real World Photoshop. "It's a very impressive 1.0. If you already know Dreamweaver, there's not a compelling reason to switch to Expression Web, but if you're not using either of them, Expression Web will be easier to use."

Some naming confusion exists because Expression Web (formerly known as Expression Web Designer) is only one of three applications that Microsoft is branding with the catch-all label "Expression Products." The other two are Expression Graphic Designer, a program similar to Adobe Illustrator, and Expression Interactive Designer, a tool for creating Windows applications. For this review, I tested only Expression Web.

One of the most visible improvements that Expression Web offers over its predecessor is a multi-pane approach to editing HTML and XHTML documents. FrontPage 2003 is minimalistic, usually consisting of a single pane, although it can optionally be split to show both a Design view and a Code view. Expression Web, by contrast, opens by default with a handful of "task panes" visible. The central coding area is the most prominent but not necessarily the most noteworthy.

In particular, Expression Web users will find their attention drawn to the application's "CSS Property Task Pane." (See Figure 1 below.) This work area displays any Cascading Style Sheet properties that affect selected text or objects in the current document. Other editors, such as Dreamweaver and Adobe GoLive, have supported CSS properties in this way for years. But Expression Web's task pane is a big part of the product's very reason for being.

Since properties can "inherit" properties, however, even a relatively small document can quickly become confusing. The creators of Expression Web have made a commitment to the CSS way of building Web pages and want to help developers quickly see which properties apply to a given portion of a page.

The CSS Property Task Pane, therefore, acts like a hierarchical list that can be expanded or collapsed to reveal an object's characteristics. As with other good editors, furthermore, the list isn't just a static display. Properties can be edited within the pane, and the changes affect all similar objects.

In keeping with the Expression Web team's desire to help developers code to specific standards, a Page Options dialog allows users to dictate which HTML or XHTML version will be used. Expression Web uses only attributes of the selected version when converting text and images into code. For example, you can select the frameset, strict, or transitional versions of HTML 4.01; the corresponding versions of XHTML 1.0; or XHTML 1.1 (which comes only in a strict version). You can also specify CSS 1.0, 1.1, 2.0, or the IE 6 version of CSS. (See Figure 2 below.)

One area where Expression Web shines is in its support for version 2.0 of ASP.NET, Microsoft's application-development technology. Part of the Redmond company's overall .NET platform, the technique is widely used to develop XML-based Web services and other forms of interactive sites. (See Figure 3 below.)

Expression Web fully integrates with Microsoft's code-side ASP.NET tools, such as Visual Studio 2005 and Visual Studio Web Developer Express. Projects that involve hundreds or thousands of lines of code underlying a pretty Web interface can move with no effort between the two applications. Expression Web handles the look and feel of the site while the serious logic is applied in Visual Studio.

It's possible, of course, to open an ASP.NET 2.0 file in Dreamweaver. But true support for the platform isn't present. In Expression Web, by contrast, it's possible to drag and drop objects in the design environment and take advantage of the Microsoft utility's built-in understanding of the meaning of selected objects. (See Figure 4 below.)

To further support this integration, Expression Web allows the installation of an ASP.NET Development Server on the same workstation as the application. This development server launches to render ASP.NET projects without the need for a separate computer to act as a server.

For those who work in Microsoft shops or are heavily invested in ASP.NET 2.0 for their Web architecture, the new program offers support that Dreamweaver doesn't currently match.

Expression Web's focus on ASP.NET as a platform, however, contrasts with its weakness in supporting other Web development techniques. Microsoft's editor, for instance, doesn't play well with the PHP language or JSP (JavaServer Pages), two technologies that arguably enjoy usage on the Internet that's as broad as ASP.NET's penetration.

As with Dreamweaver's semi-capability regarding Visual Studio code, it's entirely possible for you to open a PHP script in Expression Web and hand-edit it. The PHP code, however, wouldn't benefit from any of Expression Web's Intellisense features, which colorize the different functions of a program and auto-complete code statements for the developer.

Another Dreamweaver capability that Expression Web lacks is any preview functionality for "include" files. Many Web sites control the look of thousands of individual pages by linking them to a single include file that contains common styles.

It would be inconceivable for sites that heavily rely on include files to turn back the clock and try to specify every style on every page it applies to. Dreamweaver, to its credit, previews Web pages with full awareness of any include files they link to. Expression Web does not.

Dreamweaver also operates on a Mac nearly identically to its Windows sibling. This fact has endeared it to Web designers who switch between the two environments as easily as night turns into day. Expression Web, like many Microsoft programs, doesn't have a Mac version and isn't ever likely to.Developers who require support for platforms other than Microsoft Windows — and language regimes other than ASP.NET — will find themselves frustrated with Expression Web.

Despite the sometimes-maddening omissions in Expression Web, it's attracting a following among serious creative types who previously wouldn't be caught dead with FrontPage on their widescreen monitors.

Brian Wood is a long-time Dreamweaver developer who is director of training at Evolve, an Adobe-authorized learning center in Seattle. With a foot in both worlds, he's also a moderator of Expression Web's online beta forum and is helping testers learn the Microsoft utility's power.

"The biggest thing going for Expression Web, honestly, are the CSS capabilities," Wood says. "The program does a great job of supporting Web standards. I can click something and see what properties apply to it and what it's inherited."Wood acknowledges that Dreamweaver can accomplish the same things, but that doesn't dissuade him from the allure of the newer product. "Some of the task panes within Expression Web are very similar to Dreamweaver. I don't care, I love it."

As a trainer, Wood particularly likes the fact that Expression Web's design view renders HTML and XHTML code somewhat more accurately on-screen than Dreamweaver seems able to. "There's some hinky little things in there," Wood says, that make Dreamweaver's previews look slightly different from the same code viewed in a standalone browser, such as Internet Explorer or Firefox. (See Figures 5 and 6, below.)

If many other Web developers get the same feeling of accomplishment from Expression Web that Wood does, Dreamweaver may get a good run for its money. As this point, it's a bit hard for Microsoft's offering to put much pressure on the champ. It's still impossible to buy the product and the current beta exhibits minor gotchas that keep anyone from broadly rolling it out.

Unlike FrontPage, Expression Web won't be included with any version of Microsoft Office, says product manager Smith. Instead, it'll be sold as a stand-alone application, along with the two other Expression products I described earlier.

The pricing for Expression Web hasn't been determined yet, Smith says. "We're expecting it to be between the $250 and $350 mark" whenever the list price is finally set, he speculated.

Like Microsoft's long-anticipated Office 2007 product, the Expression Web team has often said it will ship its code before the end of 2006. "We hope to get it out some time in December," Smith indicates.

The bottom line: Will you find yourself liking Expression Web enough to buy it? If the only HTML editor you've been using for years has been FrontPage, you'll probably want to upgrade. If you've mastered Dreamweaver well enough to run it with your eyes closed, however, Expression Web may do little to change your mind.

The current Beta 1 of Expression Web is available for download, free of charge, from Microsoft's Expression Products Home.

Brian Livingston is the author of 10 books on Microsoft Windows and the editor of WindowsSecrets.com. Send story ideas to him via his contact page.