3 Webdesign Trends die deine Conversionrate verbessern

Zum Jahreswechsel wird das Netz regelmäßig mit Tipps und Ranglisten zu den wichtigsten Designtrends des kommenden Jahres geflutet. Doch Diskussionen über die Rolle von Schattierungen für Websites im Flat Design generieren keine Leads. Welche Designtrends dich 2016 wirklich weiterbringen erfährst du in diesem Gastbeitrag von RAIDBOXES.

Material Design

Auch 2016 regiert der Minimalismus im Webdesign. Egal ob Flat oder Material Design, die aktuell größten Trends in Sachen Webgestaltung stammen ursprünglich aus dem Interfacedesign. Sie haben ihre Wurzeln in einer funktionalen Gestaltungslehre, also einer Schule, die es Nutzern möglichst einfach machen möchte mit einer Maschine via Interface zu interagieren. Für den durchschnittlichen Webdesigner, Blogger oder Shopbetreiber heißt das, dass nicht Diskussionen über die “richtige” Verwendung von Schatten, Weißraum oder Zahl der Elemente entscheidend sind, sondern die Möglichkeiten, die diese Gestaltungsarten bieten, um Conversion- und Interaktionsraten zu erhöhen.

Daher stellen wir dir in diesem Gastbeitrag nicht die angesagtesten Trends der Linienführung oder ähnliches vor, sondern zeigen dir, wie du mit drei einfachen Veränderungen deine Conversionrate erhöhen kannst ohne aus deinem Corporate Design zu fallen.

Designtrend 1: Bilder ja, aber bitte in voller Breite

Bilder, Grafiken, Videos oder Cinemagraphs werden 2016 bildschirmfüllend verwendet. Störend, meinen einige? Ja, und das ist auch gut so! Denn wenn visuelle Elemente in Kombination mit Conversion-Schaltflächen verwendet werden, ist diese Unterbrechung absolut erwünscht. Sie lenkt die Aufmerksamkeit des Benutzers auf das unterbrechende Element und damit auf den Call-to-Action Bereich.

Dabei gilt prinzipiell:

  • Bildschirmfüllende Bilder erregen mehr Aufmerksamkeit als kleine Bilder
  • Bilder von (glücklichen) Menschen regen zusätzlich zur Interaktion an
  • Bewegtbild kann den Effekt noch einmal steigern

Die Integration von Bewegtbild ist mittlerweile sehr einfach über Videohintergründe oder Cinemagraphs möglich. Cinemagraphs sind teilanimierte Bilder, bei denen sich meist nur ein bestimmtes Element leicht, aber deutlich wahrnehmbar, bewegt.

Startseite von Tesla Motors

Startseite von Tesla Motors. Die bildschirmfüllende Grafik dient als illustrierender Hintergrund für die Conversion-Schaltflächen.

Vollbild bedeutet mehr Platz für mehr Produkte

Die Vollbilddarstellung bietet aber noch weitere Vorteile: Mehr Platz im Conversion-Bereich. Wenn du also mehrere Produkte anbietest, zwei Landingpages gegeneinander testen möchtest oder schlicht ein spielerisches Element integrieren willst, solltest du über eine Zweiteilung des Conversion-Bereichs nachdenken.

Honda Civic Website

Mit diesem Split-Screen-Video sorgte Honda für Aufregung. Drückte man die R-Taste bekam man eine alternative, auf die Racing-Variante des Wagens zugeschnittene, Geschichte präsentiert.

Designtrend 2: Monochromatische Farbgebung

Beinahe jede Website verfügt – beabsichtigt oder durch Zufall – über ein mehr oder weniger authentisches Farbschema. Das Festlegen der Kernfarben einer Website macht nicht nur Sinn, um den eigenen Blog, Shop oder Internetauftritt mit einem klaren gestalterischen Rahmen zu versehen. Auch aus Conversionsicht bietet sich dies an. Denn eine klare Farbgestaltung erlaubt das Arbeiten mit Komplementärfarben. Diese stehen in einem besonders guten Kontrast zueinander, fallen dem User also positiv auf. Gestaltet man Hintergrund und Conversion-Schaltfläche komplementär zueinander kann man die Klickrate teils deutlich erhöhen, da der User den Call-to-Action einfacherer findet und eindeutig identifizieren kann.

Zudem entspricht eine monochromatische, also einfarbige, Hintergrundgestaltung mit kontrastierenden Call-to-Action-Elementen den allgemeinen Designregeln der minimalistischen Flat und Material Design Stile.

Raidboxes Website

Unser Webdesigner hat auf unserer Startseite für einen guten Kontrast zwischen blauem Hintergrund und organgenen Call-to-Action gesorgt. Die beiden Farben sind nicht nur Teil unserer Corporate Design-Farbpalette, sondern bieten auch einen guten Kontrast zueinander.

Designtrend 3: Sticky Call-to-Action

Besucher in potenzielle Kunden zu verwandeln, ohne sie durch zu nervige Werbeversuche zu verprellen ist eine hohe Kunst. Sogenannte Sticky Call-to-Action-Elemente – also solche, die dem Nutzer beim Seitenbesuch folgen – können dabei helfen, wenn sie mit Bedacht eingesetzt werden. So kannst du beispielsweise deinen Call-to-Action in die Fuß- oder Kopfzeile integrieren. Der Besucher hat den Conversion-Button dann immer “klickbereit” und kann dein Produkt kaufen, deinen Newsletter abonnieren oder deinen Service bestellen, sobald du ihn davon überzeugen konntest.

Fazit: Funktionale Designtrends 2016 bieten viel Optimierungspotenzial

Diese drei Designtrends 2016 bieten massig Optimierungspotenzial für Conversion-Bereiche auf deiner Website. Über bildschirmfüllende Bilder und Animationen kannst du die Aufmerksamkeit deiner Besucher auf die entsprechenden Abschnitte lenken und den Call-to-Action durch die richtige Farbgebung noch einfacher und erfolgreicher machen. Auch das Sichtbarhalten der Conversion-Schaltfläche kann zu einer Steigerung der Klicks führen und somit Mehrgeschäft bedeuten. Entscheidend ist jedoch wie du diese Maßnahmen umsetzt. Alle hier vorgestellten Möglichkeiten der Conversion-Optimierung lassen sich leicht in minimalistischen Designs umsetzen und können eine wichtige Bereicherung für die Gestaltung deiner Websites sein. Eine nutzerzentrierte Seitenoptimierung ist außerdem ein tolles Neujahrsprojekt!

Torben Simon Meier
Gastautor

Torben Simon Meier ist Gründer von RAIDBOXES, einem speziellen Premium WordPress Hoster aus Münster. Er ist gelernter Designer und Internetunternehmer und liebt WordPress für seine schier unendlichen Möglichkeiten.