Die Wirksamkeit eines Countdown-Timers hängt ebenso sehr davon ab, wie er aussieht und wo er platziert ist, wie von der Frist, auf die er hinzählt. Derselbe Timer kann in einem Layout die Conversion steigern und in einem anderen völlig ignoriert werden.
Das ist wichtiger, als die meisten Marketer denken. Laut den Daten von Designmodo aus 2025 erreichen E-Mails mit Bildern eine Klickrate von 4.84% gegenüber nur 1.6% bei reinen Text-Nachrichten. Doch es geht nicht nur darum, ein Bild einzubinden – es geht um Platzierung, Kontext und darum, wie das visuelle Element die Abonnenten zu der gewünschten Handlung führt.
Diese Sammlung liefert Ihnen 12 bewährte E-Mail-Layouts für Countdown-Timer, jeweils mit Textvorlagen und Hinweisen dazu, wann Sie sie einsetzen sollten. Jedes Layout ist auf reale Posteingangsbedingungen ausgelegt – einschließlich der Frage, wie es sich in Outlook Desktop verhält (statisches erstes Frame) und wie es aussieht, nachdem die Frist abgelaufen ist.
Die strategische Grundlage finden Sie in unserem vollständigen Leitfaden zu Countdown-Timern und den Best Practices.
Layout 1: Der Hero-Timer
Struktur: Timer-Bild in voller Breite als primäres visuelles Element, direkt unter der Überschrift. CTA-Button unmittelbar darunter.
Am besten für: Flash-Sales, zeitkritische Ankündigungen, alles, bei dem die Frist die Botschaft ist. Wird in den E-Mails 2 und 5 einer Flash-Sale-Sequenz verwendet.
Textvorlage: „[Überschrift: 30% Rabatt auf alles] [TIMER – volle Breite] [CTA: Jetzt shoppen]“ Halten Sie es minimal. Der Timer übernimmt die Hauptarbeit.
Warum es funktioniert: Der Timer ist das Erste, was Abonnenten nach der Überschrift sehen. Kein Scrollen, kein Stöbern – nur Dringlichkeit und Handlung. Dieses Layout erzielt in Flash-Sale-Sequenzen durchgängig die höchsten Klickraten.
Outlook-Fallback: Das erste Frame sollte den Fristtext anzeigen („Endet Sonntag 11:59 PM“), da Outlook Desktop das GIF nicht animiert.
Layout 2: Der CTA-Begleiter
Struktur: Timer direkt über dem CTA-Button platziert, unterhalb des Hauptinhalts. Kleiner als die Hero-Größe (typischerweise 300–400px breit, zentriert).
Am besten für: Produktfokussierte E-Mails, bei denen das Angebot wichtiger ist als der Countdown. Der Abonnent liest zuerst über das Produkt und sieht den Timer dann, wenn er sich dem CTA nähert.
Textvorlage: „[Produktbeschreibung und Vorteile] [Timer mit Label: ‚Angebot läuft ab in:‘] [CTA: In den Warenkorb]“
Warum es funktioniert: Gemäß den Best Practices schafft die Platzierung des Timers in der Nähe des CTA eine visuelle Einheit aus Dringlichkeit und Handlung. Der Abonnent verarbeitet das Wertversprechen, und die Frist verstärkt anschließend die Notwendigkeit, jetzt zu handeln.
Layout 3: Die Inline-Erinnerung
Struktur: Timer in den Fließtext eingebettet, zwischen der Angebotsbeschreibung und dem CTA. Typischerweise 200–300px breit, linksbündig oder zentriert.
Am besten für: Längere E-Mails, in denen die Dringlichkeit gegenüber der Botschaft zweitrangig, aber dennoch wertvoll ist. Newsletter-artige Inhalte mit einem Werbeabschnitt.
Textvorlage: „[Lehrreicher Inhalt oder eine Geschichte] [Inline: ‚Übrigens – dieses Angebot läuft ab in: [TIMER]‘] [CTA: Mehr erfahren]“
Warum es funktioniert: Der Timer dominiert die E-Mail nicht, erinnert die Leser aber daran, dass das Angebot nicht dauerhaft ist. Ideal, um Dringlichkeit aufrechtzuerhalten, ohne dass die gesamte E-Mail wie ein Verkaufsdruck wirkt.
Layout 4: Das geteilte Panel
Struktur: Zweispaltiges Layout. Linke Spalte: Angebotsdetails und CTA. Rechte Spalte: Countdown-Timer (vertikal gestapelt – Tage, Stunden, Minuten, Sekunden).
Am besten für: E-Mails mit dichten Produktinformationen, bei denen Sie durchgehende Dringlichkeit wünschen, ohne den Inhaltsfluss zu unterbrechen. Funktioniert gut für Produkteinführungen mit detaillierten Spezifikationen.
Textvorlage: „[Links: Produktname, wichtigste Merkmale, Preis, CTA] [Rechts: Timer mit Label ‚Einführungspreis endet in:‘]“
Hinweis für Mobilgeräte: Zweispaltige Layouts werden auf Mobilgeräten gestapelt. Stellen Sie sicher, dass der Timer über dem CTA steht, nicht darunter, damit die Dringlichkeit vor dem Handlungsbutton sichtbar ist.
Layout 5: Die Banner-Leiste
Struktur: Eine schmale Banner-Leiste in voller Breite am oberen Rand der E-Mail mit einem kleinen Timer und einer kurzen Dringlichkeitsbotschaft. Der Rest der E-Mail folgt darunter als normaler Inhalt.
Am besten für: Newsletter oder Content-E-Mails, die zufällig in einen Verkaufszeitraum fallen. Die Leiste fügt Dringlichkeit hinzu, ohne die gesamte E-Mail neu gestalten zu müssen.
Textvorlage: „[Banner: ‚🔥 Sommer-Sale endet in [TIMER] – Jetzt shoppen →‘] [Regulärer Newsletter-Inhalt darunter]“
Warum es funktioniert: Abonnenten, die sich für den Sale interessieren, klicken auf das Banner. Abonnenten, die wegen des Inhalts gekommen sind, scrollen daran vorbei. Niemand fühlt sich von einer Dringlichkeit überrumpelt, die er nicht erwartet hat.
Layout 6: Der Countdown + Social Proof
Struktur: Timer kombiniert mit einem Social-Proof-Element: „2,400 Bestellungen in den letzten 12 Stunden.“ Beide über dem CTA platziert.
Am besten für: E-Mails in der Mitte einer Flash-Sale-Sequenz (typischerweise E-Mail 4). Die Kombination aus zeitlicher Knappheit (Timer) und sozialer Bestätigung (andere kaufen) ist besonders wirkungsvoll.
Textvorlage: „[Social-Proof-Statistik] [Timer] [CTA: Machen Sie mit – jetzt shoppen]“
Layout 7: Der Timer auf der Produktkarte
Struktur: Einzelne Produktkarten, jede mit einem eigenen kleinen Countdown-Timer unter dem Preis. Am besten geeignet für kuratierte Auswahlen oder Kategorie-E-Mails.
Am besten für: E-Mails mit 3–6 Produkten, die alle dieselbe gemeinsame Frist haben. Der Timer auf jeder Karte unterstreicht, dass jedes Produkt zeitlich begrenzt ist.
Hinweis: Alle Timer verwenden dieselbe Tickvio-URL – ein Timer, mehrfach angezeigt. Es ist nicht nötig, für jedes Produkt einen eigenen Timer zu erstellen.
Layout 8: Der minimalistische Timer
Struktur: Reine Text-Erwähnung der Frist mit einem sehr kleinen Timer-Bild (100–150px breit) inline. Optisch fast nebensächlich, erzeugt aber dennoch Dringlichkeit.
Am besten für: B2B-E-Mails, professionelle Kontexte, in denen ein großes animiertes GIF fehl am Platz wäre. Upgrade-Aufforderungen im SaaS-Bereich, Fristen bei Finanzdienstleistungen.
Layout 9: Der Preheader-Timer
Struktur: Der Timer wird im Vorschau- bzw. Preheader-Text erwähnt („Sale endet in 6 Stunden“), während der eigentliche animierte Timer im E-Mail-Text steht. Der Preheader erzeugt Dringlichkeit, noch bevor die E-Mail überhaupt geöffnet wird.
Am besten für: Jede Kampagne, deren Betreffzeile Dringlichkeit erwähnt. Der Preheader verstärkt das Versprechen der Betreffzeile.
Layout 10: Der Timer für den abgebrochenen Warenkorb
Struktur: Produktbild und -details (links), Timer und CTA (rechts). Der Timer betont das Reservierungsfenster des Warenkorbs, nicht einen Rabatt.
Am besten für: Warenkorbabbruch-Flows. E-Mails bei Warenkorbabbruch erreichen laut den Daten von Analyzify aus 2024 Öffnungsraten von 39.07% und eine CTR von 23.33% – ein gut gestaltetes Timer-Layout maximiert die Conversion aus diesen Öffnungen mit hoher Kaufabsicht.
Textvorlage: „[Links: Produktbild, Name, Preis] [Rechts: ‚Ihr Warenkorb ist reserviert für: [TIMER]‘ + CTA: Kauf abschließen]“
Layout 11: Der Timer für das Willkommensangebot
Struktur: Willkommensnachricht oben, gut sichtbar platzierter Rabattcode, Timer, der das persönliche Countdown-Fenster anzeigt, CTA darunter. Aufgeräumt, fokussiert, ohne Ablenkungen.
Am besten für: E-Mails der Willkommensserie. Willkommens-E-Mails erreichen laut den GetResponse-Benchmarks durchschnittliche Öffnungsraten von 83.6% – der Timer verwandelt diese Aufmerksamkeit in Handlung.
Textvorlage: „[Willkommen bei [Marke]!] [Ihr exklusiver Rabatt von 15%:] [Code: WELCOME15] [Läuft ab in: [TIMER]] [CTA: Jetzt shoppen]“
Layout 12: Der Timer für Events/Webinare
Struktur: Event-Details (Referenten, Agenda, Datum) mit einem Timer, der bis zum Anmeldeschluss oder Event-Beginn herunterzählt. Der CTA ist auf die Anmeldung ausgerichtet.
Am besten für: Event- und Webinar-Werbung. Der Timer steigert die Anmeldedringlichkeit für Events mit begrenzter Kapazität.
Textvorlage: „[Event-Name und Datum] [Fotos und Kurzbiografien der Referenten] [Anmeldung schließt in: [TIMER]] [CTA: Jetzt anmelden – kostenlos]“
Design-Prinzipien für alle Layouts
Unabhängig davon, welches Layout Sie verwenden, gelten diese Prinzipien:
Timer nah am CTA. Je näher der Timer am Handlungsbutton ist, desto mehr Dringlichkeit überträgt sich auf die Klickentscheidung. Trennen Sie sie nicht durch mehrere Inhaltsabschnitte.
Klare Beschriftung. Kennzeichnen Sie immer, worauf der Timer herunterzählt: „Sale endet in:“, „Ihr Angebot läuft ab in:“, „Anmeldung schließt in:“. Ein Timer ohne Kontext ist visuelles Rauschen.
Responsives Stapeln. Auf Mobilgeräten (auf die 55% der E-Mail-Öffnungen entfallen) werden mehrspaltige Layouts vertikal gestapelt. Stellen Sie sicher, dass der Timer in der gestapelten Reihenfolge über dem CTA erscheint, nicht darunter.
Ablaufzustand für jedes Layout. Legen Sie fest, was Spätöffner sehen, wenn die Frist abgelaufen ist. Jedes Layout benötigt einen Zustand nach Ablauf – Tickvio übernimmt das automatisch.
Outlook-sicheres erstes Frame. Outlook Desktop zeigt nur das erste Frame animierter GIFs an. Gestalten Sie Ihren Timer so, dass das erste Frame den Fristtext klar anzeigt. In unserem Leitfaden zur Posteingangs-Unterstützung finden Sie die vollständige Kompatibilitätsmatrix.
Loslegen
Erstellen Sie einen kostenlosen Countdown-Timer und testen Sie ihn in einem dieser Layouts – ohne Kreditkarte. Passen Sie das Design an Ihre Marke an, konfigurieren Sie den Ablaufzustand und binden Sie ihn in Ihre E-Mail-Vorlage ein. Funktioniert mit Klaviyo, Mailchimp, ActiveCampaign, HubSpot und über 50 weiteren ESPs.