Webdesign / Webprogrammierung
Demos Design- und Funktionselemente
Gutes Webdesign legt heute großen Wert auf eine klare und einfache Gestaltung des User-Interface (UI) und der User-Experience (UE) – UI-Design, UE-Design. Anderenfalls werden Besucher die Website schnell wieder verlassen. Eine verlorene Chance, Kunden mit den eigenen Inhalten (quality content) zu überzeugen und zu gewinnen.
Für die folgenden Design- und Funktionselemente zeige ich Ihnen hier Bespiele und erläutere, was Sie damit erreichen können und worauf Sie achten müssen.
Page Heros
Page Heros sind auffällige, meist über die volle Breite des Bildschirmes reichende Grafik-Text-Bereiche. Man verwendet sie vorwiegend ganz oben auf einer Seite, kann sie aber auch im Verlauf einer Seite einsetzen, z.B. um ein Unterthema einzuleiten. Der Page Hero führt kurz und prägnant in das Thema der Seite oder des Seitenbereiches ein und enthält oft ein Call-To-Action-Element, wie z.B. einen Button / weiterführenden Link.
Slider
Ein Slider erlaubt, an einer Stelle nacheinander verschiedene Texte oder/und Bilder anzuzeigen. Es gibt vielfältige Gestaltungsarten. Bei der Programmierung und Gestaltung sind hinsichtlich SEO einige wichtige Punkte zu beachten.
Hover Effekte
Hover Effekte setzt man vielerorts auf einer Website ein. Gut eingesetzt, zahlen sie auf die Qualität der User-Experience ein und fördern damit das Interesse, weiter auf einer Website zu verweilen und sich zu informieren.
Accordions
Accordions dienen dazu, Inhalte, die erst auf den zweiten Blick sichtbar werden sollen, so lange zu verstecken, bis sie durch Interaktion sichtbar werden sollen. Besucher können also entscheiden, ob sie den weiteren Inhalt sehen möchten. Wie schon beim Slider sindhinsichtlich SEO bei der Programmierung und Gestaltung einige wichtige Punkte zu beachten.
Listen und Aufzählungen
Listen oder Aufzählungen sind Strukturelemente auf einer Seite und können sehr vielfältig gestaltet werden.
Icons, individuell als Vektorgrafik
Sie dienen als Eye-Catcher, als visuelle Erläuterung von Headlines oder Call-To-Action-Elementen und können weit mehr sein, als kleine Symbole aus vorgefertigten Icon-Sammlungen. Stichwort: Corporate Design, pixelgenaue Darstellung, interaktive Funktionen.
