Webdesign - Webseiten planen, gestalten - Free-Hack Library

Abb. 6.8.3e,f: Sitemapdesigns (http://www.
hammer-runge.de)
Als HTML-Ausführung (links) und in einer
aufwändigeren Flash-Version.
236
Designarbeitsschritte
die Bildspalten aufweisen und solche, die nur aus Textinhalten
bestehen. (Abb. 6.8.3b, c, d).
Wie sieht eine Seite mit tabellarischen Auflistungen aus, wie geht
man mit einer großen Grafik um, wie werden mehrere Bilder auf
einer Seite platziert? Es geht darum, das erstellte Layoutraster nicht
zu verlassen, sondern gemäß der zusätzlichen Anforderungen zu
erweitern oder zu verfeinern.
Eine besondere Herausforderung stellen Introseiten oder reine
Navigationsseiten wie z. B. Sitemaps dar. Sitemaps müssen keine
langweiligen Textkaskaden sein, sondern können kreativ gestaltet
werden. Sie dürfen aus dem Layoutraster ausbrechen, sollten aber
dennoch durch Form, Farbe, Typografie etc. ihre Zugehörigkeit
zum Gesamtauftritt erkennen lassen (Abb. 6.8.3e,f).
6.8.4 Detailentwurf
Arbeiten Sie mindestens 3 wirklich verschiedene Entwurfsalternativen
als Photoshop-Layout in den gestalterischen Details weiter
aus.
Führen Sie ein Feintuning bezüglich der Positionierung Ihrer Gestaltungselemente
aus. Optimieren Sie Zeilenabstände und Laufweiten.
Prüfen und optimieren Sie gegebenenfalls die gewählten Farben
Ihrer Typografie im Kontrastverhältnis zur Hintergrundfarbe.
In diesem Entwurfsstadium sind insbesondere das Navigationsdesign
und die konkreten Ausführungsformen für unterschiedliche
Aktivierungszustände der Navigationselemente zu definieren.
Eventuell vorgesehene Navigationsicons müssen exemplarisch
entworfen werden. Das Aussehen von Textlinks muss festgelegt
werden.
Wird für bestimmte Aktionen Sound vorgesehen, sollte in dieser
Layoutphase auch die Auswahl eines geeigneten Sounds (z. B. als
Feedback beim Klicken oder für eine Intro-Animation) getroffen
werden.
Zum Detailentwurf zählt auch die Gestaltung von Aufzählungslisten.
Sind diese eingerückt? Erhalten sie Aufzählungszeichen?
Weiterhin ist zu klären, wie Bildlegenden aussehen, wie Textauszeichnungen,
die keine Links sind, definiert werden und wie sich
Zwischenüberschriften darstellen.