Blog

Erstellen von responsiven E-Mail-Vorlagen Teil 3 - Testen

Aktualisiert Oktober 21, 2025
6 Minuten

In den vorangegangenen Teilen haben wir über die Bedeutung von responsiven E-Mail-Vorlagen gesprochen und wie man sie richtig erstellt. Jetzt ist es an der Zeit, dafür zu sorgen, dass sie wirklich auf allen gängigen Geräten und E-Mail-Clients funktionieren.

Das Testen ist eine der wichtigsten Phasen im Entwicklungsprozess von Vorlagen. Während des Entwicklungsprozesses kann eine Vorlage in jedem Webbrowser wie eine normale Seite angezeigt werden - aber das ist nicht genug, da E-Mail-Clients nur bestimmte CSS-Attribute unterstützen.

Um alle Unterschiede zwischen allen möglichen Software- und Hardwarekombinationen zu berücksichtigen, können wir Testdienste wie Litmus oder EmailOnAcid nutzen. Wir können die kostenlose Version von Litmus ausprobieren, die auf drei oder vier E-Mail-Clients beschränkt ist, oder eine kostenlose Testversion von EmailOnAcid mit einer Woche voller Funktionalität nutzen.

1

Einige Mailing-Dienstleister bieten uns auch die Möglichkeit, zu prüfen, wie unsere E-Mails auf einigen wenigen verfügbaren Clients aussehen. Die Funktionalität dieser Funktionen hängt in der Regel vom gewählten Tarif ab und kann im Allgemeinen nicht mit den zuvor erwähnten speziellen E-Mail-Testdiensten mithalten.

E-Mail-Tests sind nichts anderes als das Senden unserer E-Mail an einen Dienst, der sie auf jedem Gerät/jeder Konfiguration öffnet, das/die aus den verfügbaren Ressourcen ausgewählt wurde. Dann erhalten wir einen einfachen Screenshot mit visuellem Effekt. Wenn etwas nicht stimmt und Fehler gefunden werden, müssen wir in unserem Quellcode nach möglichen Fehlern suchen, sie beheben und erneut testen. Manchmal können wir den Debugging-Prozess verbessern, indem wir die HTML-Analyse des E-Mail-Dienstes testen, aber meistens sind die Fehler das Ergebnis der spezifischen HTML/CSS-Interpretation des E-Mail-Clients. Selbst wenn die Code-Analyse also sagt, dass alles in Ordnung ist, können wir immer noch visuelle Fehler finden, die behoben werden müssen, was in den meisten Fällen viele Korrekturen und wiederholte Tests erfordert, um die richtige Lösung zu finden. Ja, wahrscheinlich haben Sie die Schaltfläche "Diese E-Mail im Webbrowser öffnen" in Microsoft Outlook gesehen. Warum also sollte man eine E-Mail nicht dort debuggen? Weil nur wenige Outlook-Versionen auf der HTML-Rendering-Engine des Internet Explorer basieren. Die meisten basieren auf der Microsoft Word-Engine - wir müssen uns also auf lange und nicht ganz einfache Testsitzungen einstellen, bei denen viele Verbesserungen und Fehlerbehebungen vorgenommen werden.

SPAM-Tests

Natürlich geht es nicht nur um das Aussehen der E-Mail. Wir sollten auch testen, ob unsere mit einer Vorlage versendeten Nachrichten einen Anti-Spam-Filter passieren können. Wie wird das gemacht? Die Testdienste senden unsere E-Mail auf die gleiche Weise wie beim visuellen Test, aber die Vorlage wird auch von vielen verfügbaren SPAM-Filtern analysiert. Die beliebtesten sind Barracuda, SpamAssassin, Symantec Cloud, Google Apps. Einige von ihnen bestehen nur oder schlagen fehl, aber einige können uns mitteilen, warum unsere E-Mail als Junk-Mail erkannt wurde.

Um die Zustellbarkeit zu gewährleisten, sollten wir diese Regeln befolgen:

  • Halten Sie den Vorlagencode sauber
  • Vermeiden Sie Tippfehler und die Verwendung von zu vielen Großbuchstaben, Fragezeichen und Ausrufezeichen.
  • Verwenden Sie keine großen Bilder, teilen Sie sie in Teile auf, fügen Sie alternativen Text hinzu
  • Erinnern Sie sich an das Verhältnis von Bild zu Text
  • Achten Sie auf die Schlüsselwörter von Spam-Filtern
  • Vergessen Sie nicht den Link zum Abbestellen, wenn möglich. Es ist besser, Abonnenten zu verlieren, als auf eine schwarze Liste gesetzt zu werden.
  • Versuchen Sie, keine E-Mails zu versenden, die größer als 100 KB sind.

Gute Praktiken für Abonnements

Jede E-Mail sollte eine vollständige Signatur mit Kontaktdaten und Datenschutzbestimmungen enthalten. Wenn möglich, sollten Sie den Benutzern auch die Wahl lassen, welche Art von Nachrichten sie erhalten möchten und wie oft - nur um sicher zu gehen, dass jemand die Einstellungen ändern kann, anstatt unsere Mails als Spam zu markieren.

Nach positiven Testergebnissen können wir unsere Vorlage einsetzen und ihre Effizienz überwachen - so wie wir es bei normalen Webseiten tun. Es ist für jede Marketingabteilung eines Unternehmens sehr wichtig, die Konversionsrate von E-Mail-Kampagnen zu kennen .

Eckgehäuse

Auf die Ersteller von E-Mail-Vorlagen warten viele Fallen. Die meisten von ihnen sind bereits bekannt und beschrieben, aber die Anzahl und Vielfalt dieser Probleme ist enorm. Zum Beispiel kann Microsoft Outlook die Höhe der Textzeilen und die Mindesthöhe der Tabellenzellen ändern und viele andere Dinge unerwartet kaputt machen. Es gibt Artikel über Probleme für fast jeden E-Mail-Client. Viele Entwickler haben ihre Kämpfe mit diesen Problemen beschrieben, wie Łukasz Stasiak von Freshmail. Er war erstaunt über die Probleme, mit denen wir als Ersteller von E-Mail-Vorlagen zu kämpfen haben. Probleme können in Bereichen auftreten, in denen eigentlich nichts schief gehen sollte. Aber wenn ein E-Mail-Client auf einem Texteditor basiert (wie einige Versionen von Microsoft Outlook), kann eine Vorlage auf unerwartete Weise angezeigt werden. Apple tut dasselbe und ändert die Textformatierung von E-Mails - jedes Datum, jede Adresse oder Telefonnummer wird analysiert und dem Benutzer als Link und nicht als normaler Text angezeigt. GIF-Bilder werden in einigen Clients beim ersten Bild eingefroren, PNG-Bilder können mit Störungen angezeigt werden.

Zusammengefasst

Wir erhalten jeden Tag E-Mails und denken nicht einmal über den gesamten Prozess nach, der zum Erstellen und Versenden dieser Daten erforderlich ist. Wir werden vor allem dann darauf aufmerksam, wenn etwas nicht funktioniert. Zum Beispiel sind wichtige Informationen aus einer Buchungsbestätigung auf unserem mobilen Gerät nicht lesbar, auch wenn sie auf dem Desktop korrekt angezeigt werden. Oder wir lächeln, wenn eine unwichtige E-Mail aussieht, als wäre ein Tornado durch sie hindurchgefegt, und denken: "Dumme Leute, die können nicht einmal einfache E-Mails erstellen". Aber selbst eine einfache E-Mail-Vorlage richtig zu machen, erfordert Wissen, Tools und eine Menge Tests, die Zeit kosten und die Kosten für eine Vorlage verdoppeln können. Daher werden die Tests bei größeren Projekten eingesetzt und machen diese kostengünstiger, während viele einfache E-Mail-Vorlagen oft nur unzureichend getestet sind.

Um makellose und zuverlässige E-Mails zu erstellen, müssen wir die richtige Methodik anwenden. Dann können wir sicher sein, dass unsere E-Mails niemanden im Stich lassen - und sogar besser aussehen als viele andere und ihren Platz im Postfach eines jeden Benutzers einnehmen.

In den letzten Monaten, seit dieser Artikel geschrieben wurde, gab es in dieser Hinsicht eine bedeutende Änderung. Google Mail erlaubt jetzt eingebettetes CSS und unterstützt sogar Media Queries. Das ist eine gute Nachricht, denn sie vereinfacht den Prozess der Erstellung responsiver E-Mail-Vorlagen ein wenig und gibt uns mehr Möglichkeiten! Aber es gibt noch viele Dinge zu beachten, also halten Sie die Augen offen.

Mehr aus dieser Serie

Weitere Lektüre

Marktanteil von E-Mail-Clients Unterstützung von CSS-Attributen in E-Mail-Clients Eingebettete oder verlinkte Bilder in Emails? EmailOnAcid Blog Litmus Blog ZURB Foundation-Framework MJML-Framework auf der Grundlage von REACT

Contact

Let’s discuss how we can support your journey.