Web-Design mit Ausdruck

Mit Expression Web Designer will Microsoft endlich ein taugliches Tool für Web-Design und -Entwicklung auf den Markt bringen.

Artikel erschienen in Swiss IT Magazine 2006/11

     

In der IT gibt es zahlreiche Ärgernisse. Eines der grössten und ein zuverlässiges Reizwort für ambitionierte und professionelle Webentwickler ist «Microsoft Frontpage». Das Web-Design-Tool aus Redmond, immerhin über 10 Jahre auf dem Markt und in zahlreichen Versionen erschienen, vermochte den Anforderungen nie zu genügen. Zwar war Frontpage einer der ersten WYSIWYG-Editoren, mangelhafte Standard-Unterstützung, Probleme mit selber oder in anderen Anwendungen geschriebenem Code und generell eingeschränkte Entwicklungsmöglichkeiten vergällten aber die Freude daran.
Doch das alles soll sich jetzt mit dem «Expression Web Designer» (Codename «Quartz») ändern, der vor kurzem in einer ersten Community-Technology-Preview (CTP) freigegeben wurde. Das neue Web-Design-Werkzeug wurde vom Visual-Studio-Team komplett neu entwickelt und wird das unbeliebte und wenig erfolgreiche Frontpage ablösen.


Standards im Vordergrund

Wer heute zeigen will, dass er in Sachen Internet up-to-date ist, spricht von «Web 2.0». Das tut auch Microsoft. Web 2.0 bedeutet im Zusammenhang mit Expression Web Designer insbesondere, dass das neue Internet-Zeitalter noch viel mehr auf Standards basiert als früher. Standards gibt es für das Design (CSS), für den Code und die Metadaten (XHTML), den Datentransfer (XML) und auch für weniger offensichtliche Dinge wie beispielsweise die «Accessibility»-Hilfen für Sehbehinderte.
Das Problem dabei ist, dass ein modernes Web-Design-Tool einerseits grösstmögliche Freiheit bei der Web-Entwicklung bieten soll, andererseits aber auch diese Standards weitestgehend unterstützen muss – eine eigentliche Gratwanderung, die bisher nur Macromedia (heute Adobe) mit Dreamweaver einigermassen geschafft hat. Und an diesem Marktführer muss sich Microsofts Werkzeug messen.
Microsoft betont denn auch, dass man die Kompatibilität zu den bestehenden Standards in deren aktuellsten Versionen als oberstes Designziel eingesetzt und diese weder neu erfunden noch erweitert habe. In der Tat unterstützt Expression Web Designer HTML ab 4.01, XHTML 1.0 und 1.01 sowie CSS 1.0 bis 2.1. Tags, die in diesen Standards nicht vorgesehen sind, beispielsweise B für Bold, FONT oder die Microsoft-Erfindung BLINK, können zwar trotzdem genutzt werden, Expression Web Designer reagiert aber mit einer Fehlermeldung.


Keine Code-Veränderung

Bei derartigen Versuchen fällt auch auf, dass Expression Web Designer den Code nicht mehr eigenmächtig verändert. Von Hand eingefügte Tags bleiben unverändert, wenn man die Seite aktualisiert oder neu lädt – ein gewaltiger Fortschritt im Vergleich zu Frontpage. Gleichzeitig wird aber auch mit Farbcodes gewarnt, wenn ein Tag nicht unterstützt wird oder vom W3C als veraltet definiert ist, und mitunter schlägt das Tool sogar eine Alternative vor.
Äusserst praktisch ist in diesem Zusammenhang auch der integrierte Code-Validator, der schon während der Eingabe auf Probleme mit den Tags hinweist und diese gegen die XHMTL- und CSS-Standards validiert. Den sonst obligaten Besuch auf den W3C-Validator-Seiten kann man sich sparen.


Hervorragende CSS-Unterstützung

Gut gelöst und einiges fortschrittlicher als etwa bei Dreamweaver ist auch die CSS-Unterstützung. Als erstes fallen hier die beiden Panels ins Auge, über die einerseits CSS-Eigenschaften bequem bearbeitet werden können und andererseits die bereits erstellen Styles aufgelistet werden, von wo sie per Mausklick auf ein selektiertes Objekt angewandt werden können. Auf diese Weise lässt sich leicht der Überblick über ein CSS-basiertes Weblayout behalten.
Und hier liegt der eigentliche Clou von Expression Web Designer. Solange man nämlich im WYSIWYG-Modus arbeitet, hat man gar keine andere Möglichkeit, als eine CSS-basierte Seite zu erstellen. Microsoft zwingt einen hier geradezu, die Standards zu respektieren und anzuwenden, was grundsätzlich durchaus eine gute Idee ist – insbesondere, da Expression Web Designer sich auch tatsächlich an die Standards hält.
Für besondere Fälle kann man sich natürlich auch über die Standards hinwegsetzen – aber nur, wenn man den Code von Hand eingibt. Dies sollte angesichts der Qualität der Rendering-Engine allerdings eher selten der Fall sein.


Gute Rendering-Engine

Denn die Rendering-Engine ist ein weiteres Highlight von Expression Web Designer. Nicht nur, dass sie äusserst zuverlässig arbeitet (beispielsweise auch was die Positionierung von Elementen betrifft), sie zeigt auf Wunsch auch Dinge wie Abstände, versteckte oder leere Elemente und Container oder Elemente ohne CSS-Formatierung an. Diese zahlreichen sogenannten Visual Aids können sich bei der Entwicklung als sehr praktisch erweisen – insbesondere auch deswegen, weil die so gekennzeichneten Elemente meist auch direkt im WYSIWYG-Modus bearbeitet werden können, was sich wiederum sofort in den zugehörigen CSS-Styles niederschlägt.


Template-basierte Entwicklung

Die Entwicklung mit Expression Web Designer kann auf Wunsch weitgehend Template-basiert erfolgen. Dabei werden natürlich zunächst die schon von Frontpage bekannten (und auch in Dreamweaver unterstützten) Dynamic Web Templates (DWT) unterstützt. Dabei können auch in Dreamweaver erstellte Vorlagen problemlos verwendet werden, Expression
Web Designer schluckt diese klaglos und ohne den Code zu verändern – genauso verhält es sich in umgekehrter Richtung.
Daneben wurde Expression Web Designer aber auch mit Visual Studio 2005 und Visual Studio Web Developer Express integriert, was sich etwa bei der nahezu identischen Oberfläche und in der Unterstützung der Master Pages bemerkbar macht. Diese enge Zusammenarbeit kommt dem Entwickeln komplexer Websites zugute – während in Expression Web Designer das Frontend und die komplette Site gestaltet wird, kann für die Logik dahinter Visual Studio zum Einsatz kommen.
Nativ unterstützt Expression Web Designer ASP.Net sowie ASP.Net 2.0. Andere serverseitige Technologien wie PHP, JSP oder ColdFusion bleiben dagegen komplett aussen vor – wenig überraschend bei einem Microsoft-Produkt. Die Unterstützung für ASP.Net allerdings ist durchaus solid.


In Produktfamilie eingebettet

Trotz der ASP.Net-Unterstützung fokussiert Microsoft mit dem Expression Web Designer ganz klar auf die gestalterische Seite der Webent­wicklung – für die eigentliche Entwicklungsseite ist Visual Studio zuständig.
Das unterstreicht auch die Einbettung des Web-Designers in die neue Expression-Familie. Diese umfasst derzeit drei Tools, die sich alle noch in der Beta-Phase befinden: Neben dem Web-Tool sind dies das Mal- und Bildbearbeitungs-Tool Expression Graphics Designer (CN «Acrylic», vgl. InfoWeek 14/2005) sowie der Expression Interactive Designer (CN «Sparkle»), der die Entwicklung von Flash-ähnlichen, interaktiven Oberflächen auf Basis der WinFX Windows Presentation Foundation ermöglichen wird. Während Web und Graphics Designer wie die Kombination aus Dreamweaver und Fireworks anmutet, tanzt Interactive Designer etwas aus der Reihe: Das Tool kann nämlich für die Webentwicklung benutzt werden, wurde aber eigentlich für die Erstellung von User-Interfaces im Rich-Media-Stil entwickelt.
Insgesamt bietet Microsoft mit dem Expression Web Designer erstmals ein Web-Entwicklungswerkzeug an, das sich an professionelle Anwender richtet und deren Ansprüchen tatsächlich auch genügen kann. Ob sich das Tool bei den Dreamweaver-gewohnten Webdesign-Profis durchsetzen kann, wird sich dagegen weisen – gute Voraussetzungen bringt es allerdings durchaus mit.




Artikel kommentieren
Kommentare werden vor der Freischaltung durch die Redaktion geprüft.

Anti-Spam-Frage: Was für Schuhe trug der gestiefelte Kater?
GOLD SPONSOREN
SPONSOREN & PARTNER