Als ich vor einigen Jahren (2002-2004) auf meiner Herr-der Ringe-Website noch einen Newsletter verschickt habe, war das eine noch vergleichsweise einfache Übung.
Früher, ja früher…
In einem Texteditor habe ich den Newsletter verfasst und ihn mit dem gestaltet und formatiert was einfacher Text (engl. plain text) hergibt: Mit Bindestrichen, Rauten und den Pluszeichen kann man z. B. Bereiche von einander trennen. Mit ein bisschen Mühe lässt sich so mit ganz einfachen Mitteln ein übersichtlicher Newsletter produzieren.
Anschließend habe ich dann eine Desktop-Software (Namen vergessen) mit dem Text gefüttert und auf Senden geklickt. Die Software war sehr schnell und zuverlässig. Nach wenigen Minuten war der Newsletter an 500+ Empfänger verschickt und zwar nicht als CC oder BCC sondern es wurde an jeden Empfänger eine E-Mail verschickt. In die Liste konnte sich jeder “eintragen”, der mir vorher eine E-Mail mit Bitte um Eintragung geschickt hat.
Aus der heutigen Sicht wirkt das alles primitiv. Aber es war zuverlässig, es war auch rechtlich sicher und der Newsletter sah in jedem Mail-Programm gleich aus. Was soll schon bei einem einfachen Text auch schief gehen.
… und heute?
Heute erwartet ein Großteil der Besucher einen HTML-Newsletter und die rechtliche Vorgabe erwartet einen Double-Opt-In und in jedem Schritt einen sichtbaren Abmelde-Link: und das nicht nur bei E-Mails sondern auch bei jedem der Anmelde-Schritte.
Nach dem man dann die rechtlichen Vorgaben erfüllt hat, wird man feststellen, dass man den schwierigsten Part noch vor sich hat. Auf dem Markt existieren eine Reihe von E-Mail-Programmen und jedes bietet einen unterschiedlichen Support für HTML und CSS. Und die Unterschiede sind gewaltig und zwar nicht nur zwischen den einzelnen Anbieter sondern auch zwischen den einzelnen Versionen der gleichen Firma.
Paradebeispiel ist der HTML-Support von Outlook 2000/2003 einerseits und zwischen Outlook 2007/2010 anderseits. Und zwar nicht wie man denken könnte Outlook 2007 kann mehr als Outlook 2003 … nein, umgekehrt. Outlook 2007 und 2010 bemühen Word bei der Darstellung von HTML-E-Mails.
Auf CampaignMonitor.com gibt es zwei interessante Links zu diesem Thema:
- CSS-Support in gängigen E-Mail-Programmen (das PDF ist noch umfangreicher)
- Div vs. Tabelle in HTML-Newslettern
Bevor ich mit den ersten Vorbereitungen für den WordPress-Newsletter angefangen habe, war mir durch Gespräche mit Kollegen durchaus klar, dass das stylen von HTML-Newslettern eine sehr komplizierte Aufgabe ist. Aber die Realität ist in diesem Fall viel grausamer. 🙂
Meine Empfehlung
Für den Anfang würde ich dir, falls du vor hast einen HTML-Newsletter zu versenden, einen der spezialisierten Dienste empfehlen. Ich habe mich für MailChimp entschieden und zwar aus zwei Gründen. Zum einen wurde es mir von mehreren Kollegen empfohlen und zum anderen ist der eigentlich kostenpflichtige Dienst für Newsletter mit kleinem Leserstamm kostenlos.
Für bis zu 12.000 E-Mails pro Monat oder für bis zu 2.000 Abonnenten ist der Dienst kostenlos. Somit könnte man rein theoretisch über MailChimp einen Newsletter an 1.999 Leser bis zu 6x im Monat schicken.
MailChimp bietet einige vorgefertigte Vorlagen und ich würde dir empfehlen zumindest am Anfang auf diese Vorlagen zurückzugreifen. Die sind in der Regel getestet worden. Am besten nimmst du eine sehr einfache Vorlage und passt sie leicht an deine Bedürfnisse an. Um auf Nummer sicher zu gehen schreibst du die CSS-Angaben inline an … also nicht im Dokumentkopf oder in einer externen Datei sondern im Starttag des jeweiligen Elements.
Verzichte auf Floats und Positionierungen, falls du wirklich Elemente neben einander anordnen möchtest, dann musst du leider auf Layouttabellen zurückgreifen. Sei sparsam mit äußeren Abständen und nutze lieber <br> oder <p> </p>. Falls das deiner Vorstellungskraft nutzt versetze dich einfach in das Jahr 1998 zurück. Ach ja und vergesse border="0" bei den Bildern nicht. 🙂
Eigentlich hatte ich ursprünglich nur vor die beiden Links zu CampaignMonitor zu posten. Und jetzt ist wieder ein langer Artikel daraus geworden. 🙂
Nachtrag: auf Creating HTML Emails : An Overview for Web Designers gibt es einen ausführlichen englischen Artikel zu diesem Thema.
Hinweis: im Artikel gibt es einen Partnerlink zu dem Dienst MailChimp. Wen sich jemand darüber registriert, dann bekomme ich u. U. ein Guthaben, was ich bei dem Dienst nutzen kann.
Wir arbeiten seit 20 Jahren mit WordPress und bieten diverse Dienstleistungen rund um das System an. Kontaktiere uns für weitere Informationen oder für ein Angebot.
Inwiefern kannst du sicherstellen, dass die E-Mailadressen der Abonnenten nicht über MailChimp weiterverkauft werden?
@Michael,
folgendes steht in der MailChimp Privacy Policy:
Aber ich kann leider keine Garantie abgeben. Auch wenn ich die beim mir auf dem Server hätte, hättest du keine Garantie, dass nicht evtl. mein Hoster oder ein Hacker der den Server gekapert hat die Daten weiter verkauft.
Gut, aber die Wahrscheinlichkeit, dass sie bei dir zuhause vom Rechner abgegriffen wird (sofern du ein Desktopprogramm verwendet) ist sicher ungleich niedriger, als wenn du sie in die Hände einer externen Firma legst.
Aber ok, das ist hier nicht das Thema. Ich wollte nur eine generelle Auskunft und bedanke mich bei dir.
@Reply,
Ich weiß nicht. Ich würde eher davon ausgehen, dass Firmen-Server die von geschulten Personal betreut werden sicherer sind als Daten auf einem privaten Rechner, wo noch mehrheitlich XP läuft und die Nutzer auf alles klicken was bei drei nicht auf dem Baum ist.
Das heisst, der Versand läuft über den Server von MailChimp … – hast Du eine Ahnung wie bei denen die Zusammenarbeit mit den großen Mail-Anbietern – gerade hierzulande – aussieht? Klugerweise läuft ein NL-Versand ja über einen Server, der auf der Whitelist bei web.de, t-online und so weiter steht, damit Du bei größeren Empfängerzahlen nicht gleich auf der Sperrliste landest, weil sie Dich für einen Spammer halten …
Von der Gestaltung her: Völlig daccord, es ist gruselig.
Ich baue NL-Templates gerne mit der Windows-Software SuperMailer, die hat eine Vorschaufunktion für die neuen Outlook-Katastrophen an Bord.
Hast du da einen Beleg dafür, irgendwelche Zahlen, oder ist das nur Hörensagen?
@Jeena,
ich habe mich im Vorfeld mit einigen Leuten unterhalten und der Tenor war: die meisten Leute bevorzugen, wenn sie wählen können, die HTML-Ausgabe. Deswegen schicke ich sowohl HTML als auch Text. Hier habe ich auf die Schnelle ein paar Aussagen gefunden, die das bestätigen. Hier ein paar Zitate:
Quelle: http://www.wordbiz.com/newsletter/htmlvstext.html
und
Quelle: http://www.freemarketingzone.com/email-marketing/text-vs-html.html
und hier etwas älteres aus 2003:
Quelle: http://www.marketingprofs.com/3/partner3.asp
Ich will mal eine Lanse für CampaignMonitor brechen. Klar, ihr free-Paket ist nicht so doll wie bei MailChimp. Aber nachdem ich wirkliche viele auf dem Markt frei zugängliche sowie auch “interne” Lösungen in den letzten Jahren testen konnte (und leider auch musste), bin ich am Ende bei CampaignMonitor gelandet. Der Grund: sie haben den weltbesten Editor um HTML-Mails zu produzieren. Dafür zahl ich gern, da ich am Ende Zeit spare und die Arbeit mit HTML-Mails mir mehr Lust als Frust bringt.
Also, ruhig mal testen und nicht gleich vom Preis abschrecken lassen 🙂
p.s.: Ach, und extrem gute free-themes gibts dort auch 😉
Meine Website ist noch sehr jung und weist auch (noch) nicht die Besucher- / Abonnentenzahlen auf, die ein Versenden eines Newsletter rechtfertigen würden.
Dennoch interessiert mich das Thema, da ich vielleicht eine kleine Werbe-Email an meine Freunde (!) senden möchte um etwasAufmerksamkeit zu bekommen. Ich weiß, das scheint sehr aufdringlich, doch wenn ich es gut anstelle, wird der “Newsletter” gut aufgenommen werden. Wenn keine Beschwerde kommt, bin schon zufrieden… 😉
Zum Thema: Generell habe ich noch keine Erfahrung beim Erstellen und Senden von Newslettern sammeln können. Daher sah ich mir auf ‘Themeforest.net’ Beispiele von HTML-Newsletter an und fand z.B. das Theme: ‘Versatile Newsletter 3 – automated layout creator!’ gut.
Meine Frage ist nun, wie ich es anstelle, solch ein Theme in Outlook 2011 verwenden zu können. Oder geht die Verwendung nur als Theme über WordPress und dessen Mail-Funktion?
Vielen Dank.
LG
Timm
[…] HTML-Newsletter in WordPress stylen. […]
Also über WordPress macht es ja in jedem Fall Sinn, weil du die Mailadressen dort alle in der Datenbank hast, zumindestens die der registrierten User. Um das über Outlook machen zu können, müsstest du die Adressen ja exportieren.
Gruß Martin
Ich verwende dieses Plugin und habe die rechtlichen Anforderungen erfüllt: http://www.glockeasymail.com/wordpress-email-newsletter-plugin-for-double-opt-in-subscription/.
[…] Simovic gibt auf seiner Website perun.net mal einen kurzen Überblick zum Thema HTML-Newsletter stylen und ein paar Tipps – beides […]
wie gehst Du mit Outlook > 2003 um? Da werden doch Bilder erstmal gar nicht geladen, sondern erst, wenn der Empfänger einmal der Mailadresse explizit erlaubt hat Bilder nachzuladen……
@Viktor,
da kann man imho nicht viel machen. Ich fülle immer brav das alt-Attribut aus und füge unter dem Bild in Klartext folgendes: “Bild: kurze Bildbeschreibung”.
habe ich befürchtet. Danke!
[…] habe vor ca. drei Wochen im Artikel HTML-Newsletter stylen ein paar Sätze zu diesem schwierigen Thema geschrieben. Das Thema ist leider sehr verworren und da […]
[…] habe in diesem Weblog schon an zwei Stellen zum Thema HTML-Newsletter geschrieben: HTML-Newsletter stylen und HTML-Newsletter stylen: drei Quellen. Hier folgen zwei weitere Quellen die sich mit dem Thema […]