Webdesign - Webseiten planen, gestalten - Free-Hack Library

Interaktionsdesign
Technisch existieren unterschiedliche Umsetzungsmöglichkeiten,
wie Javaskript- und Java-Anwendungen sowie weitere RIAs (Rich
Internet Application).
Aktuell und verbreitet ist der Einsatz von JavaScript- Frameworks
wie jQuery, Prototype, Moo Tools, Scriptalicious u.a., die viele bis
ins Detail gehende Darstellungsoptionen bereithalten. Vor allem
auf Websites im Web 2.0-Design findet man beispielsweise dreidimensional
angeordnete Bildkarussells mit Spiegelungseffekten
(Abb. 5.7.11a,b).
5.7.12 Das Navigationslayout
Wenn das Navigationskonzept steht und die Art und Menge der
für das konkrete Projekt relevanten Interaktionselemente zusammengestellt
ist, visualisieren Sie dies in Form des so genannten
Navigationslayouts (auch: Funktionslayout).
Dabei geht es im Wesentlichen um die Aufgliederung und Positionierung
der einzelnen Navigationselemente innerhalb der Webseite.
Somit wird an dieser Stelle bereits eine Vorentscheidung über
die grundsätzliche Seitenuntergliederung getroffen, wenngleich
das eigentliche formale Seitenlayout erst in der Arbeitsphase des
Screendesigns erstellt wird.
Häufig werden Webseiten untergliedert in (Abb. 5.7.12a):
• einen Kopfbereich (Header),
• einen (linken) Navigationsbereich,
• einen (mittleren) Inhaltsbereich (Content),
• einen (rechten) Marginalienbereich,
• einen unteren Fußbereich (Footer).
Diese Aufteilung ist zwar hochkonventionell, hat sich aber in der
Praxis bewährt. Will man nicht ausdrücklich aus diesem Schema
ausbrechen, ist es nicht falsch, von diesem Grundkonzept auszugehen.
Natürlich sind auch Seitenaufteilungen möglich, bei denen
das Navigationsmenü rechts oder im Fuß angeordnet ist, bedenken
Sie jedoch, dass dies für normale Nutzer gewöhnungsbedürftig ist.
Seiten mit Fußnavigation sollten mit Inline-Scrollbereichen aufge-
SITEPLANUNG 5
Abb. 5.7.11b: 3D-Carousel mit dem„jQuery“-
Framework umgesetzt
(Studienentwurf Barchnicki, Buttler)
HEADER
CONTENT
FOOTER
Abb. 5.7.12a: Websiteuntergliederung
(Grafik: Hammer)
181