Zustellbarkeit verbessern: HTML-E-Mails und -Newsletter für mobile Endgeräte optimieren

E-Mails werden mittlerweile vermehrt am Smartphone abgerufen, weshalb es wichtig ist, beim Versand von E-Mails und Newslettern auf eine korrekte Darstellung auf mobilen Geräten zu achten. 

Wenn Sie ein Mailing mit dem rapidmail Editor versenden, sorgt dieser automatisch für eine responsive Darstellung in den gängigen E-Mail-Programmen. Das heißt, Ihr Newsletter ist „mobile friendly” und wird automatisch an die entsprechende Bildschirmbreite des Smartphones bzw. Tablets Ihrer Empfänger angepasst. Basiert Ihr Mailing dagegen auf einer eigenen HTML-Datei, können wir eine korrekte Darstellung auf mobilen Geräten nicht gewährleisten. Dennoch möchten wir Ihnen anhand von einigen Tipps zeigen, wie Sie die mobile Darstellung Ihrer Mailings verbessern können.



1. Anteil der Öffnungen mit mobilen Endgeräten messen

Bevor Sie viel Arbeit investieren, um Ihr HTML-Mailing „mobilfreundlich” zu machen, sollten Sie in einem ersten Schritt messen, ob und wie viele Ihrer Empfänger den Newsletter tatsächlich mit einem mobilen Gerät öffnen. Mit rapidmail wird Ihnen das nach dem Versand automatisch in den generierten Statistiken angezeigt. So wissen Sie direkt, ob sich die Optimierung der mobilen Darstellung im Hinblick auf Ihre Empfänger tatsächlich lohnt.


2. Auf kurzen Betreff achten

Damit den Empfängern auch auf mobilen Geräten alle wichtigen Informationen aus dem Betreff angezeigt werden, ist es wichtig, die Betreffzeile möglichst kurz zu halten. Für Empfänger, die ihre E-Mails am Smartphone lesen, raten wir dazu, 35 Zeichen für den Betreff nicht zu überschreiten. So stellen Sie sicher, dass der Betreff bei allen E-Mail-Clients und auf allen Endgeräten vollständig angezeigt wird.

Um Ihren Betreff zu vervollständigen, können Sie den Preheader nutzen. Dieser wird bei vielen mobilen Endgeräten und E-Mail-Programmen direkt unter dem E-Mail-Betreff angezeigt. Auch hier gilt: Je kürzer, desto besser. Denn je länger Betreff und Preheader sind, desto mehr Platz nehmen sie auf dem kleineren mobilen Bildschirm ein. Dies führt ggf. dazu, dass wichtige Informationen in den Bereich der E-Mail geschoben werden, der nicht auf den ersten Blick sichtbar ist.


3. Passende Schriftgröße wählen

Damit Ihre Newsletter auch auf den kleineren Smartphone-Bildschirmen ohne Probleme gelesen werden können, sollten Sie die Schriftgröße auf 22px für Überschriften und mindestens 12px für den Fließtext einstellen. Um Ihren Abonnenten das Lesen zu erleichtern, sollten Sie außerdem einen Zeilenabstand von etwa 17px einhalten.


4. Newsletter antippbar machen

Für eine „mobilfreundliche” Darstellung Ihrer Newsletter sollten Sie darauf achten, dass Sie Ihren Empfängern eine einfache Touch-Navigation in der E-Mail ermöglichen. Das heißt, Ihre Leser sollten mit dem Finger problemlos auf alle Links und interaktiven Elemente tippen können, ohne dass sie dabei unbeabsichtigt einen anderen Link öffnen. Die sogenannte Touch-Area sollte dafür mindestens 38x38px betragen.

Möchten Sie eine Telefonnummer in Ihr Mailing einfügen, sollten Sie diese in jedem Fall als Text und nicht als Bild einfügen. Indem Sie die Zahlenfolge dann mit der entsprechenden Telefonnummer verlinken, kann diese bei manchen E-Mail-Clients sogar direkt am Mobiltelefon angewählt werden.


5. Kontrastreiche Farben wählen

Da E-Mails mit mobilen Endgeräten oftmals im Freien gelesen werden, sollten kontraststarke Farben im Mailing verwendet werden, damit die Inhalte gut erkennbar bleiben. Auch die Farbe der eingebauten Links sollte sich deutlich vom restlichen Fließtext unterscheiden, damit die Empfänger die Verlinkung sofort wahrnehmen.


6. Nicht zu viele Bilder einbauen

Vor allem wenn Ihre Empfänger mobile Daten nutzen, um ihre E-Mails abzurufen, ist es von Nachteil, wenn ein Newsletter zu viele Bilder enthält. Diese haben häufig eine sehr lange Ladezeit oder werden überhaupt nicht nachgeladen. Sie sollten sich in Ihrem Mailing daher auf wenige und kleine Bilder beschränken.

Für die Bilder, Call-to-Actions und Grafiken, die Sie in Ihr Mailing einbauen, sollten Sie jeweils einen Alternativ-Text festlegen, der die Abbildung zusammenfasst bzw. beschreibt. Dieser wird dann zumindest trotzdem in der E-Mail angezeigt, auch wenn das entsprechende Bild nicht dargestellt wird.


7. Inhalte einspaltig anzeigen lassen

Damit Ihre Empfänger am Smartphone-Screen nicht ständig nach links und rechts scrollen müssen, raten wir dazu, auf ein mehrspaltiges Layout zu verzichten bzw. die Spalten auf mobilen Endgeräten untereinander anzeigen zu lassen.


8. Darstellung vor Versand testen

Bevor Sie Ihr Mailing versenden, das auf eigenem HTML basiert, sollten sie gut prüfen, ob die E-Mail auf mobilen Geräten tatsächlich korrekt angezeigt wird. Je nach E-Mail-Programm, Endgerät und genutzter App kann die Darstellung sehr unterschiedlich ausfallen. Mit rapidmail können Sie hierfür u. a. den Darstellungstest, die Vorschau sowie den Versand von Testmails nutzen.


Ähnliche Artikel