3 ½ Werbe-Kniffe für die sofortige Bildanzeige im E-Mail-Posteingang

René Kulka
Autor René Kulka
Datum 29.07.2011
Medienart Beitrag
Kategorie(n) Gestaltung
Tags

Aus Datenschutzgründen werden extern referenzierte Bilder, also solche, die im Internet von einem Server geladen werden müssen, in E-Mails oft standardmäßig vom Mail User Agent unterdrückt. Der Benutzer muss das Nachladen somit erst per Klick auf „Bilder laden“ anfordern. Andernfalls könnten Spammer anhand des registrierten Hits auf dem Server sehr einfach nachvollziehen, welche E-Mail-Adressen aktiv sind. Für seriöse Werbeversender ist die Einschränkung allerdings ein Ärgernis. Schließlich sind Bilder oft das Mittel der Wahl, um in kürzester Zeit Wiedererkennung, Aufmerksamkeit sowie ein erstes Interesse zu erzeugen. Um die Klippen der Bildblockade umschiffen zu können, sollten professionellen E-Mail-Marketing-Managern die folgenden drei Ansätze bekannt sein.

1. „Bilder von diesem Absender immer anzeigen“ bewerben:

Bitten Sie Ihre Adressaten, in ihrem E-Mail-Programm die Option „Bilder von diesem Absender immer anzeigen“ auszuwählen. Im Ergebnis werden künftige E-Mails als vertrauenswürdig eingestuft und externe Grafiken stets unmittelbar angezeigt. (Eine ähnliche Wirkung zeigt sich mitunter, wenn der Absender zum Adressbuch hinzugefügt wird oder eine gewisse Antwort-Zahl registriert wird – vgl. z. B. Gmail-Blog.)

Nachteil der Variante: Es ist eine Nutzeraktion erforderlich. Und diese muss beworben werden. Etwa im Preheader, wo sich meist der Links zur Onlineversion des Newsletters befindet. Oder prominenter durch einen Fullsize-Banner oder Ähnliches. Ggf. verlangen die Adressaten ebenso, dass die Funktion erklärt wird: „Warum soll ich dies tun, also wo ist mein Nutzen, und wie bewerkstellige ich das in meinem E-Mail-Programm?“

Untenstehend exemplarisch die entsprechende Option in Thunderbird, Googlemail und Hotmail:

2.1 „Embedded Images“ / Offline-HTML versenden:

„Embedded Images“ sind Bilder, die in den versandten E-Mails als Anhang eingebunden sind. Da Datenschutzprobleme nur bei Bildern auf Webservern bestehen, werden vermeintlich „ungefährliche“ Attachment-Grafiken meist direkt angezeigt. Da zur Anzeige auch keine Internetbindung mehr nötig ist, die Grafiken wurden ja lokal gespeichert, findet sich die Variante auch unter dem Stichwort “Offline-HTML”.

 

Wie funktioniert die Implementierung technisch? Vereinfacht: Die mitzuschickenden Bilder werden zunächst a.) Base64-enkodiert, also quasi aus ihrem Binär- in ein Textformat überführt, das per E-Mail übertragen werden kann. Dann b.) mit einer Content-ID („cid“) versehen und anschließend c.) der E-Mail als MIME-Teil angehängt. Anhand der eindeutigen cid kann der Anhang im E-Mail-Inhalt „normal“ referenziert werden. Hierzu wird das übliche HTML-Image-Tag („IMG“) im Attribut für die Bildquelle („SRC=“) mit der Content-ID versehen, anstelle der sonstigen URL zum Bild auf dem Webserver. Bei CSS (z. B. „background:url(…)“) gilt dies analog.

 

Bewertung: Mit wenigen Ausnahmen (z. B. bei Yahoo! Mail und Hotmail bleibt die Bildblockade unverständlicherweise bestehen) funktioniert dies recht zufriedenstellend. Nachteilig kann sich allerdings das gestiegene Gewicht der E-Mails auswirken. Dieser Effekt kann je nach Anzahl, Größe und Kompression der eingebetteten Grafiken erheblich sein. Die Download-Zeit für eine E-Mail steigt für den Adressaten, was besonders beim Laden auf mobilen Endgeräten zum Ärgernis werden kann. Sowohl in Bezug auf Zeitaufwand, Speicherplatz als auch Geld bei volumenabhängigen Tarifen. Schließlich wird das Herunterladen nun aufgezwungen. Und die meisten mögen eine Einschränkung ihrer Wahlfreiheit ganz und gar nicht. Von einer generellen Ablehnung gegenüber E-Mail-Anhängen (die Bilder werden in Outlook & Co als solche angezeigt) und einem unliebsamen Traffic-Anstieg bei den Webmailern, wie AOL oder Yahoo!, ganz abgesehen (Stichwort „Zustellbarkeit“).

 

Dennoch sollte man eingebettete Grafiken nicht verteufeln. Ganz im Gegenteil. Die Variante bietet sich eben primär für die Direktanzeige ausgewählte Schlüssel-Grafiken, wie z. B. das Absenderlogo oder die Handlungsaufforderung (etwa in einer grafischen Double Opt-in-E-Mail) an. In jedem Fall sollten alle eingebetteten Bilder anhand von Maße und Kompression im Hinblick auf ihr Gewicht immer noch einmal (nach-)optimiert werden. Nicht zuletzt, da der Base64-kodierte Text teils auch noch einmal deutlich größer ist, als die ursprüngliche binäre Grafikdatei auf der Festplatte. Ein Kontrollblick auf das E-Mail-Gewicht ist immer ratsam…

Anbei 1.) ein Beispiel eines optivo Newsletters ohne und mit eingebetteter Logo-Grafik in meinem Kerio-Webmail-Vorschaufenster. Das angehängte Logo wiegt als GIF-Grafik gerade mal ein Kilobyte, als fast „nichts“, wird aber auch bei Bildunterdrückung direkt angezeigt und unterstützt so effektiver das Branding. Und 2.) ein Beispiel eines Newsletters des Hightext Verlages, der seit jeher erfolgreich komplett mit eingebetteten Bildern ausgeliefert wird – mit Ausnahme des Öffnungspixels, daher der „Bild laden?“-Hinweis in Outlook (siehe vorangegangener Beitrag).

2.2 „Inline-Images“ nutzen

Alternativ zu 2.1 ist es auch möglich, den Base64-enkodierten Grafik-Text per Hand einzufügen. Und zwar im HTML-Quelltext direkt an Ort und Stelle. „inline“ als URL im Image-Tag. Daher die Bezeichnung „Inline Images“. Die Grafiken sind damit zwar wie bei 2.1 ebenso in die E-Mail eingebettet, allerdings nicht als formaler MIME-Part/Anhang.

 

Tools zur Base64-Kodierung existieren zuhauf, siehe Google-Suche, dies kann also jeder Versender sofort händisch ausprobieren. Die Syntax für derartige Daten-URLs lautet

  • data:MEDIENTYP;base64,DATEN

Also in HTML bspw.

  • <img src=“data:image/gif;base64,AAOALMAA…“>

Wobei „AAOALMAA…“ dem Base64-Text der GIF-Grafik entspricht.

 

Doch Vorsicht. Diese Variante ist vor allem aufgrund der vergleichsweise geringen Unterstützung seitens der E-Mail-Programme nicht guten Gewissens zu empfehlen. Googlemail oder Outlook 2010 beispielsweise verweigern die Darstellung gänzlich. Auch falls einzelne Grafiken wiederverwendet werden, denken Sie an einen grafischen IMG-Aufzählungspunkt, ist die Einbindung auf diese Weise unwirtschaftlich. Denn hierzu muss mehrmals der Base64-Code inline eingefügt werden, was den HTML-Quelltext und damit das E-Mail-Gewicht aufbläht. Ergo: Keine befriedigende Option. Bestenfalls noch zum Experimentieren, falls die Variante „embedded images“ bzw. „Offline-HTML“ (2.1) in der Versandsoftware nicht zur Verfügung steht.

 

Ein Beispiel, bei dem das optivo-Logo inline als Daten-URL eingebunden wurde (links Ansicht im Thunderbird, rechts der zugehörige HTML-Quelltext):

3. Bilder in feingranulare HTML-Tabellen konvertieren

Eine dritte, noch recht unbekannte Möglichkeit, die Bildunterdrückung zu umgehen, besteht darin, Grafiken als HTML-Tabellen zu rastern. Die Idee: Jeder Bildpunkt kann ja theoretisch durch eine farbige Tabellenzelle repräsentiert werden. Und Tabellen werden ohne Weiteres in E-Mails sofort angezeigt.

 

Zur Umsetzung existieren glücklicherweise passende Werkzeuge. Wer sich für den Newsletter der amerikanischen E-Mail-Agentur STYLECampaign anmeldet, erhält als Dankeschön einen Link zum kostenfreien „Image to HTML Converter for Email“.  Einen Vorab-Eindruck bieten ein YouTube-Video sowie Anwendungsbeispielen im STYLECampaign-Blog. In a nutshell: Einfach 1.) die gewünschte Bitmap(BMP)-Grafik per Drag&Drop umwandeln. Dann 2.) die HTML-Tabelle von <TABLE> bis </TABLE> kopieren und anstelle des IMG im Newsletter-Quelltext einfügen. Fertig!

 

Ergebnis: Und tatsächlich lässt sich hiermit sogar die Bildunterdrückung bei Hotmail und Yahoo! Mail aushebeln, wo Variante 2.1 ja scheiterte! Anna Yeaman bestätigt, dass die erzeugten Tabellen nahezu flächendeckend bei allen E-Mail-Rezipienten funktionieren – mit Ausnahme der Nutzer von Lotus Notes 6.5 und 7. Doch wer gedanklich nun schon fleißig konvertiert, hat sich evtl. zu früh gefreut. Die Nachteile: Zum einen steigt das E-Mail-Gewicht mit Bild-Tabellen exorbitant. Musste der Nutzer für das als Grafik eingebettete optivo-Logo nur knapp ein Kilobyte Datenvolumen spendieren, ist es bei der Tabellen-Variante das Hundertfache – ca. 110 KB! Also ein hoher Preis für die unmittelbare Bild-Darstellung. Auch können derart eingebundene Grafiken nicht mehr verlinkt werden. Für grafische Handlungsaufforderungen erscheint die Methode damit gänzlich ungeeignet. Schließlich kommt hinzu, dass Googlemail und Yahoo! Mail ab einem HTML-Quelltext-Gewicht von circa 100 Kilobyte zunächst nur einen Ausschnitt der E-Mail anzeigen; den Rest muss der Nutzer wiederum per Mausklick anfordern – wie bei „Bilder laden“. Hotmail (gut), Yahoo! Mail und Gmail (schlecht) in Bildern:

 

Ergo: Für kleinere Logos, Piktogramme oder Überraschungs-Bilder im „C64-Stil“ mit großflächigen unifarbenen Blöcken scheinen Bild-Tabellen durchaus einen Test wert zu sein. Alles andere will wohl überlegt sein. Sehr interessant war in diesem Zusammenhang das gestrige Beispiel des Pizza Express Newsletters (links bei deaktivierten Bildern, rechts mit Grafiken), vorgestellt von Becs Rivett:

(via Becs’s Posterous)

Nachtrag, 9.1.12:

(ebenfalls via Bec’s Posterous)

Weitere Beiträge

Keine Kommentare

Mein Kommentar

Pflichtfelder sind mit * gekennzeichnet.



Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


Service Navigation
030-76 80 78 0Rückruf
info@optivo.deE-Mail