Newsletter und Systemmails
Der monatliche Optocycle-Newsletter und zwei Vorlagen für wiederkehrende Kundenmails. Konzept, Redaktion, Gestaltung und das E-Mail-HTML von mir — von Hand, ohne Baukasten.
E-Mail ist die unangenehmste Disziplin im digitalen Gestalten. Es gibt kein einheitliches Rendering, kein verlässliches CSS und keine Vorschau, die die Wahrheit sagt. Die Arbeit besteht deshalb zu einem guten Teil darin, auf Möglichkeiten zu verzichten, die technisch da wären.
Schrift im Original: Space Grotesk, Ziffern tabellarisch.
Diese Arbeiten sind im Rahmen meiner Anstellung bei der Optocycle GmbH entstanden; die Rechte liegen beim Unternehmen. Gezeigt wird ausschließlich Material, das bereits veröffentlicht wurde oder für die Veröffentlichung bestimmt war. Zu internen Zahlen, Abläufen, Verträgen und nicht veröffentlichten Entwürfen mache ich keine Angaben.
Personenbezogene Daten Dritter habe ich, wo sie nicht ohnehin öffentlich sind, aus den Abbildungen entfernt. Wer eine Abbildung hier nicht sehen möchte, schreibt mir kurz — dann ist sie weg.
Ein Newsletter, der von null anfängt
Vor dem ersten Versand gab es keinen Verteiler, keine Vorlage und kein Format. Es gab die Absicht, monatlich etwas zu schicken, und die Erfahrung, dass genau solche Absichten nach der dritten Ausgabe einschlafen. Die Aufgabe war deshalb nicht ein schöner Newsletter, sondern ein Newsletter, der sich Monat für Monat mit vertretbarem Aufwand füllen lässt.
Daraus wurde eine feste Kapitelfolge, die jeden Monat gleich bleibt: Editorial, Kunden-Insights, Produkt-Updates, Feedback und Support, Spotlight, Abschluss. Wer die Ausgabe zusammenstellt, muss nicht überlegen, was hineingehört, sondern nur, was diesen Monat in welche Rubrik passt. Das ist der Unterschied zwischen einem Format und einer Einzelanstrengung.
Das Editorial ist dabei die einzige Rubrik ohne festes Muster und die wichtigste. Es beginnt nicht mit einer Neuigkeit, sondern mit einer Beobachtung, die auch selbstkritisch sein darf — in der Juni-Ausgabe zum Beispiel damit, dass Startups gern die Raumschiff-Version eines Produkts bauen, während der Kunde etwas ganz anderes braucht.
Von Hand gebautes E-Mail-HTML
Warum nicht der Baukasten des Versanddienstes? Weil man dort genau die Kontrolle verliert, die in E-Mail den Unterschied macht.
- Tabellenlayout statt Flexbox. Der Aufbau ist eine verschachtelte Tabellenstruktur mit fester Container-Breite und einer Umbruchklasse, die Zweispalter unter 620 px zu Einspaltern stapelt.
- Alle Stile inline. Jede Farbe, jede Größe, jeder Abstand steht am Element. Der Stylesheet-Block im Kopf ist nur eine Absicherung für Clients, die ihn respektieren — verlassen kann man sich nicht darauf.
- Outlook getrennt behandelt. Bedingte Kommentare setzen für Outlook eine eigene Rahmentabelle und feste Pixelwerte, weil die Word-Rendering-Engine dort Prozentbreiten und Zeilenhöhen anders auslegt.
- Schriften mit ehrlichem Fallback. Die Hausschrift wird geladen, die Fallback-Kette ist aber so gewählt, dass die Mail auch mit Systemschrift ihre Proportionen behält. In Outlook wird sie nie ankommen — das ist eingeplant, kein Unfall.
- Silbentrennung eingeschaltet. Deutsche Komposita in schmalen Spalten reißen sonst hässliche Löcher. Ein Detail, das erst auffällt, wenn man die Mail auf einem Telefon liest.
- Schaltflächen als Tabellenzelle. Kein
<button>, sondern eine Zelle mit Hintergrundfarbe und Innenabstand, damit die ganze Fläche klickbar bleibt und nicht nur der Text.
Der Aufwand dafür ist einmalig. Die Vorlage steht, jede folgende Ausgabe füllt nur noch Text und Bilder ein. Genau deshalb war es die richtige Entscheidung: Ein Baukasten hätte den ersten Versand beschleunigt und jeden weiteren verlangsamt.
Juni und Juli 2026
Beide Ausgaben in voller Länge. Im Fenster scrollen, Klick vergrößert. Einzelne Bilder liegen auf dem Server des Versanddienstes und sind inzwischen nicht mehr abrufbar — an diesen Stellen fehlt eine Abbildung, das Layout ist unverändert.
Zwei Mails, die immer wieder rausgehen
Neben dem Newsletter zwei Vorlagen für wiederkehrende Kundenkommunikation. Beide haben eine Aufgabe, die der Newsletter nicht hat: Sie müssen zu einer Handlung führen.
Drei Wege, klar getrennt
Kunden schrieben ihre Anliegen bisher dorthin, wo sie zuerst eine Adresse fanden — mit dem Ergebnis, dass Anfragen im falschen Team landeten. Die Mail sortiert das: Probleme an einer einzelnen Aufnahme über die Meldefunktion im Dashboard, technische Störungen an die Support-Adresse, Funktionswünsche an die Feedback-Adresse.
Jeder Weg bekommt denselben Aufbau: Überschrift, ein Satz zur Zuständigkeit, typische Anwendungsfälle als Liste, eine Schaltfläche. Wer nur die Schaltflächen anschaut, wählt trotzdem richtig.
Eine Aufgabe, nichts daneben
Die Quartalsmail hat genau einen Zweck: Das Schutzglas der Kamera soll gereinigt werden. Also steht auch genau das drin, mit der Begründung, warum es die Analysegenauigkeit betrifft.
Die Versuchung bei so einer Mail ist, den Platz für Produktneuigkeiten mitzunehmen. Genau das habe ich gelassen — eine Mail mit einer Handlungsaufforderung verliert jede Wirkung, sobald eine zweite daneben steht.
Vier Dinge über E-Mail
Ein Format schlägt eine schöne Ausgabe
Meine erste Idee war ein Newsletter, der jeden Monat anders aussieht, weil das lebendiger wirkt. Beim zweiten Versand hätte das bereits zu viel Zeit gekostet. Die feste Rubrikenfolge ist der Grund, warum es eine dritte und vierte Ausgabe geben kann — und dafür gebe ich Abwechslung gern auf.
Einschränkungen zuerst lernen, nicht zuletzt
Ich habe mit einem Entwurf angefangen, der in E-Mail so nicht baubar war, und musste ihn zurückbauen. Inzwischen kenne ich die Grenzen — kein Flexbox, kein verlässliches Web-Font, keine Verläufe, auf die man sich stützen darf — und entwerfe von Anfang an innerhalb davon. Das ist keine Kapitulation, sondern spart einen ganzen Arbeitsgang.
Eine Mail, eine Handlung
Bei der Wartungserinnerung wollte ich zusätzlich Produktneuigkeiten unterbringen. Es war die richtige Entscheidung, das zu lassen. Ich prüfe transaktionale Mails inzwischen mit einer einzigen Frage: Was soll die Empfängerin nach dem Lesen tun? Gibt es zwei Antworten, ist es die falsche Mail.
Fremde Server sind kein Archiv
Dass Bilder, die im Versanddienst liegen, später fehlen, habe ich hier zum ersten Mal erlebt. Seitdem lege ich von jeder verschickten Mail eine eigene Sicherung mit allen Bildern an. Ein unspektakuläres Learning, aber eines, das sich sofort bezahlt hat — für diese Arbeitsprobe hier zum Beispiel.
Gestaltung, Redaktion und Code in einer Person
Weiter zu den anderen Arbeiten
Wie der Start dieses Newsletters auf LinkedIn angekündigt wurde — mit einem Kasten Bier als Einsatz.