7 Design-Tipps für den Aufbau erfolgreicher E-Mails im Jahr 2016

Als E-Mail-Designer ist es Ihre Aufgabe, Abonnenten ein funktionierendes E-Mail-Erlebnis zu bieten. Dies bedeutet, dass Reibungen beseitigt werden, die das Abonnentenerlebnis untergraben und letztendlich Ihrem Markenimage schaden können.

Das Erreichen dieses Ziels wird durch die Tatsache erschwert, dass sich E-Mail ständig weiterentwickelt. Es ist wichtig, über die neuesten Updates in der E-Mail-Welt auf dem Laufenden zu bleiben, insbesondere wenn sich diese Änderungen – wie neue Apps und Aktualisierungen der HTML- und CSS-Unterstützung – auf Ihre sorgfältig gestalteten Kampagnen auswirken können.

Im State of Email Report 2016 fassen wir alles zusammen, was im letzten Jahr in der E-Mail-Welt passiert ist, und helfen dabei, wichtige Innovationen zu identifizieren, die große Auswirkungen auf Ihre E-Mail-Kampagnen haben können.

Holen Sie sich Ihren kostenlosen Bericht →

Hier ist ein kleiner Vorgeschmack auf das, was Sie im Inneren finden:

1. BEHALTEN SIE DIE APPLE UHR IM AUGE

Im April 2015 wurde die Apple Watch auf den Markt gebracht. Die Aufnahme von Wearables in die E-Mail-App-Flotte war unvermeidlich – und hat einige wichtige Auswirkungen für E-Mail-Designer. Wenn Ihr Publikum technische Early Adopters und potenzielle Watch-Nutzer umfasst, sollten Sie die Abonnentenerfahrung auf der Watch berücksichtigen.

Da die Apple Watch Klartext anzeigt, wenn entfernte oder verknüpfte Bilder erkannt werden, ist es wichtig, die Klartextversion Ihrer E-Mails zu optimieren. Beachten Sie auch, dass Sonderzeichen, zusätzliche Leerzeichen und andere Formatierungstricks, die für die Verwendung von Desktop-Klartext reserviert sind, sehr schlecht auf den kleinen Bildschirm der Watch übertragen werden.

Es gibt auch eine erweiterte Option, um Ihrer Nachricht einen dritten Teil hinzuzufügen: text/watch-html. Indem Sie diesen zusätzlichen Teil einschließen und den Inhaltstyp als „text/watch-html“ angeben, zeigt die Watch den Text/Watch-Teil anstelle des Klartextteils an, wenn der HTML-Teil nicht geeignet ist. Erkundigen Sie sich jedoch unbedingt bei Ihrem ESP, bevor Sie den Watch-Teil hinzufügen – nicht jeder unterstützt ihn.

2. OPTIMIEREN FÜR BILDBLOCKIEREN

Outlook 2016 und die Alto Mail-App von AOL wurden beide im Jahr 2015 eingeführt – und blockieren standardmäßig Bilder. E-Mail-Designer sollten defensive Designtechniken wie ALT-Text, kugelsichere Schaltflächen und ein ausgewogenes Verhältnis von Bildern und HTML-Text verwenden, um Bildblockierungen zu bekämpfen.

3. VERBINDEN SIE IHREN LINK ZUM ABNEHMEN NICHT

Im September 2015 führte Gmail eine neue Blockierungsfunktion für alle Gmail-Webmail- und Android Gmail-App-Benutzer ein, die Verbrauchern eine weitere Möglichkeit bietet, ihre Posteingänge von unerwünschten E-Mails zu befreien. Wenn ein Abonnent einen Absender „blockiert“, bedeutet dies, dass er nie wieder eine E-Mail von diesem Absender sehen wird.

Der Vorteil ist, dass die neue Option "Blockieren" Spam-Beschwerden reduzieren sollte, da einige Abonnenten, die zuvor auf "Spam melden" geklickt haben, jetzt stattdessen auf "Blockieren" klicken. Der Nachteil ist, dass die Schaltfläche "Blockieren" möglicherweise eine neue, untere Leiste für die ISP-Intervention erstellt hat, sodass einige Abonnenten, die zuvor möglicherweise auf "Abmelden" geklickt haben, jetzt stattdessen auf "Blockieren" klicken.

Was sollten Sie also tun? Machen Sie es sich einfacher, sich abzumelden. Wenn Abonnenten Ihren Abmeldelink nicht leicht erkennen können, blockieren einige Ihre Nachricht einfach oder markieren sie als Spam. Wenn Ihr Abmeldelink in kleiner grauer Schrift versteckt ist, ist es an der Zeit, ihn in einer eigenen Zeile mit größerem, leichter lesbarem Text zu unterteilen.

Fügen Sie außerdem den Header „list-unsubscribe“ hinzu und Gmail platziert unter Umständen einen „Abbestellen“-Link nach Ihrem Absendernamen und Ihrer Absender-E-Mail-Adresse.

Während dieser Link es Abonnenten ermöglicht, Ihren Opt-out-Prozess zu überspringen – einschließlich des Präferenzcenters, falls Sie eines verwenden – ist es dennoch vorzuziehen, eine Sperr- oder Spam-Beschwerde zu erhalten.

4. AKTUALISIEREN SIE IHRE INTERAKTIVEN E-MAILS

Im September 2015 veröffentlichte Apple die neueste Version seines mobilen Betriebssystems, iOS 9. Dieses aktualisierte Betriebssystem unterstützte einige neue CSS-Eigenschaften – und führte einige Änderungen ein, die E-Mail-Designer frustrieren werden.

Eine solche Frustration? Die allgemeine Geschwisterauswahl (~) wird nicht immer unterstützt. Die Mitglieder der Litmus-Community, Remi Parmentier und Justin Khoo, berichteten beide, dass der allgemeine Geschwisterselektor ~ unter iOS 9 nicht unterstützt wird, wenn er mit den Pseudoklassenselektoren :hover oder :checked verwendet wird.

Viele interaktive E-Mails verwenden Pseudoklassen, um zu überprüfen, ob in einer E-Mail etwas passiert ist oder nicht, und stylen Elemente je nach Zustand entsprechend. Dieser Fehler führt jedoch dazu, dass früher interaktive E-Mails statisch sind.

Zum Glück gibt es eine Lösung! Ersetzen Sie einfach den allgemeinen Geschwisterselektor ~ durch den benachbarten Geschwisterselektor +. Obwohl er nicht so flexibel ist wie der weniger spezifische allgemeine Geschwisterselektor, erzielt er die gleichen Ergebnisse.

5. VERWENDEN SIE TABELLENBASIERTE LAYOUTS

Im September 2015 hat Microsoft die neueste Version ihres Outlook-Clients veröffentlicht – Outlook 2016. Leider hat sie sich gegenüber ihren Vorgängern nicht viel geändert. Wie Outlook 2007, 2010 und 2013 rendert Outlook 2016 E-Mails mit Microsoft Word, das eine schlechte Unterstützung für HTML und CSS bietet und eine Menge frustrierender Macken aufweist.

Neuere Versionen von Outlook (2007-2016) bieten eine schlechte Unterstützung für HTML und CSS und beinhalten eine Reihe von Eigenheiten, die Sie beachten sollten:

• Keine Unterstützung für Hintergrundbilder in Divs und Tabellenzellen
• Keine Unterstützung für CSS float oder position
• Keine Unterstützung für Textschatten
• Schlechte Unterstützung für Padding und Margin
• Schlechte Unterstützung für CSS-Breite und -Höhe
• Probleme mit den Hintergrundfarben verschachtelter Elemente

Aufgrund der fehlenden Unterstützung vieler CSS-Eigenschaften sind tabellenbasierte Layouts eine Notwendigkeit für die Optimierung in Outlook 2016. Sie können auch bedingtes CSS verwenden, um gezielt auf Outlook 2016 abzuzielen.

6. VERWENDEN SIE MOBILFREUNDLICHE ELEMENTE

Da 55 % der E-Mail-Öffnungen auf Mobilgeräten erfolgen, ist eine mobile E-Mail-Strategie wichtiger denn je. Während die Verwendung von Responsive Design eine großartige Option ist, müssen Sie auch für Mobilgeräte optimierte Elemente verwenden, wenn Medienabfragen nicht unterstützt werden.

So unterstützen beispielsweise weder die Alto Mail-App von AOL noch die 2015 eingeführte Universal Outlook-App Medienabfragen.

Nutzen Sie großen Text, berührungsfreundliche Schaltflächen und ein einspaltiges Design, um Ihren Abonnenten das bestmögliche Erlebnis zu bieten.

7. VERWENDEN SIE OFFENE DATEN, UM ENTWURFSENTSCHEIDUNGEN ZU TREFFEN

Während der Blick auf branchenweite E-Mail-Öffnungstrends ein guter Indikator für die Akzeptanz bestimmter E-Mail-Clients ist, ist Ihre Zielgruppe entscheidend. Es ist wichtiger denn je zu sehen, wo Ihre Zielgruppe ihre E-Mails öffnet, und Ihre Designs entsprechend anzupassen.

Zum Beispiel haben wir 2015 einen Anstieg der iPhone-Öffnungen um 22 % verzeichnet, was jetzt 33 % der gesamten E-Mail-Öffnungen ausmacht. Wenn Sie etwas Ähnliches bei Ihrem eigenen Publikum sehen, können Sie diese Daten verwenden, um Ihre Designentscheidungen zu treffen. Wir wissen, dass iOS, das Betriebssystem des iPhones, hervorragende HTML- und CSS-Unterstützung bietet, sodass Sie fortgeschrittene Techniken wie HTML5-Videohintergründe in unseren Kampagnen sicher verwenden können.

Der Schlüssel ist, Ihr Publikum zu verstehen. Mit Email Analytics erhalten Sie die Daten, die Sie zur Optimierung Ihrer Designs benötigen. Melden Sie sich noch heute für eine kostenlose Testversion an. Keine Kreditkarte benötigt.

DEN E-MAIL-BERICHT 2016 ERHALTEN

Möchten Sie noch mehr Informationen und umsetzbare Erkenntnisse? Informieren Sie sich über die neuesten E-Mail-Updates und Fortschritte, indem Sie noch heute den kostenlosen Bericht herunterladen.

Holen Sie sich den Status-of-E-Mail-Bericht 2016 →