Web-Design mit Ausdruck

ITMAGAZINE
Web-Design mit Ausdruck
von Marc von Ah
2. Juni 2006 - Mit Expression Web Designer will Microsoft endlich ein taugliches Tool für Web-Design und -Entwicklung auf
den Markt bringen. 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.
Copyright by Swiss IT Media 2017