Styleguide - Vorlagen
Beispiele verschiedener Seiten
Sie haben die verschiedenen Webseiten-Elemente kennengelernt, verstehen das Gridlayout und die verschiedenen Ansätze zur Webseitengestaltung? Dann zeigen wir Ihnen an dieser Stelle verschiedene Vorlagen / Beispiele die auf dem V&B Online-Styleguide basieren.
Die Kollektionsseiten haben den Anspruch die einzigartige Designwelt einer jeden Kollektion zu präsentieren. Dies erreichen wir mit großzügigen Millieubildern welche immer das Gefühl der Kollektion, indem sie authentisch in der entsprechenden Lebenswelt inszeniert werden, transportieren. Des weiteren berücksichtigen wir hier die User-Journey durch geschickte Platzierung (Seitengestaltung / Z-Pattern) von entsprechenden "Call to action-Elementen" z.B. Händlersuche.
Kollektionsname als Headline
Kollektionsclaim als Subline
Image-Slider ohne Text
Ein inspirierender und emotionaler Gesamteindruck der Produkte im Milieu.
Produkthighlight der Kollektion
Freisteller und kurzer einleitender Text zur Kollektion
Produktfeatures / Design
Detailaufnahmen, Produktbilder oder Video sowie ein kurzer erklärender Text.
Alle Produktkategorien der Kollektion
Eine Extension (Pflegeanleitung) welche die Produktkategorien als Slider darstellt. Auf dieses Element kann bei weniger als 3 Produktkategorien verzichtet werden. Für diesen Fall empfiehlt sich eine manuelle Darstellung welche die Grid-Zeile auffüllt.
Galerie
Weitere Produktfeatures und Design-Highligts im Detail. Galerie mit Lightbox-Funktion
Actionbar
Relevante User-Journey-Absprünge. Wichtigster Call to Action ganz rechts mit "Filled Button".
Bsp. hier die Händlersuche
Footerbar
Relevante Informationslinks auf Infoflächenfarbe (#f0f0f0)
Landingpage mit einem "Call to action", keine Absprünge zu themenrelevanten oder irrelevanten Seiten. Jeder Button führt zu dem definierten Ziel z.B. zur Händlersuche. Klare USP-Kommunikation sowie Platz für Rich Media-Inhalte ( Galerie-Funktion, Video).
Beispielseite
Landingpage mit dem Ziel: "Videoviews"
Video läuft innerhalb einer Lightbox ab.
Absprünge zu relevanten Seiten möglich.
Verwendung der Actionbar zur Leadgenerierung.
Beispielseite