Expression Web – CSS Heaven (sort of anyway)

I’m using a style sheet (CSS) at the bottom of the Zufall site to make it easy for the owners to update once it’s done. I’ve used CSS in the past with varying degrees of luck / frustration due to the somewhat tricky cross referencing you have to do: When you have a separate CSS document you have to constantly open the document, change the code, save and then go back and reload the HTML document to see if what you did was what you wanted. For someone with limited understanding of CSS code this is quite frankly a nightmare.

Not so with Expression Web. The guys at Microsoft have struck gikd with the CSS linking between style sheet and actual document. Instead of editing the style sheet separately you can edit it directly from your HTML document through the styles panels for instant results. If you make changes they also appear in the CSS document and the program will even remind you to save changes in both documents if you close or preview what you’ve just done. This interconnectivity between document and style sheet makes the work of the designer much less tiring.

Another neat feature is the manual div positioning. Rather than having to code in where the divs appear you can set the div positioning to manual, drag your divs to wherever you want on the page and the style sheet will automatically make the changes.

As if that wasn’t enough the preview panel for the CSS code is a stroke of genious. When you are modifying your CSS code you get a preview of what you are doing in real time. There is also a small preview panel in the bottom right corner (by default) that will show you what the style does before you apply it.

My knowledge of CSS has been limited – especially because designing the code in the past was unnecessarily time consuming and quite frankly annoying. And I can honestly say that I have learned more about CSS code in the two weeks I’ve been using Expression Web than the rest of my time as a web designer (just to make this clear: I’m a designer, not a coder). If I were to pick on anything it would be that the program often seems sluggish when altering the style code (no doubt due to the cross referencing that goes on) and that if you use undo a lot you have to remember that the program keeps track of your actions per document and not per actual action unlike for instance Macromedia Flash. So if you make one change in the CSS file and one in the HTML file and then click Ctrl+Z twice you will undo whichever two steps you did in the open document and not your two last steps.

Coding in CSS as a whole still is a can of rotten worms because of the weird differences between Internet Explorer and the rest of the browsers. I’ll post some screen shots and examples of this tomorrow.