HowTo: HTML E-Mail-Signatur in Apple Mail erstellen

30. JULI 2017 27 KOMMENTARE

Mac Apple Mail HTML Signatur

Früher gab’s Visitenkarten, heute gibt es Signaturen:
Eine E-Mail-Signatur gehört zum guten Ton. Das würde niemand anzweifeln, der noch alle Zwetschgen beisammen hat.
Durch meine jahrelange Undercovertaktivität als E-Mail-Empfängerin ist es mir sogar möglich eine Liste mit den drei  häufigsten Signaturen zusammenzustellen:

  1. Eine Corporate Identity ist eine Corporate Identity .
  2. Ich bin frei von CI-Vorgaben. Ich könnte, wenn ich wollte oder wenn ich die Zeit hätte. Hab ich aber grad nicht. Solange haue ich ein Standardding raus. Besser als nix.
  3. Nichts.

Tja. Das haut mich jetzt nicht wirklich aus den Klotschen. So ehrlich wird man doch noch sein dürfen.HTML-Signaturen wecken das Interesse, steigern die Conversion-Rate und bleiben in Erinnerung! KLICK UM ZU TWEETEN

Dabei haben Signaturen ein, leider unterschätztes, Potential: Sie wecken das Interesse, dienen als Visitenkarte, steigern die Conversion Rate und bleiben in Erinnerung. Wenn man es richtig macht!

Apple Mail: HTML E-Mail-Signatur

»Heidiiiii? Hier haste ‘n schickes Design. Kannst du daraus ne HTML E-Mail-Signatur machen? Bitte?«, knick knack. Ich sag’s euch mit gewissem Stolz im Herzen: Ich war quasi unersetzlich. Ich war die Godmasterin der E-Mail-Signaturen! Natürlich habe ich an der Stelle auch gerne heraushängen lassen, dass es Apple Mail einem nicht gerade einfach macht. Intuition? Fehlanzeige?

But first: HTML

Bevor es nun ans Eingemachte geht, schreiben wir mit einem Texteditor ein paar Zeilen abgespecktes HTML.
Wenn ihr damit noch keine Erfahrungen gesammelt habt und euch das nicht zutraut, überspringt dieses Fachchinesisch und springt mal schnell rüber zu den HTML-Signatur-Generatoren, die ich euch weiter unten verlinkt habe.

Hier gibt es ein paar Dinge zu beachten:

  • Benutzt einen reinen Texteditor, auf gar keinen Fall Word oder solche Geschichten! Ich benutze am Liebsten TextWrangler oder  Smultron
    (* kopiert man die geschriebenen Zeilen aus Editoren wie Word, kopiert man die Formatierung mit. Das wollen wir natürlich nicht.)
  • Die Signatur besteht aus einem HTML-Schnipsel. Wir können – und müssen – an dieser Stelle auf das komplette Grundgerüst verzichten. Also nix mit <html><body> und so. Wheeha!
  • Das CSS, also das, was für das Aussehen verantwortlich ist, wird nicht in einer externen Datei ausgelagert. Das schreiben wir in ein Tag ([täg] – das ist das Klammerding in HTML) in den HTML-Schnipsel.
  • Die Bilder liegen irgendwo im Internet und werden über die Bild-URL eingebunden.
  • Wenn ihr mögt, könnt ihr den Code meiner HTML-Signatur anpassen und nutzen

Für Menschen, die sich bisher noch nie mit HTML beschäftigt haben, klingt das jetzt vermutlich echt tricky.

Das HTML

Es gibt Seiten, auf denen ihr euch online Signaturen mit einem What-You-See-Is-What-You-Get-Editor erstellen könnt. Dort könnt ihr euch eure Signatur ganz einfach zusammenklicken. Am Ende kopiert ihr dann einfach den HTML Code.

  1. si.gnatu.re
  2. HTML Signatur Generator

Neue Signatur erstellen

[Hinweis: Ich habe dieses Tutorial anhand des Betriebsystems MacOS Sierra geschrieben]

Dann legen wir eine neue Signatur in Apple Mail an:
Mail  Einstellungen   Signaturen

HTML Signaturen in Apple Mail erstellen

Das ist eine Sache von 2 Sekunden. Das System fügt beim Erstellen einer Signatur automatisch eine abgespeckte Signatur hinzu, die in der rechten Spalte erscheint. Das lassen wir erst vorerst so.
Abrakadabra, it’s magic: Das System hat uns nun eine Datei mit unserer Blabla-Signatur erstellt. Bevor wir sie bearbeiten können, müssen wir sie aber noch finden. Logisch.

Library

Wir gehen über den Finder in die Library, in der sich unsere Programm-Ordner und Einstellungen befinden:
Finder  Gehe zu   Library

Apple Mac Finder Gehe zu

Wie man sieht, sieht man nichts. Zumindest nicht die Library.
Das liegt daran, dass Systemordner von Apple versteckt angelegt werden, damit man nichts kaputt macht und so.
Mit gedrückter alt-Taste können wir den Ordner aber einblenden und die geheiligten Gefielde betreteten.

Library  Mail   V4*  Mail Data  Signatures
* Euer Ordner könnte an dieser Stelle, je nach Version, auch V3 oder V2 heissen

Tadaaaa! Hier seht ihr eine Übersicht aller eurer Signaturen. Wenn ihr vorher schon welche hattet, kann es in dem Ordner schon heiß zugehen. Am Besten sortieren wir den Inhalt über »Ausrichten nach« nach »Hinzugefügt am«.
Die neueste Datei mit der Endung .mailsignature ist dann die vorhin erstelle Datei.

Apple Mail Signatur suchen

Per Rechtsklick öffnen wir diese Datei dann mit unserem reinen Texteditor.
Die ersten fünf Zeilen sind Lava: Nicht anfassen, nicht verändern, nicht löschen und alles wird gut. Das, was in dem Screenshot paulchenpantherpink markiert ist, kann weg. An diese Stelle kommt dann das HTML, das wir selbst geschrieben oder generiert haben.

Apple Mail Signatur editieren


Nach dem Speichern schützen wir die Datei vor dem Überschreiben.
Dazu klicken wir im Signaturen-Ordner auf unsere Signatur und wählen mit dem Rechtsklick die Option »Information« aus und setzen das Häkchen auf »Schreibgeschützt«.

Per Rechtsklick öffnet sich das Optionsmenü
Schreibgeschützte Datei - Apple

Das verhindert, dass unsere mühsam erstellte Datei wieder durch das System überschrieben und zur Blabla-Signatur zurückgesetzt wird.

Jetzt wird’s spannend!

Restart von Apple Mail

»Have you tried turning it off an on again?«

Der Standardspruch eines Entwicklers ist hier das oberste Gebot. Wir beenden Mail und starten neu. Und wenn wir alles richtig gemacht haben, sehen wir unter den Signaturen unsere schicke HTML-Signatur.
In der kleinen Vorschau sehen wir allerdings keine Bilder. Lasst euch davon nicht verunsichern. Wenn die Bilder richtig eingebunden sind, dann seht ihr sie spätestens, wenn ihr die Signatur zuweist und mit dem Konto Emails durch die Weltgeschichte schickt.Adieu, ihr Langweiler! Ich bin viel ansehlicher und interessanter als ihr. MFG, die HTML-Signatur KLICK UM ZU TWEETEN

html mail signatur

Verdammte Axt 2000! Endlich geschafft!
Jetzt könnt ihr der Welt was aufs Auge drücken!