Glühbirnen Reihe

Was ist Responsive E-Mail-Design?

Laut Studien werden rund 40 % der Newsletter unterwegs und somit über mobile Endgeräte geöffnet. Oftmals werden E-Mails aber über den stationären PC anders dargestellt, als über Smartphones und Tablets. Bilder können auf mobilen Geräten beispielsweise oft nicht angezeigt werden oder die komplette Seite baut sich anders auf.

responsive Design im E-Mail-Marketing

Öffnung nach Endgerät

  • Desktop
  • Tablet
  • Mehrere Devices
  • Smartphone

Die Lösung hierfür lautet mobile-optimiertes Design, auch genannt Responsive E-Mail-Design!

Eine Herausforderung beim Responsive E-Mail-Design ist unter anderem, die E-Mails anzupassen, an die verschiedensten:

  • Displaygrößen
  • Bildformate
  • E-Mail Clients
  • Browser

Tipps zum Thema Responsive Design

Media Queries

Hierbei können eingebaute Media Queries helfen. Unter Media Queries versteht man CSS3-Befehle, die abrufen können, über welches Endgerät Ihre E-Mail empfangen wird. Ihre Newsletter und sonstigen Mails werden dann an das jeweilige Gerät angepasst. Eine Anpassung könnte zum Beispiel die Veränderung des Layouts an die Bildschirmbreite sein oder aber die Umwandlung von mehrspaltigen Mailings in eine einspaltige Ansicht.

Auflösung

Auch die Auflösung der E-Mail sollte beachtet werden. Die gängige Maximalbreite für ein Mailing liegt bei circa 600 Pixel. Die meisten Tablets und Smartphones können diese Auflösung problemlos darstellen. Andere wiederum können beispielsweise nur 400 Pixel auflösen. Falls Ihr Mailing dann jedoch 600 Pixel beträgt, wird es an den Seiten unschön abgeschnitten und der User muss von Seite zu Seite scrollen. Dies soll vermieden werden, um eine möglichst einfache und übersichtliche Ansicht zu schaffen.

Kontrastreiche Farben

Um es dem User noch einfacher zu machen, sollten Sie außerdem darauf achten, dass Sie in Ihrem Mailing kontrastreiche Farben verwenden. Wenn der User von unterwegs seine E-Mails abruft, sind die Lichtverhältnisse oft nicht optimal. Kontrastreiche Farben helfen dabei, den Text und die Bilder besser sehen zu können.

Eingebaute Links

Des Weiteren müssen eingebaute Links gut aufrufbar sein. Sie sollten also in Form eines fingergroßen Buttons dargestellt werden. Bauen Sie außerdem Servicenummern in Ihre E-Mail ein, damit der Empfänger falls er Hilfe braucht, sofort mit seinem Smartphone darauf zugreifen kann.

Alt-Tags

Beinhaltet Ihr Mailing Bilder, ist es außerdem empfehlenswert, sogenannte Alt-Tags dafür zu verwenden. Kann der Browser des Empfängers ein Bild nicht anzeigen, wird diesem trotzdem der Titel des Bildes oder der Grafik angezeigt. So weiß der Empfänger zumindest, was für ein Motiv ihm angezeigt werden sollte.

Kurz & aussagekräftig

Halten Sie Ihre Texte außerdem kurz und dafür aussagekräftig! Die meisten mobilen User lesen Ihre Mails unterwegs und haben oftmals nur wenige Minuten Zeit dafür. Die Kernaussage der E-Mail sollte dem Leser also in wenigen Sätzen näher gebracht werden. Haben Sie all diese Tipps beherzigt, testen Sie Ihr Mailing vorab auf möglichst vielen Endgeräten, um sicherzustellen, dass all Ihre Empfänger Ihre E-Mail optimal dargestellt empfangen können.

Newsletter

Bleiben Sie auf dem Laufenden! Unser Newsletter informiert Sie rund um das Thema E-Mail-Marketing.