Jede Seite einer Website will einen Besucher zu etwas bewegen. Der Call-to-Action ist das Element, das diese Aufforderung ausdrücklich macht. Ohne ihn muss ein Besucher, der bereit zu handeln ist, den nächsten Schritt selbst herausfinden, und viele machen sich diese Mühe nicht.
Ein Call-to-Action (CTA) ist ein Button, ein Link oder ein Stück Text, das einen Website-Besucher zu einem bestimmten nächsten Schritt führt. Dieser Schritt kann sein: einen Termin buchen, ein Angebot anfragen, sich anmelden, etwas herunterladen oder Kontakt aufnehmen. Ein Call-to-Action macht die gewünschte Handlung sichtbar, offensichtlich und leicht ausführbar. Seiten ohne klaren Call-to-Action lassen Besucher ohne Richtung und ohne offensichtlichen Grund zum Bleiben.
Welche Arten von Calls-to-Action gibt es?
Nach Format
Der Button-CTA ist das häufigste Format. Ein klickbarer Button mit handlungsorientiertem Text steht dort, wo er gut zu sehen ist. Buttons funktionieren, weil sie sich optisch von der übrigen Seite abheben und Interaktivität klar signalisieren.
Ein Text-Link-CTA, eingebettet in einen Satz des Fließtexts, fällt optisch weniger auf als ein Button. Sein Vorteil ist die Platzierung. Er kann genau dort stehen, wo die Aufmerksamkeit des Lesers ist, wenn die Handlung am meisten Sinn ergibt.
Ein Sticky-Balken oder Banner-CTA über die volle Seitenbreite bleibt sichtbar, während der Besucher scrollt. Dieses Format passt gut für zeitkritische Angebote oder wenn eine Handlung auf jeder Seite einheitlich erscheinen soll.
Manche CTAs sparen sich den Klick. Ein Formularblock bittet Besucher, ihre Daten direkt auf der Seite einzugeben, statt woanders hinzuklicken. Kontaktformulare und Newsletter-Anmeldungen sind die häufigsten Beispiele.
Nach Ziel
Nicht jeder CTA hat denselben Zweck. Ein primärer CTA treibt die wichtigste Handlung der Seite an, meist Buchen, Kaufen oder Kontakt aufnehmen. Sekundäre CTAs führen Besucher zu verwandten Handlungen, die auf das Hauptziel hinarbeiten, etwa eine Fallstudie lesen, Preise ansehen oder eine Demo anschauen.
Wo sollten Calls-to-Action auf einer Website stehen?
Die Platzierung hängt vom Seitentyp ab und davon, wo im Entscheidungsprozess der Besucher voraussichtlich steht, wenn er jeden Abschnitt erreicht.
Auf einer Startseite gehört der primäre CTA Above the Fold, sichtbar ohne Scrollen. Besucher, die aus einer Suche oder einer Empfehlung kommen und sofort sehen, dass das Unternehmen passt, handeln schnell, wenn der CTA da ist. Ein zweiter CTA am Ende der Startseite fängt Besucher ab, die weiterlesen, bevor sie sich entscheiden. Der Artikel So gestaltest du eine Startseite, die funktioniert zeigt, wie der CTA mit dem Rest des Startseiten-Layouts zusammenspielt.
Auf einer Leistungs- oder Produktseite sollte der primäre CTA nach der Beschreibung dessen erscheinen, was enthalten ist, aber bevor der Besucher an dem Punkt vorbeiscrollen muss, an dem er genug gesehen hat, um sich zu entscheiden. Ein zweiter CTA am Ende der Seite fängt Besucher ab, die bis unten lesen.
Auf Blogartikeln und Infoseiten sollten CTAs im Kontext stehen, dort, wo der Inhalt gerade ein Problem behandelt hat, das das Unternehmen löst. Ein CTA direkt nach einem Abschnitt, der erklärt, warum etwas wichtig ist, wirkt besser als einer am Ende eines Artikels, den der Besucher vielleicht nicht zu Ende liest. Wie Navigation und Seitenstruktur zusammenspielen, um Besucher zwischen Seiten zu führen, siehst du unter Was ist Website-Navigation?
Wie schreibst du einen Call-to-Action, der wirkt?
Starke CTA-Texte sind konkret dazu, was beim Klick passiert. „Kostenloses Gespräch buchen“ ist klarer als „Kontakt“. „Preise ansehen“ ist klarer als „Mehr erfahren“. „Checkliste herunterladen“ ist klarer als „Hier klicken“. Der Besucher sollte genau wissen, was er bekommt oder was als Nächstes passiert, bevor er klickt.
Die einfachste Formel für CTA-Texte ist ein Tätigkeitswort, gefolgt vom konkreten Ergebnis oder Angebot. „Angebot erhalten.“ „Kostenlos testen.“ „Ganze Fallstudie ansehen.“ Jeder dieser Texte sagt dem Besucher, was er bekommt, nicht nur, dass er etwas tun soll.
Bei Dienstleistern schneiden CTA-Texte, die wahrgenommenes Risiko nehmen, besser ab als allgemeine Alternativen. „Kostenloses 20-Minuten-Gespräch buchen“ wirkt weniger bedrohlich als „Beratung buchen“. „Angebot ohne Verpflichtung erhalten“ nimmt die Angst, zu einem Kauf gedrängt zu werden. Wer das Zögern direkt im CTA anspricht, senkt die Hürde für Besucher, die interessiert, aber vorsichtig sind.
Wie viele Calls-to-Action sollte eine Seite haben?
Eine Seite sollte einen primären CTA und höchstens ein oder zwei sekundäre CTAs haben. Eine Seite mit fünf verschiedenen Calls-to-Action, die um Aufmerksamkeit konkurrieren, gibt Besuchern zu viele Optionen und führt meist zu weniger Conversions als eine Seite mit einer klaren Hauptaufforderung. Will jedes Element der Seite das wichtigste sein, ist am Ende keines wichtig.
Die Ausnahme sind lange Seiten mit mehreren eigenen Abschnitten. Dort gibt ein wiederholter primärer CTA am Ende jedes Abschnitts Besuchern einen klaren Weg, egal wie weit sie scrollen, bevor sie handeln. Wie Seitenaufbau und die Platzierung wichtiger Handlungen das Besucherverhalten prägen, behandelt Was ist UX-Design?
Wie unterscheidet sich ein CTA bei Dienstleistern und Produktanbietern?
Produktanbieter können direkte, transaktionale CTAs nutzen, weil der nächste Schritt eindeutig ist: das Produkt kaufen. „In den Warenkorb“ und „Jetzt kaufen“ funktionieren, weil der Besucher genau weiß, wozu er sich verpflichtet.
Dienstleister bitten Besucher meist vor dem Verkauf um einen Schritt mit geringerer Verbindlichkeit, weil sich die Leistung nicht mit einem Klick kaufen lässt. Ziel ist, den Besucher in ein Gespräch zu bringen, nicht eine Transaktion abzuschließen. CTAs wie „Kostenloses Gespräch buchen“, „Angebot anfragen“ oder „Projektbeschreibung senden“ bringen Besucher von Dienstleistern voran, ohne eine Verpflichtung zu verlangen, zu der sie noch nicht bereit sind. Die Sprache sollte zu dem Punkt passen, an dem der Besucher in seinem Entscheidungsprozess steht.
Woran scheitert ein Call-to-Action?
Ein CTA scheitert, wenn er unsichtbar, vage oder im falschen Moment platziert ist. Ein Button, der mit der Hintergrundfarbe der Seite verschmilzt, wird nicht geklickt. Ein CTA mit „Absenden“ sagt dem Besucher nichts darüber, was er bekommt. Ein CTA, der steht, bevor der Besucher einen Grund zum Handeln gesehen hat, wird ignoriert, weil der Besucher noch nicht bereit ist.
Visueller Kontrast ist die zuverlässigste Lösung für unsichtbare CTAs. Die Button-Farbe sollte sich deutlich von den umgebenden Seitenelementen unterscheiden. Weißraum um den CTA trennt ihn vom Inhalt und lenkt den Blick auf ihn. Was ist visuelle Hierarchie? erklärt, wie Kontrast und Abstände die Aufmerksamkeit eines Besuchers auf die wichtigsten Elemente einer Seite lenken.
So handhabt WEMASY Calls-to-Action
Der Website-Builder von WEMASY enthält CTA-Button-Blöcke, Banner-Blöcke und Formularblöcke, die du per Drag-and-drop-Editor an beliebiger Stelle einer Seite platzierst. Button-Farben steuern die Markenfarben-Einstellungen, und sie gelten einheitlich auf allen Seiten. CTA-Texte änderst du direkt im Block, ohne das Design zu beeinflussen. Position, Größe und Abstand der Buttons passt du ohne Code an.
Was alles enthalten ist, siehst du beim WEMASY Website-Builder. Die Tarife findest du auf der Preisseite.
Häufig gestellte Fragen
Welche Farbe sollte ein Call-to-Action-Button haben?
Der Button sollte sich klar vom Hintergrund und den umgebenden Elementen der Seite abheben. Die genaue Farbe zählt weniger als der Kontrast. Ein Button in derselben Farbfamilie wie der Hintergrund wird unsichtbar. Ein Button in einer Farbe, die sich von der Seite abhebt, fällt sofort auf. Bei den meisten Websites sorgt eine einheitliche Akzentfarbe für alle primären CTA-Buttons dafür, dass sie vorhersehbar und leicht zu finden sind, wenn Besucher von Seite zu Seite wechseln. Mit dem Website-Builder von WEMASY richtest du das direkt auf deiner Website ein.
Ist ein Call-to-Action dasselbe wie eine Landing Page?
Nein. Ein Call-to-Action ist ein Element auf einer Seite, das einen Besucher zu einer bestimmten Handlung führt. Eine Landing Page ist eine eigenständige Seite, die um ein Conversion-Ziel gebaut ist und meist einen primären CTA als wichtigstes Element enthält. Eine Landing Page existiert, um einen CTA zu unterstützen. Der CTA auf einer Landing Page löst die Conversion aus, für die die Seite gebaut wurde.
Woran erkennst du, ob ein Call-to-Action funktioniert?
Indem du die Klickrate des CTA und die Conversion-Rate der Seite verfolgst, auf der er erscheint. Erreicht ein großer Teil der Besucher die Seite, aber nur wenige klicken auf den CTA, ist der Button vielleicht nicht sichtbar genug, der Text nicht überzeugend oder der CTA an der falschen Stelle der Seite platziert. Am zuverlässigsten findest du heraus, welche Änderung etwas bringt, wenn du jeweils eine Variable testest: erst den Text, dann die Platzierung, dann die Farbe.
Sollte jede Seite einer Website einen Call-to-Action haben?
Ja. Jede Seite, die ein Besucher erreichen kann, sollte mindestens einen klaren nächsten Schritt haben. Auch Infoseiten, die nicht als Conversion-Seiten gedacht sind, sollten Besucher zu etwas führen. Das kann ein verwandter Artikel sein, eine passende Leistungsseite oder die Kontaktseite. Eine Seite ohne CTA ist eine Sackgasse. Der nächste Schritt muss kein harter Verkaufsdruck sein, aber er sollte vorhanden und leicht zu finden sein.
Was ist der Unterschied zwischen einem primären und einem sekundären Call-to-Action?
Ein primärer CTA ist die wichtigste Handlung, die ein Besucher auf einer Seite ausführen kann, meist die, die direkt zu einer Conversion führt, etwa Buchen, Kaufen oder Kontakt aufnehmen. Ein sekundärer CTA bietet eine Alternative mit geringerer Verbindlichkeit für Besucher, die für die primäre Handlung noch nicht bereit sind, zum Beispiel eine Fallstudie ansehen, mehr über eine Leistung lesen oder sich für Updates anmelden. Beide dienen Besuchern in verschiedenen Phasen ihres Entscheidungsprozesses. Der primäre CTA sollte immer auffälliger sein als der sekundäre.