Im Zeitalter der Mobilität mussten sich viele Online-Ressourcen verändern und an neue Bedingungen anpassen. Auch die E-Mail, eine der ältesten Formen der digitalen Informationsübermittlung, hat eine kleine Revolution erlebt. Bis dieser neueste Trend populär wurde, war es für einige wenige Desktop- und Webmail-Clients nur eine kleine Angelegenheit, Text- oder HTML-Nachrichten zu versenden. Jetzt ist das Handy die größte Zielgruppe. Wie soll man damit umgehen, dass man auf jedem Gerät und jedem Client gut aussehende E-Mails erhält?
Laut einer Statistik von Litmus, einem der bekanntesten Anbieter von E-Mail-Tests, sind mehr als die Hälfte der aktiven E-Mail-Clients weltweit mobil.
- Apple iPhone 34% +1,17
- Google Mail 15% -0.88
- Apple iPad 11% -0,07
- Google Android 10% -0,3
- Apple Mail 8% +0,25
- Ausblick 7% +0,02
- Yahoo! Mail 3% +0.01
- Ausblick.com 2% -0.11
- Windows Live Mail 1% -0,06
- Windows Mail 1% +0,42
Die Quelle mit den aktuellen Daten finden Sie hier.
Natürlich kann es in einer bestimmten Region Unterschiede geben, aber der Trend ist unbestreitbar. Die Menschen überprüfen ihre Postfächer hauptsächlich über mobile Geräte, während die Desktop-Mail-Clients immer seltener zum Einsatz kommen. Natürlich ist dies nicht einer dieser Artikel, in denen jemand den Tod des Desktops behauptet. Dem Desktop geht es gut und es wird ihm auf unabsehbare Zeit gut gehen. Und warum? Hauptsächlich, weil es immer noch eine großartige Möglichkeit ist, auf Unternehmensebene oder in vielen anderen Fällen zu kommunizieren, zum Beispiel über verschiedene Zeitzonen hinweg. Oder vielleicht liegt es einfach daran, dass eine E-Mail offizieller ist als beispielsweise ein Instant Messenger. Wenn Sie sich also fragen, ob wir uns immer noch um Desktop-E-Mail-Clients kümmern sollten, lautet die Antwort: Ja, wir müssen es.
Aber müssen wir E-Mails für Mobilgeräte anders gestalten als für den Desktop? Die meisten mobilen Clients sind in der Lage, Inhalte zu verkleinern und zu vergrößern, aber... Haben Sie schon einmal eine unleserliche E-Mail auf Ihrem mobilen Gerät erhalten? Ich schon und ich mag es nicht, überall hin zu scrollen, nur um nützliche Informationen zu finden oder etwas Wichtiges zu übersehen. Wahrscheinlich geht es vielen anderen Nutzern genauso, und wir als Softwareentwickler sollten jede Unannehmlichkeit in Kauf nehmen, um das beste Nutzererlebnis für unsere Produkte zu bieten und die Interaktion zwischen Mensch und Computer so reibungslos wie möglich zu gestalten.
Was ist wichtig?
Wenn Ihre E-Mails nur aus Text bestehen, müssen Sie sich natürlich nicht allzu viele Gedanken darüber machen. Aber früher oder später braucht jedes Unternehmen etwas mehr als einfachen Text mit einfacher Gestaltung. Und hier beginnt das Problem - es gibt so viele Unterschiede allein zwischen den Desktop-E-Mail-Clients, dass wir für diese Aufgabe bereits einen komplexen Ansatz benötigen. Er ist sogar allein für Microsoft Outlook erforderlich, weil sich die Versionen in Bezug auf die Rendering-Engines so stark unterscheiden; einige von ihnen basieren auf dem Internet Explorer, und ein paar andere verwenden die Microsoft Office Word-Engine. Wenn wir alle anderen wichtigen E-Mail-Clients auf dem Handy und dem Desktop berücksichtigen, wird die Liste der Einschränkungen und Anforderungen ziemlich lang. Um mit jedem Problem fertig zu werden, müssen wir uns an einfaches HTML und Inline-CSS halten. Wir können nicht auf ein standardmäßiges und beliebtes Box-Modell (div-Elemente) mit Floating und vielen anderen Funktionen zurückgreifen. Wir müssen in der Zeit zurückgehen und HTML-Tabellen wie auf den alten Webseiten verwenden. Textüberschriften und Absätze werden von vielen Kunden unterschiedlich behandelt, so dass die Semantik bei E-Mail-Vorlagen keine Priorität hat, wenn das Design an erster Stelle steht.
Bewährte Praktiken
Wir müssen nicht nur auf das HTML-Markup achten, um unsere E-Mail perfekt zu machen. Es gibt ein paar Richtlinien, die wir nicht ignorieren können. Einige der Regeln sind bereits in der Phase der Gestaltung einer Vorlage wichtig. Im Allgemeinen wird die Reaktionsfähigkeit von E-Mails durch die Vorbereitung von zwei verschiedenen Verhaltensweisen des Inhalts erreicht: fest für den Desktop und flüssig für kleine Geräte. Diese Methode wird als Hybridvorlage bezeichnet. Vor diesem Hintergrund muss unser Grafikdesigner wissen, dass wir den Hauptinhalt in einer Containerbreite von höchstens 600 Pixeln fixieren werden. Es gibt noch ein paar andere Tipps für Designer von E-Mail-Vorlagen:
- Vermeiden Sie Mails, die auf Bildern basieren
- Fügen Sie ALT-Attribute zu Bildern hinzu, um Inhalte bereitzustellen, wenn Grafiken blockiert werden oder nicht verfügbar sind.
- Wählen Sie die richtige maximale E-Mail-Breite (550-600px) und Schriftgröße (14px)
- Vereinfachen Sie das Design, wenn Sie können; eine E-Mail ist keine Website - sie hat mehr Einschränkungen
- Bleiben Sie bei einem hohen Verhältnis von Text zu Bild
- Link zum Abbestellen hinzufügen
- Führen Sie ein Reverse Engineering von beliebten und gut gemachten Vorlagen wie Cerberus durch.
Was den letzten Punkt betrifft, so haben sich bereits viele Entwickler mit E-Mail-Vorlagen herumgeschlagen. Sie haben viele nützliche Ressourcen entwickelt und mit anderen geteilt, so dass wir aus ihren Fehlern lernen und so den Prozess der Erstellung unserer eigenen Vorlage beschleunigen können.
Der zweite Teil unseres Artikels wird in Kürze erscheinen. Bleiben Sie dran!
Mehr aus dieser Serie
Unsere Ideen
Weitere Blogs
Contact