Weiter zum Hauptinhalt

Was sind E‑Mail‑Schaltflächen und wie fügst du sie zu deinen Kampagnen hinzu?

Erfahre, wie du effektive E‑Mail‑Schaltflächen erstellen kannst. Von Schriftgröße und CTAs bis hin zu HTML‑Codierung – hier findest du alles, was du brauchst, um E‑Mail‑Schaltflächen für deine Kampagnen zu entwerfen.

E-Mail-Marketing erzielt einen hohen ROI und ermöglicht es dir, deine Zielgruppe zur richtigen Zeit anzusprechen. So kannst du mit einer soliden E-Mail-Marketingstrategie deinen Umsatz steigern und dein Unternehmen ausbauen. Woher weißt du aber, ob deine Kampagnen funktionieren?

Um die Effektivität deiner E-Mails zu messen, siehst du dir wahrscheinlich mehrere Leistungskennzahlen (KPIs) an, wie etwa die Öffnungs- und Klickraten (CTRs). Die Öffnungsrate zeigt dir, wie viele Personen deine E-Mails geöffnet haben, während die Klickrate (CTR) dabei hilft, festzustellen, ob Kunden auf deine E-Mail reagieren und aktiv werden.

Ohne einen effektiven Call-to-Action (CTA) wissen Kunden nicht, was sie tun sollen, sobald sie deine E-Mail geöffnet haben. E-Mail-Schaltflächen können Abonnenten zum Handeln bewegen und dafür sorgen, dass sie deine Website erneut besuchen, um beispielsweise ein Produkt zu kaufen.

Aber was sind E-Mail-Schaltflächen und wie kannst du sie zu E-Mails hinzufügen, um sie effektiver zu gestalten?

Was ist eine E-Mail-Schaltfläche?

Eine E-Mail-Schaltfläche ist eine CTA-Schaltfläche in deiner E-Mail, die den Benutzern mitteilt, was sie als Nächstes tun sollen. Wenn jemand deine E-Mail öffnet, werden ihm verschiedene Inhalte angezeigt.

Das Hauptziel deiner E-Mail-Marketingkampagne besteht jedoch darin, zu erreichen, dass Kunden deine Website erneut besuchen, um eine Aktion auszuführen. So macht ein E-Commerce-Unternehmen beispielsweise Werbung für ein bestimmtes Produkt, um den Umsatz über eine gezielte E-Mail-Kampagne zu steigern.

Es gibt verschiedene Möglichkeiten, eine E-Mail-Schaltfläche zu erstellen. Du kannst sie mit Hintergrundbildern versehen und unterschiedliche Schriftgrößen und -stärken verwenden. Einer der beliebtesten E-Mail-Schaltflächen ist der Bulletproof-Button.

In diesem Fall besteht die Schaltfläche aus einem HTML- und CSS-Code und nicht wie sonst aus einer Bilddatei. Damit wird sichergestellt, dass sie in verschiedenen E-Mail-Clients angezeigt werden kann.

Der wichtigste Vorteil von „kugelsicheren“ Schaltflächen ist, dass sie auch dann in E-Mails erscheinen, wenn Bilder deaktiviert sind. Bulletproof-Buttons sind entscheidend, um narrensichere E-Mails zu erstellen, die die Klick- und Engagementrate deiner E-Mail-Marketingkampagnen steigern können.

Auch wenn diese Schaltflächen codiert sind, kannst du die HTML-Vorlage bearbeiten, um die Schriftgröße oder -stärke, das Hintergrundbild und die Farben anzupassen und so klickstarke HTML-E-Mail-Schaltflächen zu gestalten, die ihr Ziel garantiert nicht verfehlen.

HTML-Schaltflächen werden in allen Clients angezeigt, auch wenn die Bilder deaktiviert sind, und sie werden schneller geladen. Das macht deine E-Mail effektiver, da die Benutzer deinen CTA sehen und wissen, was als Nächstes zu tun ist. Im Gegensatz zu bildbasierten Schaltflächen kannst du HTML-E-Mail-Schaltflächen nicht in Design-Tools wie Photoshop oder Canva gestalten und ihnen so deine ganz persönliche Note verleihen.

Vorteile von E-Mail-Schaltflächen in deinen Kampagnen

Unabhängig davon, ob du bildbasierte oder bulletproof HTML-E-Mail-Schaltflächen verwendest – einer der wichtigsten Vorteile ist die Möglichkeit, so deinen ROI und deine Klickrate zu steigern. Mit E-Mail-Schaltflächen kannst du deine Abonnenten zum Handeln auffordern und deinen CTA hervorheben, um mehr Aufmerksamkeit zu erregen.

Benutzer werden nicht aktiv, wenn deine E-Mail keinen starken CTA enthält. Alternativ zu einer E-Mail-Schaltfläche kann Hyperlink-Text verwendet werden, der Abonnenten jedoch verwirren kann, da der Text möglicherweise nichts darüber aussagt, was sie erwartet.

E-Mail-Schaltflächen sind visuell leicht zu erkennen. Wenn Empfänger deine E-Mail öffnen, sind das wahrscheinlich eines der ersten Dinge, das ihnen ins Auge fallen und sie dazu veranlassen, aktiv zu werden, einen Kauf zu tätigen, deine Website zu besuchen oder ein Angebot zu erhalten. Eine durchdacht gestaltete Schaltfläche kann die Wahrscheinlichkeit erhöhen, dass Kunden auf deine E-Mails reagieren, was sie insgesamt effektiver macht.

Wenn deine CTAs Hintergrundbilder aufweisen oder selbst Bilder sind, werden sie vielen Benutzer leider nie angezeigt, weil Bilder in ihrem E-Mail-Client deaktiviert sind. Daher sind E-Mail-Schaltflächen nicht nur entscheidend für den Erfolg deiner Kampagnen, sondern auch wichtig, um die Klickrate zu erhöhen.

Überleg mal, wie die meisten Menschen E-Mails lesen. Ähnlich wie bei Blogs suchen sie nach relevanten Informationen, anstatt jedes Wort zu lesen und sich jedes Bild anzusehen. Deine E-Mail-Schaltfläche hebt sich aus mehreren Gründen vom Rest des Inhalts ab, wie etwa durch die Schriftgröße und -stärke.

Die Schaltflächen sind in der Regel größer und haben eine fettgedruckte Schriftart, um die Aufmerksamkeit der Benutzer auf sich zu ziehen. Zusätzlich verfügen sie über Designelemente, die sie von Text und Bildern abheben. Infolgedessen sind CTAs auf E-Mail-Schaltflächen viel effektiver, wenn es darum geht, die Aufmerksamkeit der Benutzer auf sich zu lenken. So kannst du ihnen klar vermitteln, was du von ihnen erwartest.

So fügst du eine E-Mail-Schaltfläche in HTML und CSS hinzu

Es gibt mehrere Möglichkeiten, eine E-Mail-Schaltfläche in HTML und CSS einzubetten. Du musst kein Website-Entwickler oder Programmierprofi sein, um dafür zu sorgen, dass deine E-Mail-Schaltflächen ihr Ziel nicht verfehlen. Meist werden dafür Bilder mit Links oder HTML verwendet.

Mit Mailchimp kannst du deine E-Mail-Schaltfläche ganz leicht gestalten, einschließlich der Änderung deiner Schriftart mit Inhaltsblöcken. So kannst du Schaltflächen im Handumdrehen per Drag-and-Drop erstellen.

HTML-E-Mail-Schaltflächen

HTML-E-Mail-Schaltflächen können über die gesamte Breite verlaufen oder auf eine feste Breite beschränkt sein. Das hängt davon ab, wie deine Schaltfläche im Vergleich zum Rest des E-Mail-Layouts aussehen soll.

Um HTML-E-Mail-Schaltflächen zu erstellen, musst du deine E-Mail-Vorlage mit dem folgenden Code benutzerdefiniert programmieren:

'''< table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#505050; border:1px solid #353535; border-radius:5px;">

Wie du siehst, würde deine Schaltfläche in diesem Fall „Weiterlesen“ lauten. Du kannst die Schriftart auch auf dein Branding und die verwendeten Schriftarten deiner Website abstimmen – ganz so, wie du es für richtig hältst. Natürlich hängt die beste Schriftart für E-Mails von deinem allgemeinen Branding und Design ab. Wir empfehlen dir jedoch, sie möglichst einfach zu halten.

Adaptive E-Mail-Schaltflächen

Adaptive E-Mail-Schaltflächen passen sich an die Breite der E-Mail an, je nach dem enthaltenen Text. Im Code ist keine Breite festgelegt, da sie die Breite nach dem Text richtet. Der Code für adaptive E-Mail-Schaltflächen sieht folgendermaßen aus:

'''

<td align="center" valign="middle" style="color:#FFFFFF; font-family:Helvetica, Arial, sans-serif; font-size:16px; font-weight:bold; letter-spacing:-.5px; line-height:150%; padding-top:15px; padding-right:30px; padding-bottom:15px; padding-left:30px;">
  <a href="http://www.mailchimp.com/blog/" target="_blank" style="color:#FFFFFF; text-decoration:none;">Lies weitere Geschichten in unserem Blog</a>
</td>

'''

Zum Glück musst du nicht programmieren können, um die perfekten E-Mail-Schaltflächen für deine E-Mail-Marketingkampagne zu erstellen. Stattdessen kannst du einen Inhaltsblock per Drag-and-Drop in eine bestehende Vorlage ziehen und den HTML-Code nach Belieben bearbeiten.

Strategien zur Platzierung von E-Mail-Schaltflächen

Der Standort deines Call-to-Action bestimmt, ob die Abonnenten ihn bemerken und Maßnahmen ergreifen, daher ist eine strategische Platzierung entscheidend für die Maximierung von Klicks und Konversionen. Daher solltest du dir Gedanken darüber machen, wie die Leute E-Mails tatsächlich lesen und wonach sie suchen, wenn sie eine Nachricht öffnen.

Über dem Falz vs. unterhalb des Falzes

„Über dem Falz“ bezieht sich auf den Inhalt, der ohne Scrollen sichtbar ist, während „unterhalb des Falzes“ die Bereiche bezeichnet, für deren Sichtbarkeit der Benutzer nach unten scrollen muss. Wenn du deine primäre E-Mail-Schaltfläche oberhalb des sichtbaren Bereichs platzierst, wird die maximale Sichtbarkeit gewährleistet, da viele Abonnenten nicht durch deine gesamte E-Mail scrollen werden.

Ignoriere die Platzierung unterhalb des Falzes jedoch nicht völlig. Wenn du längere Inhalte hast, die einen Mehrwert und Interesse schaffen, kann eine gut platzierte Schaltfläche am Ende Abonnenten ansprechen, die deine vollständige Nachricht gelesen haben.

Wiederhole CTAs im gesamten E-Mail-Text

Mehrere Schaltflächen in deiner E-Mail zu platzieren ist unaufdringlich und gibt deinen Abonnenten mehr Möglichkeiten, Maßnahmen zu ergreifen. Diese Strategie funktioniert besonders gut für längere E-Mails, die nicht jeder vollständig durchliest.

Verteile deine Schaltflächen auf natürliche Weise im Inhalt und stelle sicher, dass jede einzelne für den umgebenden Text relevant ist und nicht zufällig erscheint. Denke daran, dasselbe Design und Styling für alle Schaltflächen zu verwenden, damit sie einheitlich und professionell aussehen.

Schaltflächen benutzerfreundlich ausrichten

Die Platzierung deiner Schaltflächen sollte dem entsprechen, was deine Abonnenten basierend auf dem Inhalt und Zweck deiner E-Mail erwarten. Wenn du einen Verkauf ankündigst, platziere die Schaltfläche „Jetzt kaufen“ direkt nach den Rabattdetails.

Bei Bildungsinhalten platzierst du deinen Call-to-Action, nachdem du wertvolle Informationen bereitgestellt hast und die Abonnenten für den nächsten Schritt bereit sind. Denke an die Customer Journey: An welcher Stelle deiner E-Mail ist es für jemanden am sinnvollsten, mit einem Klick auf deine Website oder Landingpage zu gelangen?

Do's und Don'ts für E-Mail-Schaltflächen

Bei der Gestaltung effektiver Schaltflächen für E-Mails geht es nicht nur darum, sie hübsch aussehen zu lassen. Sie müssen auf verschiedenen E-Mail-Clients und Geräten einwandfrei funktionieren und deine Abonnenten zu der gewünschten Aktion motivieren.

Eine gute Schaltfläche kann den Unterschied ausmachen, ob ein Abonnent auf deine Website klickt oder deine E-Mail löscht. Hier erfährst du, was du für erfolgreiche E-Mail-Schaltflächen wissen musst.

Verwende keine Bilder

Wie bereits erwähnt, werden nicht alle Bilder in jedem E-Mail-Client angezeigt. Daher sehen viele deiner Abonnenten deine CTA-E-Mail-Schaltflächen möglicherweise nicht, wenn sie Bilder deaktiviert haben.

Wenn du Bilder als Schaltflächen verwendest, kannst du zwar dafür sorgen, dass deine Schaltflächen klar hervorstechen – wichtiger ist dabei jedoch, dass sie für alle deine Abonnenten sichtbar sind. Denn schließlich möchtest du, dass sie eine Aktion ausführen.

Wähle die richtigen Schriftarten aus

Wie auch Bilder werden nicht alle Schriftarten in allen E-Mail-Programmen korrekt angezeigt. Daher solltest du weithin anerkannte Schriftarten auswählen. Du kannst einen Generator für Schriftarten verwenden, um die richtige Schriftart für deine E-Mail-Marketingkampagnen zu finden. So kannst du sicherstellen, dass sie ins Auge fallen und richtig angezeigt werden.

Auch die Größe und Stärke der Schriftart spielt eine wichtige Rolle dabei, ob sich die Schaltfläche vom Rest des E-Mail-Inhalts abhebt.

Berücksichtige das Ziel

Wenn du E-Mail-Schaltflächen verwendest, hast du ein bestimmtes Ziel vor Augen. So haben E-Commerce-Unternehmen, die ein Produkt bewerben, um den Umsatz zu steigern, wahrscheinlich eine E-Mail-Schaltfläche mit der Aufschrift „Jetzt kaufen“, die erscheint, nachdem das Produkt im Rest des Inhalts hervorgehoben wurde.

Wenn eine Schaltfläche nicht zur Produktseite führt, sind die Abonnenten verwirrt und verlassen die Website. Daher solltest du immer sicherstellen, dass du die richtigen Erwartungen setzt, damit Kunden genau wissen, wo sie landen, wenn sie auf deine Schaltfläche klicken.

Verfasse einen starken CTA

Die Designelemente deiner E-Mail-Schaltfläche sind entscheidend, um sie hervorzuheben. Aber der CTA ist unerlässlich, um klare Erwartungen vorzugeben und Abonnenten zum Handeln zu bewegen.

Dein CTA sollte nur ein paar Worte lang sein, um den Kunden mitzuteilen, was sie tun sollen. Etwas so Einfaches wie „Jetzt kaufen“ oder „Kollektion entdecken“ kann Kunden effektiv darüber informieren, was sie erwartet, wenn sie auf die Schaltfläche klicken.

Achte auf das Design der Schaltflächen

Das visuelle Design deiner Schaltfläche beeinflusst, wie anklickbar sie erscheint. Verwende kontrastierende Farben, die sich vom Hintergrund deiner E-Mail abheben, und stelle sicher, dass deine Schaltflächen auch so aussehen und die richtigen Ränder, Abstände und Hover-Effekte haben.

Wenn du dein CSS einrichtest, solltest du die Eigenschaften von Inline-Blockanzeigen in Betracht ziehen, um sicherzustellen, dass deine Schaltflächen ihre Form in verschiedenen E-Mail-Clients beibehalten. Die Textausrichtung sollte den Schaltflächentext zentrieren, um ein sauberes, professionelles Erscheinungsbild zu erzielen.

Teste deine E-Mail-Schaltflächen vor dem Senden

Selbst die wunderschönste E-Mail-Schaltfläche liefert keine Ergebnisse, wenn sie beim Anklicken nicht richtig funktioniert.

Das Testen ist wie ein Sicherheitsnetz, das dich vor peinlichen Fehlern bewahrt, z. B. fehlerhaften Links, Schaltflächen, die nicht richtig angezeigt werden, oder CTAs, die auf dem Desktop gut aussehen, aber auf Mobilgeräten nicht angetippt werden können.

Intelligente E-Mail-Marketer versenden niemals Kampagnen ohne gründliche Tests, da ein technischer Fehler die Performance deiner gesamten Kampagne beeinträchtigen kann.

Vorschau auf allen Geräten und Clients

Deine E-Mail-Schaltfläche mag in deinem E-Mail-Builder perfekt aussehen, aber das garantiert nicht, dass er überall dort funktioniert, wo deine Abonnenten ihn sehen. Teste deine E-Mails mit den wichtigsten E-Mail-Clients wie Gmail, Outlook, Apple Mail und Yahoo Mail, um Anzeigeprobleme zu erkennen, bevor sie deine Zielgruppe erreichen.

Und vergiss dabei nicht die Mobilgeräte. Mit Tools wie Mailchimp siehst du genau, wie deine Schaltflächen auf verschiedenen Plattformen dargestellt werden. Alternativ kannst du dir Test-E-Mails auf verschiedenen Geräten und E-Mail-Apps senden.

A/B-Tests für Platzierung und Text der CTA-Schaltflächen

A/B-Tests zeigen dir, was bei deiner spezifischen Zielgruppe tatsächlich funktioniert. Probiere verschiedene Schaltflächenplatzierungen aus.

Du kannst auch verschiedene Schaltflächentexte testen, um zu sehen, ob „Jetzt kaufen“ bei deinen Abonnenten besser abschneidet als „Sammlung durchsuchen“. Ändere bei deinen Tests jeweils nur ein Element, und stelle sicher, dass du genügend Daten hast, um aussagekräftige Schlussfolgerungen zu ziehen, bevor du dich für eine Option entscheidest.

Überprüfe Link-Tracking und Barrierefreiheit

Bevor du auf Senden klickst, klicke auf jede Schaltfläche in deiner E-Mail, um sicherzustellen, dass die Links tatsächlich funktionieren und zum richtigen Ziel führen. Richte die richtigen Tracking-Parameter ein, um zu messen, welche Schaltflächen angeklickt werden und welche zu Konversionen führen.

Denke auch an die Barrierefreiheit. Deine Schaltflächen sollten für Menschen mit Behinderungen nutzbar sein. Schließe daher Alt-Text ein, sorge für einen ausreichenden Farbkontrast und stelle sicher, dass sie mit Tastenkombinationen navigiert werden können.

Diese kleinen Details mögen unbedeutend erscheinen, können aber einen erheblichen Einfluss sowohl auf deine Zustellbarkeit als auch auf den Ruf deiner Marke haben.

Nutze die Kraft eines starken CTA

Bei einem starken CTA im E-Mail-Marketing geht es um mehr als nur um die Worte, die du verwendest, um Benutzer zum Handeln zu bewegen. Denn mit einer Schaltfläche kannst du ihre Aufmerksamkeit auf deinen CTA lenken, klare Erwartungen setzen und ihnen die nächsten Schritte aufzeigen.

Schaltflächen stechen aus dem Rest des E-Mail-Inhalts hervor und sind somit die beste Möglichkeit, den Abonnenten zu zeigen, was sie als Nächstes tun sollen. Mailchimp macht es dir denkbar einfach, E-Mail-Schaltflächen zu gestalten, die Klicks und Verkäufe fördern. Mit dem richtigen Design kannst du die Effektivität deiner Kampagnen verbessern.


Wichtige Erkenntnisse

  • Gut gestaltete E-Mail-Schaltflächen erhöhen die Klickraten und Konversionen, indem sie den nächsten Schritt für Abonnenten klar und deutlich darstellen.
  • HTML-Schaltflächen werden in allen E-Mail-Clients angezeigt, auch wenn Bilder deaktiviert sind, um sicherzustellen, dass deine CTAs für Abonnenten immer sichtbar sind.
  • Positioniere deine primäre Schaltfläche für maximale Sichtbarkeit über dem Falz, aber wiederhole CTAs in längeren E-Mails, um Leser in verschiedenen Phasen zu erfassen.
  • Lass dir immer eine Vorschau deiner Schaltflächen auf verschiedenen Geräten und E-Mail-Clients anzeigen und verwende dann A/B-Tests, um die Platzierung, den Text und das Design für eine bessere Performance zu optimieren.

Artikel teilen