Directional Cues: Design-Tipps, die Besucher zum Handeln bewegen
Veröffentlicht: 2017-02-17Sie haben gerade Ihre nächste Post-Click-Landingpage erstellt. Sie haben eine Killer-Überschrift und eine Unterüberschrift erstellt, eine äußerst überzeugende Kopie geschrieben, Ihre Form perfektioniert, den besten CTA aller Zeiten erstellt und Ihre Seitenhierarchie ist genau richtig. Jedes Element ist am besten geeignet, um Besucher zum Konvertieren zu bewegen.
Ihre Post-Click-Landingpage ist also bereit für die Veröffentlichung, oder? Nicht ganz.
Wie stellen Sie sicher, dass Ihre Besucher das Video sehen, das Ihr Team stundenlang erstellt hat? Oder dass Besucher auf den perfekten CTA-Button klicken?
Überlassen Sie all dies nicht dem Zufall; leiten Besucher genau dorthin, wo Sie sie haben möchten. Bringen Sie sie dazu, zu sehen, wo sie sich auf Ihre wichtigsten Post-Click-Landingpage-Elemente konzentrieren (und Maßnahmen ergreifen) sollen.
Ähnlich wie beim F-Pattern- und Z-Pattern-Layout kann die Verwendung von Richtungshinweisen (auch bekannt als visuelle Hinweise) Ihre Besucher beeinflussen, um Ihre Seite gezielt zu navigieren. Alle drei dieser Post-Click-Landingpage-Designkomponenten verwenden Psychologie, um die Benutzeraktionen zu beeinflussen und sie zu veranlassen, Maßnahmen zu ergreifen.
Schauen wir uns genauer an, wie das funktioniert.
Was sind Richtungshinweise?
Directional Cues sind visuelle Hilfsmittel, wie Pfeile oder der Blick eines Models, die auf die wichtigsten Elemente Ihrer Post-Click-Landingpage hinweisen, zB Ihr Lead-Capture-Formular, CTA, Video, Testimonials oder Information Below the fold.
Es gibt zwei grundlegende Arten von Richtungshinweisen: implizite und explizite Richtungshinweise.
Bevor wir untersuchen, wie beides die Aufmerksamkeit der Besucher absichtlich lenken kann, wollen wir uns die Psychologie hinter diesen visuellen Hilfsmitteln ansehen.
Die Psychologie hinter visuellen Hinweisen
Visuelle Hinweise können als Signale oder Schwingungen betrachtet werden, und unbewusst kann Ihr Gehirn solche Signale erkennen. Bei einem ersten Date kannst du zum Beispiel viel über dein Date durch die Vibes erfahren, die er oder sie sendet – Körpersprache, Blickkontakt, Mimik – die dir zeigen, ob die Person interessiert ist oder nicht. Ohne es zu merken, nimmst du diese Vibes von jedem auf.
Klicken Sie, um zu twittern
Dieselben Vibes können Sie im Rahmen des digitalen Marketings und mit Post-Click-Landingpages vermitteln und empfangen. Die visuellen Hinweise auf Ihrer Post-Click-Landingpage geben Ihren Besuchern eine subtile Botschaft, eine Stimmung, ein Gefühl.
Was bestimmt bei Post-Click-Landingpages, wie wir diese Vibes oder Hinweise übersetzen? Typischerweise sind es unsere vergangenen Erfahrungen und unser gespeichertes Wissen, die dazu neigen, unsere Wahrnehmung zu beeinflussen. Und wie Sie unten sehen werden, gibt es eine Vielzahl von Signalen, die Besuchern helfen können, sich mit Ihrer Seite zu beschäftigen und Maßnahmen zu ergreifen.
Implizite Richtungshinweise auf Post-Click-Landingpages
Implizite Richtungshinweise sind subtil und werden von Besuchern oft nicht bemerkt. Zu den gängigsten Typen gehören Weißraum, Farbkontrast und Kapselung. Hier ist ein Blick auf jeden einzelnen:
Leerraum
Leerraum ist der negative oder leere Bereich Ihrer Post-Click-Landingpage, der dazu beiträgt, die Aufmerksamkeit auf bestimmte Elemente zu lenken. Das Hinzufügen von Leerzeichen kann dazu beitragen, Ihre Seite zu vereinfachen, die Benutzererfahrung zu verbessern und das allgemeine Verständnis Ihres Angebots zu verbessern. Das liegt daran, dass Besucher mit weniger Elementen, auf die sie sich konzentrieren müssen, gezwungen sind, sich das anzusehen, was Sie von ihnen erwarten.
Hier ist eine Post-Click-Landingpage von Percolate, die viel Leerraum um die Überschrift, die Unterüberschrift und das Formular zur Lead-Erfassung herum verwendet:

Farbkontrast
Kontrastierende Farben dienen als Richtungshinweis, da die starken Farbunterschiede die Aufmerksamkeit der Besucher auf diesen Bereich lenken.
Zur Veranschaulichung bietet Marketo auf dieser Post-Click-Landingpage einen Social-Media-Marketing-Leitfaden an, aber der CTA geht verloren, da der Farbkontrast nicht vorhanden ist:

Aber auf dieser Post-Click-Landingpage der Codify Academy springt die CTA-Schaltfläche von der Seite, weil das Rot zu jeder anderen Farbe kontrastiert:

Verkapselung
Kapselung oder das Einrahmen von Elementen ist eine weitere Möglichkeit, das Wichtige auf der Seite hervorzuheben, indem ein geschlossenes Fokusfenster erstellt wird. Designer tun dies oft mit Kästchen, Umrissen und/oder kontrastierenden Farben, um die Seitenunordnung zu reduzieren und die Aufmerksamkeit auf bestimmte Elemente zu lenken.
Die Bellevue University verwendet diese Technik zweimal auf der Seite unten – im Header-Bild und im Formular. Das Formular ist jedoch noch gekapselter, da es in einem kontrastierenden violetten Feld gestaltet ist, um Besucher der Landingpage nach dem Klick dazu zu bringen, ihre Informationen zu übermitteln:

Explizite Richtungshinweise auf Post-Click-Landingpages
Explizite Hinweise sind für das menschliche Auge im Vergleich zu impliziten Hinweisen deutlich offensichtlich, sodass sie normalerweise sofort erkannt werden können. Augenblick, Zeigen oder Gestikulieren, strategische Objektpositionierung, Pfeile und Linien gehören zu dieser Gruppe. Schauen wir uns jeden Typ genauer an:

Blick
Die Verwendung des menschlichen Auges als Richtungshinweis ist besonders auf Post-Click-Landingpages effektiv. Die Leute neigen dazu, sich das anzusehen, was andere sehen. Wenn also jemand auf dem Bildschirm ein Formular ansieht, wird der Besucher das Formular eher bemerken. Diese Technik führt unbewusst dazu, dass Besucher dorthin schauen, wo Sie möchten, und fügt auch eine persönliche Anziehungskraft hinzu. Donald Trump und Hillary Clinton verstanden beide den Wert dieser Technik – sie setzten sie während der Wahlkampfsaison auf ihren Spendenseiten ein.
Hier ist eine Post-Click-Landingpage der Capella University, auf der ein lächelnder Student in Richtung der Überschrift, der Unterüberschrift und des Formulars schaut. Ohne es zu merken, werden die Besucher wahrscheinlich auch hier ihre Aufmerksamkeit richten:

Social Proof (z. B. Testimonials) kann auch den Blickwinkel nutzen, wie hier auf der Seite von When I Work zu sehen:

Zeigen oder gestikulieren
Ähnlich wie beim Augenblick können sich die Besucher mit einem Modellpunkt oder einer Geste auf ein wichtiges Element auf diesen Bereich konzentrieren. Da diese Technik nicht so subtil ist wie der Blick mit den Augen; Es besteht die Möglichkeit, dass die Geste kitschig und unnatürlich erscheint. Stellen Sie daher sicher, dass Sie Ihre Seiten mit verschiedenen Gesten A/B-Tests durchführen, um zu sehen, was die besten Ergebnisse liefert.
Objektpositionierung
Das Positionieren von Bildern so, dass sie auf einen bestimmten Fokusbereich gerichtet sind, lenkt die Aufmerksamkeit der potenziellen Kunden und macht dieses bestimmte Element auffälliger.
U-Pack sorgte dafür, dass das Post-Click-Landing-Page-Formular für jeden Besucher wahrnehmbar war. Sie haben es nicht nur mit einem schwarzen Rand eingekapselt, sondern auch einen fahrenden Lastwagen gegenüber dem Formular positioniert, damit die Besucher nicht anders können, als es zu bemerken:

Pfeile
Ob bewegt oder stationär, Pfeile sind eine der am häufigsten verwendeten expliziten Richtungshinweise, da sie einfach und leicht zu verstehen sind.
Loud Rumor verwendet einen stationären, handgezeichneten Pfeil auf ihrem zweistufigen Anmeldeformular, um die Klicks auf die CTA-Schaltfläche zu beeinflussen:

Obwohl Webbenutzer an das Scrollen gewöhnt sind, werden häufig Pfeile platziert, um Besuchern bei der Navigation unterhalb der Falte zu helfen. Sehen Sie sich an, wie Constant Contact dies mit einem einfachen eingeschlossenen Pfeil macht:

Hier ist ein weiterer von Boardvantage – in dem der Pfeil mit einem Hyperlink versehen ist. Nach dem Anklicken scrollt die Seite unterhalb des Falzes und zeigt drei verschiedene Anwendungsfälle an:

Linien
Linien sind eines der weniger offensichtlichen Hinweise, aber da Menschen dazu neigen, von Natur aus Pfaden zu folgen, können sie auf Post-Click-Landingpages sehr nützlich sein. Das liegt daran, dass lineare Richtungshinweise Besucher durch verschiedene Teile Ihrer Seite führen oder potenziellen Kunden helfen können, sich auf bestimmte Abschnitte der Seite zu konzentrieren.
Zum Beispiel verwendet Datorama eine nach oben tendierende Diagrammlinie, um die CTA-Schaltfläche „Jetzt ausprobieren“ hervorzuheben. Wenn Besucher auf die Schaltfläche klicken, werden sie zum Lead-Erfassungsformular unten auf der Seite weitergeleitet, wo sie sich für eine kostenlose Datorama-Testversion anmelden können:

Beeinflussen Sie Besucher mit Richtungshinweisen zur Conversion
Lassen Sie uns die fast perfekte Post-Click-Landingpage, die wir eingangs zusammengefasst haben, noch einmal ansprechen.
Während Ihre Überschrift, Ihr Text, Ihr Formular und Ihr CTA von größter Bedeutung sind, um die Conversions zu steigern; Diese Elemente sind nur ein Teil der Post-Click-Landingpage-Erfahrung des Besuchers. Fügen Sie einige Richtungshinweise hinzu – sowohl implizite als auch explizite –, um sicherzustellen, dass Ihre Interessenten ihre Aufmerksamkeit auf das richten, was für Ihr Conversion-Ziel am wichtigsten ist.
Welche Hinweise werden Sie Ihrer nächsten Post-Click-Landingpage hinzufügen? Egal wofür Sie sich entscheiden, erstellen Sie mit Instapage in wenigen Minuten vollständig optimierte Post-Click-Landingpages. Melden Sie sich noch heute für eine Instapage Enterprise-Demo an.
