{"id":89609,"date":"2013-04-18T21:05:11","date_gmt":"2013-04-18T15:35:11","guid":{"rendered":"https:\/\/vwo.com\/blog\/call-to-action-buttons-ultimate-guide\/"},"modified":"2026-01-12T16:30:48","modified_gmt":"2026-01-12T11:00:48","slug":"call-to-action-buttons-leitfaden","status":"publish","type":"post","link":"https:\/\/vwo.com\/blog\/de\/call-to-action-buttons-leitfaden\/","title":{"rendered":"Call To Action Buttons: Der ultimative Guide mit Best Practices und Beispielen"},"content":{"rendered":"\n

Call-to-Action-Buttons (CTA) sind die Wegweiser f\u00fcr Ihre Besucher, denn sie zeigen ihnen, wie sie ein Ziel erreichen k\u00f6nnen. Au\u00dferdem tragen sie zur Conversion Ihrer Website bei. Alle, die schon einmal A\/B-Tests ausprobiert<\/a> haben, wissen um die Bedeutung eines guten Call-to-Action f\u00fcr die Conversion Rate. <\/p>\n\n\n\n

Einige der g\u00e4ngigsten A\/B-Tests beinhalten das \u00c4ndern von Farbe und Gr\u00f6\u00dfe der Buttons, gefolgt vom Tracking, um die beste Kombination zu ermitteln, die zur Navigation der Besucher<\/a> zu Conversions bewirkt.<\/p>\n\n\n\n

Doch halt. Ein erfolgreicher CRO-Plan beginnt mit dem Sammeln von m\u00f6glichst vielen Nutzerinformationen und Erkenntnissen. Daraus leitet sich alles ab, um eine effektive Roadmap zu erstellen. Bevor Sie sich in Experimente st\u00fcrzen, sollten Sie das Besucherverhalten auf Ihrer Website verstehen und auch f\u00fcr Button-Tests wirksame Hypothesen aufstellen. Entgegen der landl\u00e4ufigen Meinung handelt es sich NICHT um ein \u201eVersuch-und-Irrtum-Spiel\u201c!<\/p>\n\n\n\n

Kostenlos herunterladen: Leitfaden zur Landingpage-Optimierung<\/em><\/strong><\/a><\/p>\n\n\n\n

In diesem Blogbeitrag haben wir einen Plan erstellt und die besten Praktiken f\u00fcr die Gestaltung und den Einsatz von Call-to-Action-Buttons mit hoher Conversion Rate auf Websites aufgelistet. <\/p>\n\n\n

Priorisierung Ihrer CTAs<\/strong><\/h2>\n\n\n

Obwohl Experten branchenweit empfehlen, nur einen CTA pro Seite zu verwenden, ist es wichtig, dass Sie die Priorit\u00e4ten Ihrer Conversion-Strategie klar festlegen, wenn Sie einen zweiten CTA ben\u00f6tigen.<\/p>\n\n\n\n

Reale Testszenarien k\u00f6nnen kompliziert sein und mehr Variablen als nur die Revenue Conversion Rate der einzelnen CTAs beinhalten. In diesem Fall schlage ich vor, dass Sie eine Tabelle wie folgend gezeigt erstellen, um \u00fcber prim\u00e4re und sekund\u00e4re CTAs<\/a> zu entscheiden. Sie sollten jede der Variablen hypothetisch auf einer Skala von 0-5 bewerten. Berechnen Sie die Summe der Punkte, um Ihre prim\u00e4re Handlungsaufforderung zu finden. Zum Beispiel:<\/p>\n\n\n\n

 <\/th>Variable1<\/th>Variable2<\/th>Variable3<\/th>Total<\/th><\/tr>
CTA 1<\/td>4<\/td>5<\/td>1<\/td>10<\/td><\/tr>
CTA 2<\/td>3<\/td>2<\/td>4<\/td>9<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

Die Variablen k\u00f6nnen hier alles M\u00f6gliche sein: fr\u00fchere CTRs<\/a>, Revenue Conversions, technische Komplikationen und einige weitere. Jeder Fall ist einzigartig und kann seine eigene Komplexit\u00e4t von Variablen haben. Das Wichtigste ist, dass Sie wissen, wie Sie Ihre Priorit\u00e4ten in solchen F\u00e4llen richtig setzen.<\/p>\n\n\n\n

Achten Sie darauf, dass selbst wenn Sie zwei Call-to-Actions<\/a> auf der gleichen Seite haben, diese dennoch in einem gewissen Zusammenhang zueinander stehen sollten. Das ultimative Conversion-Ziel beider Buttons sollte das gleiche sein.<\/p>\n\n\n

4 Faktoren, die Sie f\u00fcr high-converting CTAs ber\u00fccksichtigen sollten<\/strong><\/h2>\n\n\n

Da CTAs entscheidende Elemente auf Ihrer Landingpage sind und sich auf Ihren Conversion Funnel auswirken, sollte ihre Designstrategie bei der Optimierung<\/a> der Conversions genauestens beachtet werden. <\/p>\n\n\n

1. Button text<\/strong><\/h3>\n\n\n

Wert. Ja! Ihre CTA-Buttons sollten die Frage beantworten: \u201eWarum sollte ich das anklicken?\u201c Mit anderen Worten: Sie sollten den Lesern so klar und einfach wie m\u00f6glich einen Nutzen vermitteln. Ein sch\u00f6nes Beispiel daf\u00fcr ist der folgende Netflix-CTA.<\/p>\n\n\n\n

Inmitten der Covid-19-Pandemie hatte Netflix im ersten Quartal 2021 weltweit 207,64 Millionen zahlende Abonnenten<\/a>, was auf die Lockdowns und die Beliebtheit der Streaming-App zur\u00fcckzuf\u00fchren ist. Das saubere Design des CTA-Buttons auf dem Formular ist einfach f\u00fcr die Augen, und der Text kommuniziert nicht aggressiv, sondern l\u00e4dt Sie ein, loszulegen. Der zus\u00e4tzliche Text ist ebenfalls beruhigend und erm\u00f6glicht es Interessenten, schnelle Entscheidung zu treffen.<\/p>\n\n\n\n

\"Netflix
Bildquelle: Netflix<\/a><\/figcaption><\/figure>\n\n\n\n

Der Text Ihres Buttons sollte spezifisch, einfach und klar sein. Die zus\u00e4tzlichen Details rund um Ihre CTA sollten den Entscheidungsprozess Ihrer Besucher erleichtern, anstatt sie zu verwirren.<\/p>\n\n\n\n

Ein weiteres Hindernis, das der Text eines Buttons f\u00fcr Sie beseitigen kann, ist die Zur\u00fcckhaltung. Website-Besucher z\u00f6gern aus vielerlei Gr\u00fcnden, etwas zu unternehmen. Wenn Sie das Z\u00f6gern der Besucher verstehen, indem Sie sie direkt fragen, was sie davon abh\u00e4lt, auf Ihrer Website aktiv zu werden, k\u00f6nnen Sie eine wahre Fundgrube an Erkenntnissen entdecken, die Sie zur Optimierung Ihrer CTA-Buttons und Ihrer Website im Allgemeinen nutzen k\u00f6nnen.<\/p>\n\n\n\n

\"Blog<\/a><\/figure>\n\n\n

2. Buttonfarbe<\/strong><\/h3>\n\n\n

Ich will damit nicht sagen, dass Orange bessere Conversion Rates als Rot hat oder dass Gr\u00fcn die Farbe ist, die Sie f\u00fcr Ihre CTA-Buttons verwenden sollten. Die Einheitsgr\u00f6\u00dfe, die f\u00fcr alle passt, macht den Zweck des Experimentierens zunichte. <\/p>\n\n\n\n

Sie k\u00f6nnen die Hypothese aufstellen, dass die Farbe des Buttons in starkem Kontrast zu den Hintergrundfarben stehen sollte, da sie die Aufmerksamkeit der Besucher auf den ersten Blick erregt. F\u00fchren Sie dann einen A\/B-Test mit A\/B-Testplattformen<\/a> durch, um diese Hypothese zu best\u00e4tigen.<\/p>\n\n\n\n

Sehen Sie sich zum Beispiel den magentafarbenen CTA f\u00fcr die kostenlose Testversion von VWO vor einem wei\u00dfen Hintergrund auf der Homepage an:<\/p>\n\n\n\n

\"Vwo<\/figure>\n\n\n

3. Platzierung des Call-to-Action<\/strong><\/h3>\n\n\n

Okay, wir wissen alle, dass die Handlungsaufforderung an einer prominenten Stelle auf der Website stehen sollte. Es gibt also keine Punkte f\u00fcr das Aufrufen des Headers, der linken Seitenleiste oder der Seitenmitte.<\/p>\n\n\n\n

Hat jemand \u201eabove the fold<\/a>\u201cgesagt? Interessant, aber nicht immer wahr! Ja, tats\u00e4chlich ist \u201eabove the fold\u201c hier nur ein Mythos. In vielen F\u00e4llen hat sich gezeigt, dass die Verlegung des CTA \u201ebelow<\/a> the fold\u201c zu einer h\u00f6heren Conversion Rate f\u00fchrt. Wie es scheint, m\u00f6chten die Leute bei komplexeren Produkten das Angebot erst ein wenig besser verstehen, bevor sie handeln. Wenn Ihr CTA in solchen F\u00e4llen oberhalb platziert ist, werden sich nicht viele Leute die M\u00fche machen, ihn anzuklicken.<\/p>\n\n\n\n

Lenken Sie die Aufmerksamkeit der Besucher auf Ihre CTA, indem Sie einen gro\u00dfen Teil des wei\u00dfen Raums nutzen. Das hilft dem CTA, sich abzuheben und die Augen der Besucher in die richtige Richtung zu lenken. Auch wenn Sie versuchen, Ihre Buttons auf Leerraum zu platzieren, sollten Sie darauf achten, dass sie nicht so weit vom Haupttext oder den umgebenden Elementen auf der Seite entfernt sind, dass sie unzusammenh\u00e4ngend wirken. Dies kann wiederum Ihre Conversion Rate verringern.<\/p>\n\n\n\n

Sehen Sie sich an, wie Paypal Leerraum auf seiner Website verwendet:<\/p>\n\n\n\n

\"Paypal
Bildquelle: \u00a9 Paypal<\/a><\/figcaption><\/figure>\n\n\n\n

Kostenlos herunterladen: Leitfaden zur Landingpage-Optimierung<\/em><\/strong><\/a><\/h3>\n\n\n

4. CTA-Gr\u00f6\u00dfe<\/strong><\/h3>\n\n\n

Ihre CTA sollte gut lesbar sein und den Besucher nicht \u00fcberfordern. Es gibt Situationen, in denen Sie Ihre prim\u00e4re CTA von der sekund\u00e4ren CTA unterscheiden sollten. <\/p>\n\n\n\n

Unterziehen Sie Ihre CTA-Buttons in Bezug auf Gr\u00f6\u00dfe und Farbe einem A\/B-Test, um herauszufinden, welche Variationen die meisten Klicks und Aufrufe erhalten und damit zu Ihren Conversion-Zielen beitragen. <\/p>\n\n\n\n

\"Blog<\/a><\/figure>\n\n\n\n

Hier sehen Sie ein Beispiel von Wufoo.com mit zwei CTAs in verschiedenen Farben:<\/p>\n\n\n\n

\"Wufoo
Bildquelle: Wuffo<\/a><\/figcaption><\/figure>\n\n\n

Zus\u00e4tzliche Tipps<\/strong><\/h2>\n\n\n