Attended a really good presentation about Expression Web 3 at MIX09. Wow, this is a fabulous product for anyone who has ever gone through the pain of building HTML & CSS for a complex web page.

SuperPreview is the flashiest feature. It lets you view your web page side by side in multiple browsers, including multiple versions of IE. For example, you can see your page in IE8 and IE6 simultaneously.

Making your page lay out correctly in multiple browsers is hard, and it’s made harder by the slow, tedious process of having to iteratively test your page in several different browsers. My friend Mike Servais has to run IE6 in a virtual machine so that he can run IE8 on his main machine.

When you’re previewing a page in two two different browsers, you can hover your mouse over any element. EW3 highlights the element (or its parent if you prefer) in both browsers and shows both the location the element is supposed to be and that location it actually is. For example, if an element is misaligned, you can quickly browse through the hierarchy of elements to discover which one is causing the problem.

EW3 also has great tools for interacting with existing HTML & CSS. The presenters loaded a copy of the MSN home page and used built-in reporting features to show that there were over 1,500 (!) different CSS elements. Appallingly, over 1,000 are not being used at all. EW3 has great interactive UI to let you discover all the CSS elements related to any element on the page.

My takeaway was that any web developer who works on HTML and CSS will find EW3 to be an invaluable tool.