Expression Web 3: A Developer's Overview
Introduction to Expression Web 3
Recently, I took a look at one of the premier web design software packages available today, Dreamweaver CS4. In this article Ill begin to explore another popular web design suite, Expression Web 3 from Microsoft. Ill cover some of the best features of Expression Web 3 as well as point out a few shortfalls.
When you purchase or download the trial version of Expression Web 3 you will actually get 3 products, Expression Web, Expression Design and Expression Encoder. Each are very specific in their purpose but are designed to complement one another. Here is a breakdown of each piece:
Expression Web This is the workhorse of the suite. It handles all of your standard design needs for coding and designing. Its the base web design piece that Expression Design and Expression Encoder are designed to complement.
Expression Design Here you will take care of your graphic design needs. This piece has nothing to do with the layout and design of your web pages; its strictly a graphic generation tool. Its basically Microsoft Paint on steroids. If you have ever used Adobes Photoshop or Illustrator products then you will feel quite at home with the look and feel of Expression Blend. The tools and functionality are fairly similar.
Expression Encoder If you are heavily into video and/or you use Microsofts Silverlight in your website design work then this product will be just what you are looking for. It has support for video capture, video streaming (with IIS), and tight integration with Silverlight.
While each of the three pieces mentioned above are useful to a web designer, we are focusing on products that provide actual web design and coding functionality, i.e. Expression Web. If you are interested in learning more about Expression Design or Expression Encoder you can read about them and even download a trial version for the Microsoft website.
There are several features of note in Expression Web. I will discuss some of the more basic features below. In the next edition of this series I will take a look at some of the more advanced features. For now, here are the basics:
Standards Compliance Its apparent that Microsoft is proud of it standard compliance support for HTML, XHTML, Strict/Transitional/Frameset and CSS 1.0, 2.0, or 2.1. Dont get too excited, though. Just because the functional support is good doesnt mean the implementation is easy. For example, adding a new cascading style sheet (CSS) to your website provides you with only a blank page, no pop-up asking what schema to use or how to start defining styles. To the beginner this blank page can be quite intimidating. However, once you start typing Expression Web does a pretty good job of giving you hints and suggestions. Whats not intuitive is the placement and naming of tools. If you want to change your CSS schema the button for that is in the bottom right and the style tools are found in the top menu under format.
Views Like just about every other website design package you have the choice of looking at your work in design view, code view or split view. Personally, I always choose split view because I just hate clicking back and forth. Split view is one of my favorite features in any design package.
SuperView This view option is designed to help you troubleshoot issues between browsers. I really like the way this feature works. If you want to see how your design renders in IE6 versus the newest version of Firefox then all you have to do is click the SuperView button and then select your browser options. You will get a split screen view of each browsers actual rendering of your page complete with rulers that make alignment and spacing issues much easier to spot. You can also add more browsers to either pane. For example, you may want to compare Firefox to both IE6 and IE8. You can click the add button for your IE6 pane and add IE8 as an option then just clock the IE6 and IE8 icons to switch back and forth. Although quickly finding code that needs to be tweaked is much better in Dreamweavers Live View, comparing browser rendering is far superior in Expression Web. I wish I could blend SuperView and Live View together for Super Live View and get the perfect solution.
Photoshop Support Support for Photoshop is a must for any good web design package these days. While Microsoft makes a good stab at photo editing with Expression Design, Adobes Photoshop has been around too long and is too ingrained into the web design industry to discount it. With this feature Expression Web will let you import your Photoshop files directly into your website and it will take care of converting them into either PNG, GIF or JPEG formats, your choice. It will maintain layer and transparency when possible and can automatically update your web images when you make changes to your Photoshop files.
Expression Web is a far cry from its predecessor FrontPage. The layout is fairly intuitive, the look is sharp, and the features are good (albeit seriously slanted toward Microsoft products). In the next article in this series Ill take a look at the more advanced features and give an overall assessment of Expression Web.