Webdesign - Webseiten planen, gestalten - Free-Hack Library

Interfacedesign
TIPP: Im Einzelfall sollten Sie bei Horizontalanordnungen prüfen,
ob es besser ist, die einzelnen Navigationsbegriffe durch Vertikalstriche
, so genannte Pipe-Zeichen, ( | ) voneinander zu trennen.
Oft wirkt jedoch ein großzügiger Freiraum zwischen den Begriffen
viel klarer als ein Trennstrich (Abb. 6.7.5f).
Vielfältige Gestaltungsmöglichkeiten bietet auch eine rechteckige
Flächenhinterlegung je Begriff, die z. B. als flächige oder plastische
Taste mittels CSS-Definition des -Containers gestaltet werden
kann. Mit Hilfe von kleinen Hintergrundbildern je Container lassen
sich auch vom Rechteck abweichende Formen (z. B. Karteireiter
mit abgerundeten Ecken) realisieren.
6.7.6 Bildbuttons
Ein Element gehörte früher zum Webdesign wie die Butter zum
Brot: die Buttons, die virtuellen Knöpfe, die sicherlich jede zweite
Navigation im Web zierten (Abb. 6.7.6a, b). Sie wurden zum
Inbegriff der Interaktivität, übertragen bildlich den Druck der
Maustaste auf den Bildschirm und outen sich beim Mouseover als
interaktives Element.
Buttons sind funktionale Elemente auf einer Website, mit denen
durch den Benutzer Aktionen ausgeführt werden. Zum Beispiel wird
eine URL oder ein Skript aufgerufen, mit dem weitere Funktionen
gesteuert werden.
In der deutschen Übersetzung spricht man heute kaum mehr von
Knöpfen oder Tasten, sondern allgemein von Schaltflächen. Im
Gegensatz zu Schaltflächen, die im Zusammenspiel von -
Container, HTML-Text und CSS-Auszeichnung gestalterisch definiert
werden, werden hier mit Bildbuttons ausschließlich diejenigen
Schaltflächen bezeichnet, die aus Bildern aufgebaut sind. Auch diese
können optisch zu Navigationsleisten zusammengefasst werden.
In der Regel wird das Auslösen einer Aktion am Bildschirm durch
DESIGNENTWURF 6
Sitemap Impressum Kontakt
Sitemap | Impressum | Kontakt
Abb. 6.7.5f: Horizontallisten mit und ohne
vertikale Trennstriche
Abb. 6.7.6a: Typische frühere Buttonleiste
(http://www.abes-online.de1996, nicht mehr
im Netz)
Abb. 6.7.6b: Website (2000) mit vielen Bildbuttons
und Bildtypografie
(http://www.kriegergmbh.de, Design: hammer.
runge, Site nicht mehr im Netz)
Diese Website weist eine unten angeordnete
Hauptnavigation aus „Pflanzschildchen“ auf.
225