31 Beispiele für effektive Calls-to-Action

Bestimmt haben Sie sich im Internet schon öfter mal auf Webseiten registriert. Vielleicht haben Sie Software wie Evernote, Dropbox, oder Spotify heruntergeladen oder an einem Kurs bei einem Anbieter wie Coursera oder General Assembly teilgenommen.

Mit großer Wahrscheinlichkeit jedoch war Ihre Registrierung die Reaktion auf einen effektiven Call-to-Action.

Um Ihnen zu zeigen, was wirkt und was nicht, haben wir 31 Beispiele für ausgesprochen gelungene CTAs zusammengestellt. Die Call-to-Action-Beispiele sind in drei Gruppen unterteilt:

• einfache und wirkungsvolle Designs
• neugierig machender Text
• mehrere CTAs auf einer Seite

Die gewünschte Handlung ist z. B. die Angabe von Daten zur Leadgenerierung oder das Treffen einer Kaufentscheidung.

Einfache, aber wirkungsvolle CTA-Schaltflächen

Bitte beachten: Uns liegen keine Performance-Daten für diese Beispiele vor, aber die CTAs entsprechen unseren allgemeinen Empfehlungen. Da dieser Beitrag ursprünglich auf dem Blog von HubSpot.com erschienen ist, handelt es sich bei dem Großteil der Einträge um englischsprachige Beispiele. Die Prinzipien für wirkungsvolle CTAs bleiben dabei jedoch gleich. Falls Sie Calls-to-Action ähnlicher Art auf Ihrer Website einsetzen möchten, sollten Sie jedoch zunächst überprüfen, ob sie für Ihre Zielgruppe geeignet sind.

1) Evernote

„Dein virtuelles Gedächtnis“. Besucher der Website verstehen sofort, worum es geht, wenn sie diese Seite öffnen. Die Website von Evernote ist so aufgebaut, dass die Benutzer auf den ersten Blick sehen können, welche Vorteile die App bietet und wie sie sich anmelden können, um sie zu verwenden. Außerdem verwendet die primäre CTA-Schaltfläche denselben Grünton wie das Evernote-Logo und springt sofort ins Auge.

2) Dropbox

Dropbox hat von Anfang an auf ein einfaches Design mit viel Freiraum gesetzt. Selbst die Grafiken auf der Startseite sind schlicht gestaltet.

Vor diesem Hintergrund fällt der strahlend blaue CTA-Button, der zur kostenlosen Anmeldung auffordert, umso mehr auf:

3) OfficeVibe

OfficeVibe überzeugt mit einem Slide-in-CTA: Beim Lesen eines Blog-Beitrags erscheint unten auf der Seite ein Banner mit einem CTA, der zum Blog-Abonnement animiert. Dieser CTA ist besonders wirkungsvoll, da der Text auf dem Slide-in weitere Tipps für Manager verspricht und in einem Beitrag erscheint, der von Führungsqualitäten handelt. Das Angebot entspricht damit also genau dem Benutzerinteresse.

Außerdem fällt die Unaufdringlichkeit solcher Slide-in-CTAs positiv auf – ganz anders als das, was Inbound-Expertin Rachel Leist „Halt-Stopp-sofort-hier-klicken-Popup-CTAs“ nennt. Das Nutzererlebnis ist viel besser, wenn Slide-in-CTAs mehr Informationen bieten, die Leser aber nicht daran hindern, den Blog-Beitrag weiterzulesen.

4) Netflix

Was hält viele Benutzer davon ab, sich für etwas zu registrieren? Sie befürchten, dass sie das Abonnement nur schwer wieder kündigen können, falls ihnen das Angebot nicht gefällt. Bei Netflix werden diese Bedenken mit dem Text „Jederzeit online kündbar“ zerstreut, der direkt über dem CTA „Gratismonat beginnen“ zu lesen ist. Wahrscheinlich sind allein durch dieses Versprechen eine Menge Neukunden dazugekommen. Außerdem haben auch hier sowohl Logo als auch CTA dieselbe auffällige rote Farbe. Auf diese Weise wird das Corporate Design von Netflix stringent bis ins Detail aufgegriffen und strategisch eingesetzt.

5) Square

Zu einem wirkungsvollen CTA-Design gehört mehr als eine gelungene Schaltfläche. Ganz wichtig sind auch die Hintergrundfarbe, die Bilder und die Texte, die in der Nähe der Schaltfläche erscheinen.

Das wissen auch die Designer von Square, die mit einem einzigen Bild zeigen, wie einfach ihr Produkt zu verwenden ist, während die blaue CTA-Schaltfläche zum Klicken einlädt. Bei genauerem Hinsehen werden Sie feststellen, dass die Farbe der Kreditkarte im Bild farblich zur CTA-Schaltfläche passt. Nutzer wissen also, was sie beim Klicken auf die Schaltfläche erwartet.

6) Prezi

Die klugen Köpfe hinter der Präsentations-Software Prezi gestalten ihren CTA insofern simpel, dass sie die umgebende Landing Page auf den Produktnutzen herunterbrechen. Mit dem Klick auf den CTA-Button „Prezi gratis testen” kann der Nutzer die Produkt-Vorzüge in der Praxis erleben. Unterhalb des CTA-Buttons wird in vier einfachen Schritten versucht, dem Nutzer die Kern-Charakteristika des Produkts nahezubringen. Auch visuell überzeugen der Call-to-Action-Button und die ihn umgebenden Elemente, da die Designer als primäre farbliche Hervorhebungen die Komplementärfarben Blau und Gelb einsetzen. So ergibt sich ein ästhetisches Gesamtbild, was den User zur Registrierung motiviert.

7) Full Bundle

Full Bundle ist ein weiteres Unternehmen, das Freiraum einsetzt, um den primären CTA auf seiner Website gut zur Geltung zu bringen. Vor dem Hintergrund in dunklem Grau fällt der weiße Call-to-Action besonders auf. Auch mit der Auswahl gerade dieses CTA wird eine Strategie verfolgt. Der Hauptgeschäftszweig des Unternehmens ist der Aufbau von Websites für seine Kunden. Deshalb ist es wichtig, gleich zu Beginn ein Beispiel für die kreative Arbeit zu zeigen, schließlich kommen die meisten Besucher genau deswegen auf diese Website.

8) Panthera

Panthera richtet sich an Tierfreunde, die sich ganz besonders für Großkatzen interessieren und einer Gruppe von Gleichgesinnten beitreten möchten. Um genau diese Zielgruppe anzusprechen, werden gestochen scharfe Bilder der Tiere als wichtigstes Element in den Call-to-Action mit eingebunden. In einem ansprechenden Slider kann der Nutzer die gefährdeten Tiere betrachten. Der CTA-Button „Get to know the Tiger” öffnet eine Beziehungsebene zwischen User und dem jeweiligen Tier. So wird ein starker emotionaler Bezug hergestellt, der zum Klicken verführt.

CTA-Schaltflächen mit Text, der neugierig macht

9) Huemor

Stellen Sie sich vor, Sie rufen eine Website auf und sehen eine Start-Schaltfläche mit dem Hinweis „Nicht drücken“ … Seien wir ehrlich: Dann wollen Sie doch erst recht auf diese Schaltfläche klicken. Der spielerische Einsatz von psychologischen Tricks passt ausgezeichnet zum Markenbild von Huemor.

10) Aquaspresso

Sinn und Zweck eines Call-to-Action ist es, Besucher Ihrer Website zu einer bestimmten Aktion zu verleiten. Die besten CTAs geben den Besuchern dafür etwas zurück. Bei Aquaspresso, einem Anbieter von Kaffeeautomaten, hat man dies mit einem Pop-up-CTA auf der Blog-Hauptseite sehr gut umgesetzt.

Hier möchte man die Besucher dazu bringen, sich die Produkte des Unternehmens genauer anzusehen (und dann am besten zu kaufen). Dies ließe sich zum Beispiel ganz direkt mit einer CTA-Schaltfläche erreichen, etwa „Sehen Sie sich unsere beliebtesten Produkte an“. Die Lösung von Aquaspresso überzeugt allerdings mehr: Hier bietet der CTA den Lesern des Blogs etwas Besonderes an – „Das Angebot des Tages“ im Austausch gegen die E-Mail-Adresse des Lesers.

Mit dem Hinweis, dass dieses Angebot nur für den heutigen Tag gilt, wird wieder ein psychologischer Trick angewandt: Dinge haben einen größeren Wert für den Nutzer, wenn deren begrenzte Verfügbarkeit suggeriert wird. Die Vorstellung, dass das heutige Angebot besser ist als das von morgen und dass sie etwas verpassen könnten, bringt die Leser dazu, das Angebot so schnell wie möglich in Anspruch zu nehmen.

(Dieser CTA wurde übrigens mit dem Lead-Flows Tool von HubSpot Marketing Free erstellt.)

11) Neil Patel

Die Generierung von Traffic ist eines der Kernziele im Online Marketing. Deshalb ist es auch so verlockend, auf eine Schaltfläche wie den CTA von Neil Patel zu klicken. Die Leser werden auf der Landingpage gefragt: „Brauchst du mehr Traffic?“ Um das herauszufinden, müssen Nutzer nur ihre URL eingeben und anschließend auf den CTA-Button „Webseiten Analyse” klicken. Das Bedürfnis vieler User nach mehr Traffic wird also mit der auffällig platzierten Frage angesprochen und durch Klick auf den CTA befriedigt.

Der CTA von Neil Patel begegnet Besuchern direkt beim Besuch der Homepage und kommt somit direkt zur Sache. Noch bevor der Leser aufgefordert wird, seine Kontakt- oder Zahlungsdaten zu hinterlassen, erhält er einen klaren Mehrwert in Form eines Service-Angebots.

12) HelloFresh

Der Kochboxen-Lieferant HelloFresh beweist mit seinem CTA viel Kreativität. Von der Blog-Page aus wird der User zum Rezept-O-Mat gelockt, der ihm Rezepte nach seinem Geschmack präsentiert. Mit dem wirkungsvollen Mittel der Personalisierung wirkt dieser CTA wie ein verlockendes Spiel. Der Nutzer kann also aktiv partizipieren statt nur trocken mit Datenabfragen konfrontiert zu werden.

13) Treehouse

Viele Unternehmen bieten auf ihrer Website kostenlose Testversionen an, so auch die Online-Technologieschule Treehouse.
Die Elemente um den CTA „Kostenlosen Test starten” zeigen dem Leser direkt auf, was mit dem Produkt erreicht werden kann: Der Nutzer kann beispielsweise Coden lernen, neue Fähigkeiten erwerben oder sich für einen neuen Job qualifizieren. Mit dieser klaren Darstellung der konkreten Ziele wird der Nutzer motiviert, Treehouse auszuprobieren und den CTA-Button zu klicken.

14) OKCupid

Der CTA von OKCupid überzeugt hauptsächlich mit seinem zentral platzierten Slogan. Er suggeriert dem Leser, dass er mit Klick auf den CTA „Join OKC” (endlich) Teil einer Dating-Plattform mit Erfolgsaussichten werden kann. Die bewusst eingesetzte Himmels-Symbolik unterstreicht den optimistischen Ton des Call-to-Action.

15) Reishunger

Eine ablaufende Uhr ist das beste Mittel, um Website-Besucher zum Klicken zu veranlassen: Unmittelbar unter der Navigationsleiste auf der Homepage befindet sich der Timer, sodass er kaum übersehen werden kann. Genau wie im Aquaspresso-Beispiel weiter oben wird hier ein psychologischer Trick angewandt: Es wird die allzu menschliche Befürchtung ausgenutzt, dass uns etwas entgehen könnte. Je weniger Zeit zur Kaufentscheidung bleibt, desto schneller wollen sich die Website-Besucher das Angebot sichern. Durch den auf das Produkt abgestimmten CTA-Claim „Roll it!” wird der Nutzer zusätzlich zum Klicken verführt.

16) Medium

Die Blogger-Plattform Medium spielt mit der Sorge vieler Menschen, dass sie etwas verpassen könnten (FOMO). Daher macht der CTA-Claim von vorneherein klar, dass sich den Besuchern hier die Chance bietet, keine Geschichte mehr zu verpassen: Das Abonnement ist dazu der Schlüssel. Neben diesem deutlichen Appell an das Kundenbedürfnis lockt Medium mit einer Personalisierung, bei der die Beiträge je nach Interessen des Nutzers angepasst werden. Dieser minimalistische Call-to-Action beweist, dass auch wenige Worte eine große suggestive Wirkung entfalten können.

17) Zalando Lounge

Die Zalando Lounge wird als exklusiver Mode-Club vermarktet, was sich auch im CTA widerspiegelt. Der Claim „Jetzt einchecken” suggeriert, dass der Nutzer mit der Registrierung Teil eines erlesenen Kollektivs wird. Die Wortwahl vermittelt außerdem eine gewisse Dringlichkeit, da die Formulierung fraglos mit dem Check-In für einen Flug assoziiert wird. Durch die Mischung aus erzeugtem Zugehörigkeitsbedürfnis zum schicken Mode-Club sowie dem scheinbaren Zeitdruck des Check-Ins ergibt sich hier ein äußerst interessanter Effekt.

18) IMPACT Branding & Design

Bei IMPACT wird sich auf eine Meta-Ebene begeben: ein CTA für einen CTA. Der dem Call-to-Action vorangestellte Artikel dreht sich um Tipps zur Gestaltung effektiver CTAs. Somit ist eine thematische Relevanz geboten, die bei themenspezifischen CTAs elementar ist. Die minimalistische Grafik neben dem Text vermittelt subtil, dass das angebotene Produkt simpel per Smartphone genutzt werden kann.

19) Humboldt County

Die Website der kalifornischen Region Humboldt County ist in jeder Hinsicht beeindruckend: Zu sehen ist ein Vollbildvideo mit atemberaubenden Landschaftsaufnahmen. Ergänzt wird dies durch eine ungewöhnliche CTA-Schaltfläche, die uns sofort an Alice im Wunderland denken lässt: ein weißes Kaninchen und die Worte „Folge dem Zauber“. Der fantastische Charakter der Natur wird damit noch verstärkt und die gewünschte Handlung des Nutzers, dem Kaninchen in das Wunderland zu folgen, wird unterstützt.

Nach dem Klicken auf die CTA-Schaltfläche wird es sogar noch besser: Die Website wird zu einer Art Abenteuerspiel mit Wahlmöglichkeiten, ermöglicht den Benutzern, einen eigenen Weg auszuwählen, und bringt sie so dazu, mehr Zeit auf der Website zu verbringen.

Mehrere Call-to-Action-Schaltflächen

20) WWF

Die wohltätige Organisation WWF bietet unterschiedlichen Benutzertypen genau das, wonach sie suchen. Der CTA unterteilt sich in drei verschiedene Kategorien, wo potenzielle Unterstützer ein passendes Projekt für sich finden können. Damit wird dem Nutzer eine Entscheidungsmacht geboten, indem ihm in einer Call-to-Action-Auswahlfläche alle Möglichkeiten übersichtlich angezeigt werden. Gepaart werden die verschiedenen Spendenaufrufe mit ungeschönten Bildern, die den Ernst der Lage vermitteln. So werden die Nutzer nachdrücklich motiviert, auf „Spenden Sie jetzt” zu klicken.

21) Spotify

Auf der Spotify-Homepage ist auf den ersten Blick klar, dass das Unternehmen den Besuchern zunächst vor allem die kostenlose Inanspruchnahme des Dienstes nahelegen möchte: Der Claim „Musik für alle” macht deutlich, dass Spotify absolut jeden Musik-affinen Besucher gern willkommen heißt, ungeachtet seiner Zahlungsbereitschaft. Sowohl die Schriftart als auch der in warmen Farben gestaltete Hintergrund bilden den perfekten Rahmen: Der CTA-Button für die kostenfreie Nutzung ist leuchtend grün und springt sofort ins Auge.

22) Ugmonk

Ausstiegs-CTAs unterscheiden sich von anderen Pop-ups. Sie werden abhängig vom Besucherverhalten auf einer Website eingeblendet, nämlich just in dem Moment, wenn sich ein Besucher anschickt, die Website zu verlassen. Ziel ist es, die Aufmerksamkeit der Leser zu gewinnen und ihnen einen Grund zu geben, doch noch auf der Website zu bleiben.

Ugmonk setzt einen sehr gelungenen Ausstiegs-CTA ein und bietet den Website-Besuchern als letzten Versuch zwei Optionen an. Zunächst wird ein Nachlass von 15 Prozent auf die Produkte des Unternehmens angeboten, danach folgen zwei Optionen: „Ja bitte, senden Sie mir den Gutschein“ und „Nein danke, ich bin nicht interessiert“. Für die Besucher ist es sehr hilfreich, dass jede CTA-Schaltfläche erklärt, was „Ja“ und „Nein“ tatsächlich bedeuten, da ihnen dies mehr Transparenz gibt und ein positives Nutzererlebnis ermöglicht.

23) Pinterest

Wenn Sie sich bei Pinterest registrieren möchten, haben Sie zwei Möglichkeiten, dies zu tun: über Facebook oder mit einer E-Mail-Adresse. Falls Sie ein Facebook-Konto haben, möchte Pinterest, dass Sie diese Option nutzen. Das wird optisch verdeutlicht, denn die blaue Facebook-CTA-Schaltfläche steht an erster Stelle und ist farblich viel auffälliger und durch das bekannte Logo leicht wiederzuerkennen. Wenn Sie sich über Facebook anmelden, kann Pinterest per API auf die Daten von Facebook zugreifen und erfährt so viel mehr über Ihre Interessen, als wenn Sie sich mit Ihrer E-Mail-Adresse anmelden.

Diese Homepage zielt hauptsächlich darauf ab, neue Mitglieder zu gewinnen. Oben rechts finden Sie aber auch eine diskreten Button zur Anmeldung für Benutzer, die bereits ein Pinterest-Konto haben.

24) Topshop

Topshop hat erkannt, dass Mode-Bedürfnisse in vielen verschiedenen Varianten daherkommen. Das Problem der aufwendigen Suche für beispielsweise schwangere Frauen nach modischer Kleidung löst Topshop durch gleich drei Call-to-Action-Buttons. Durch Klicken auf einen der individuellen Call-to-Actions gelangt der Nutzer direkt in den für ihn geeigneten Shop. So zeigt Topshop seinen Kunden und Kundinnen, dass das Unternehmen um die unterschiedlichen Anforderungen an Kleidergrößen und -schnitte wissen und keine Käufergruppe ausschließen möchte.

25) Instagram

Da Instagram hauptsächlich als mobile Social-Media-App genutzt wird, sehen Besucher zwei schwarze CTAs in derselben Größe: Sie rufen jeweils zum Herunterladen von Instagram aus dem Apple App Store oder dem Google Play Store auf. Dass die CTAs gleich aufgebaut sind und dieselbe Größe haben, betont ihre Gleichwertigkeit: Es ist Instagram nicht wichtig, von welcher der zwei Quellen aus der Download getätigt wird. Wenn Sie bereits ein Instagram-Konto haben, können Sie auch auf einen CTA zum Anmelden klicken.

26) Barkbox

Die beiden CTAs auf der Homepage von Barkbox zeigen, dass das Unternehmen seine Kunden ganz genau kennt: Es gibt zwar viele Websitebesucher, die Barkbox für ihren eigenen Hund bestellen, aber es gibt auch viele Hundefreunde, die Barkbox verschenken möchten. Um diesen beiden Gruppen den Weg zum Einkauf zu zeigen, gibt es für jede einen eigenen CTA : „Wähle Deine Barkbox“ und „Verschenken“.

27) t.c. pharma

Die meisten Red Bull-Fans wissen vermutlich gar nicht, wer hinter der Marke steht: Größter Anteilseigner ist t.c.pharma, ein thailändisches Unternehmen, das Energydrinks, Elektrolytgetränke und andere Getränke und Snacks herstellt. Auf der Homepage des Unternehmens finden sich zwei CTA-Schaltflächen in derselben Größe: „Mehr erfahren“ und „Produkte anzeigen“ – wegen der leuchtenden Farbe der ersten Schaltfläche ist jedoch klar, dass die Websitebenutzer eigentlich auf „Mehr erfahren“ klicken sollen.

28) etepete

Gemüsehändler etepetete versucht die Besucher mit seinen Erfolgs-Zahlen zu begeistern: Denn sieht sich ein Nutzer auf diese Art mit den harten Fakten konfrontiert, lässt er sich vielleicht eher vom Produkt überzeugen. Dadurch, dass hier neben dem verkauften Gemüse zusätzlich die hohe Anzahl an aktiven „Gemüserettern” kommuniziert wird, wird im Besucher das Bedürfnis ausgelöst, dazuzugehören.

Der Einsatz des starken Titels „Retter” suggeriert, dass der Nutzer mit Klick auf den CTA Teil einer progressiven Bewegung werden und Gutes für die Umwelt tun kann. In Anbetracht des wachsenden ökologischen Bewusstseins der Zielgruppe ist ein solches Vorgehen strategisch klug.

29) charity: water

Charity: water möchte vorrangig erreichen, dass Geld für sauberes Wasser gespendet wird. Die Organisation kann aber nicht davon ausgehen, dass alle auf dieselbe Art spenden möchten. Die CTAs auf der Homepage verfolgen einen eigenwilligen Ansatz, um unterschiedliche Spendenmöglichkeiten anzubieten: Der potenzielle Spender kann aus den drei Buttons Donate, Pledge und Fundraise die für ihn optimale Möglichkeit des Spendens auswählen. Bestückt sind die CTAs mit aussagekräftigen Fotos und jeweils einem erläuternden Satz. In Sachen Größe unterscheiden sich die drei Calls-to-Action nicht, womit die Organisation zeigen möchte: Für charity: water ist es nicht wichtig, wie Sie spenden, Hauptsache, Sie spenden überhaupt etwas.

30) Hipmunk

Wenn Sie die Hipmunk-Website aufrufen, dann möchten Sie vermutlich einen Flug buchen. Es gibt aber noch mehr Möglichkeiten. Sie haben in vier Tabs die Auswahl: Flüge, Hotels, Mietwagen und Pauschalangebote werden angeboten. Wenn Sie auf eine dieser Optionen klicken, ändert sich das Formular, damit Sie die entsprechenden Informationen eingeben können. Um den Nutzern eine zusätzliche Orientierung zu bieten, hat Hipmunk rechts neben dem Formular noch einen CTA in leuchtendem Orange platziert. Neben dem Wort „Suchen“ sehen Sie auf dieser Schaltfläche auch noch ein kleines Flugzeug als Bestätigung, dass Sie aktuell tatsächlich einen Flug und kein Hotel suchen. Sind Sie auf dem Hotel-Tab, ändert sich das Symbol zu einem Hotel. Selbiges gilt für Mietwagen und Pauschalreisen.

31) MakeMyPersona

Ein besonderes Beispiel für ein gelungenes Pop-up-Fenster mit mehreren Calls-to-Action präsentierte MakeMyPersona. Die CTAs unterscheiden sich hier deutlich in Größe, Farbe und Gestaltung voneinander und geben dem Besucher zwei gegensätzliche Entscheidungswege vor: Template sichern oder tatsächlich gehen.

Durch eine deutliche visuelle Hierarchisierung erscheint der eigentliche CTA „Holen Sie sich die Vorlage!“ im Vergleich zu dem blassen CTA „Nein danke, im Moment nicht“ viel attraktiver und einladender. Dass den Besuchern an dieser Stelle zwei freundlich formulierte Optionen geboten werden, ist im Sinne der User Experience jedoch positiv festzuhalten - eine Marke, die Benutzern kein schlechtes Gewissen macht, wenn sie ein Angebot ablehnen, wirkt erheblich sympathischer.

Die 31 dargestellten Call-to-Action-Beispiele zeigen wie unterschiedlich die Handlungsaufforderungen ausfallen können. Sollten Sie sich dadurch inspiriert fühlen, können Sie einen Blick auf unsere CTA-Vorlagen werfen.