valuvita · intern
valuvita Signatur Generator
Die Daten stammen aktuell aus Dummy-Daten und werden später automatisch aus Microsoft 365 (Microsoft Graph API) geladen. Vorlage wählen, kopieren und in Outlook, Apple Mail oder Gmail einfügen. Eine Anleitung pro Mail-Programm findest du weiter unten.
Standardvorlage für alle Mitarbeiter.
Mitarbeiter-Signatur – Vorschau
700 px breit
|
||||||||||||||||||||||||||||||||
.
HTML-Quelltext
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="700" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:700px;max-width:700px;background-color:#ffffff;font-family:Arial, Helvetica, sans-serif;">
<tr>
<td valign="top" width="700" style="width:700px;padding:20px 24px 20px 24px;background-color:#ffffff;font-family:Arial, Helvetica, sans-serif;color:#03545C;vertical-align:top;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td valign="top" style="padding:0;font-family:Arial, Helvetica, sans-serif;vertical-align:top;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:20px;line-height:24px;color:#3D9587;font-weight:bold;font-style:italic;mso-line-height-rule:exactly;">
Sina Sauer
</div>
<div style="font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;font-weight:bold;padding-top:2px;mso-line-height-rule:exactly;">Assistenz der Geschäftsführung</div>
<div style="font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;padding-top:2px;mso-line-height-rule:exactly;">
<a href="tel:0623194035185" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">06231 94035-185</span></a>
</div>
</td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td style="font-size:0;line-height:0;height:22px;"> </td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td valign="top" width="50%" style="width:50%;padding:0 12px 0 0;font-family:Arial, Helvetica, sans-serif;vertical-align:top;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
<tr>
<td valign="middle" width="20" style="width:20px;padding:2px 0 4px 0;line-height:0;font-size:0;mso-line-height-rule:exactly;">
<img src="/signature/tel.png" alt="Telefon" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="middle" width="14" style="width:14px;padding:0 0 6px 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">T</td>
<td valign="middle" style="padding:0 0 6px 6px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">
<a href="tel:0623194035500" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">06231 94035-500</span></a>
</td>
</tr>
<tr>
<td valign="middle" width="20" style="width:20px;padding:2px 0 4px 0;line-height:0;font-size:0;mso-line-height-rule:exactly;">
<img src="/signature/fax.png" alt="Fax" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="middle" width="14" style="width:14px;padding:0 0 6px 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">F</td>
<td valign="middle" style="padding:0 0 6px 6px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">
<a href="tel:0623194035999" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">06231 94035-999</span></a>
</td>
</tr>
<tr>
<td valign="middle" width="20" style="width:20px;padding:2px 0 4px 0;line-height:0;font-size:0;mso-line-height-rule:exactly;">
<img src="/signature/mail.png" alt="E-Mail" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="middle" width="14" style="width:14px;padding:0 0 6px 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">E</td>
<td valign="middle" style="padding:0 0 6px 6px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;white-space:nowrap;mso-line-height-rule:exactly;">
<a href="mailto:name.nachname@valuvita.de" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">name.nachname@valuvita.de</span></a>
</td>
</tr>
</table>
</td>
<td valign="top" width="50%" style="width:50%;font-family:Arial, Helvetica, sans-serif;vertical-align:top;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
<tr>
<td valign="top" width="20" style="width:20px;padding:2px 0 0 0;line-height:0;font-size:0;">
<img src="/signature/location.png" alt="Adresse" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="top" style="padding:0 0 0 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;mso-line-height-rule:exactly;">
<strong style="font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;">valuvita GmbH</strong><br />
Ute-Ruhne-Str.<br />
67125 Dannstadt-Schauernheim
</td>
</tr>
</table>
</td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td style="font-size:0;line-height:0;height:36px;"> </td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td valign="middle" width="50%" style="width:50%;padding:0 16px 0 0;font-family:Arial, Helvetica, sans-serif;vertical-align:middle;border-right:1px solid #cfd6d2;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
<tr>
<td valign="middle" width="20" style="width:20px;padding:2px 0 4px 0;line-height:0;font-size:0;">
<img src="/signature/website.png" alt="Website" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="middle" style="padding:0 0 6px 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;mso-line-height-rule:exactly;">
<a href="https://valuvita.de" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">valuvita.de</span></a>
</td>
</tr>
<tr>
<td valign="middle" width="20" style="width:20px;padding:2px 0 4px 0;line-height:0;font-size:0;">
<img src="/signature/homelove.png" alt="Standorte" width="20" height="20" style="display:block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" />
</td>
<td valign="middle" style="padding:0 0 6px 8px;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;mso-line-height-rule:exactly;">
<a href="https://valuvita.de/standorte" style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;font-weight:bold;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;">valuvita Häuser</span></a>
</td>
</tr>
<tr><td colspan="2" valign="middle" style="padding:0;line-height:0;font-size:0;"><a href="https://facebook.com/" target="_blank" rel="noopener" style="text-decoration:none;display:inline-block;margin-right:14px;padding-right:0;line-height:0;"><img src="/signature/facebook.png" alt="Facebook" width="20" height="20" style="display:inline-block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" /></a><a href="https://instagram.com/" target="_blank" rel="noopener" style="text-decoration:none;display:inline-block;margin-right:14px;padding-right:0;line-height:0;"><img src="/signature/instagram.png" alt="Instagram" width="20" height="20" style="display:inline-block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" /></a><a href="https://linkedin.com/company/" target="_blank" rel="noopener" style="text-decoration:none;display:inline-block;margin-right:14px;padding-right:0;line-height:0;"><img src="/signature/linkedin.png" alt="LinkedIn" width="20" height="20" style="display:inline-block;border:0;outline:none;text-decoration:none;width:20px;height:20px;" /></a></td></tr>
</table>
</td>
<td valign="middle" width="50%" style="width:50%;padding:0 0 0 16px;font-family:Arial, Helvetica, sans-serif;vertical-align:middle;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
<tr>
<td valign="middle" style="padding:0 12px 0 0;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;mso-line-height-rule:exactly;vertical-align:middle;">
<a href="https://valuvita.de/karriere" style="color:#03545C;text-decoration:none;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;"><span style="color:#03545C;text-decoration:none;">
<strong style="font-family:Arial, Helvetica, sans-serif;font-size:16px;line-height:20px;color:#3D9587;font-style:italic;">Karriere starten</strong><br />
<strong style="font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:20px;color:#03545C;">bei valuvita</strong>
</span></a>
</td>
<td valign="middle" style="line-height:0;font-size:0;vertical-align:middle;">
<a href="https://valuvita.de/karriere" style="text-decoration:none;line-height:0;display:inline-block;"><img src="/signature/qr-code.png" alt="QR-Code Karriere bei valuvita" width="64" height="64" style="display:block;border:0;outline:none;text-decoration:none;width:64px;height:64px;" /></a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td style="font-size:0;line-height:0;height:36px;"> </td>
</tr>
<tr>
<td style="padding:0;font-size:0;line-height:0;">
<img src="/signature/logo.png" alt="valuvita - WERTVOLLES LEBEN" width="240" height="68" style="display:block;border:0;outline:none;text-decoration:none;width:240px;height:68px;" />
</td>
</tr>
</table>
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;width:100%;">
<tr>
<td style="font-size:0;line-height:0;height:20px;"> </td>
</tr>
<tr><td style="padding:0 0 8px 0;font-family:Arial, Helvetica, sans-serif;font-size:12px;line-height:16px;color:#03545C;mso-line-height-rule:exactly;">Registergericht: Amtsgericht Ludwigshafen<br />Registernummer: HRB 63660<br />Geschäftsführung: Manfred Hoffmann, Dr. Christoph Wagner</td></tr>
<tr><td style="padding:0 0 8px 0;font-family:Arial, Helvetica, sans-serif;font-size:12px;line-height:16px;color:#03545C;mso-line-height-rule:exactly;">Vertraulichkeitshinweis: Diese Nachricht ist ausschließlich für die Personen bestimmt, an die sie adressiert ist. Sie kann vertrauliche und/oder nur für den/die Empfänger bestimmte Informationen enthalten. Sollten Sie nicht der bestimmungsgemäße Empfänger sein, kontaktieren Sie bitte den Absender und löschen Sie die Mitteilung. Jegliche unbefugte Verwendung der Informationen in dieser Nachricht ist untersagt.</td></tr>
<tr><td style="padding:0;font-family:Arial, Helvetica, sans-serif;font-size:12px;line-height:16px;color:#03545C;mso-line-height-rule:exactly;">Confidentiality Note: This message is intended only for the use of the named recipient(s) and may obtain confidential and/or privileged information. If you are not the intended recipient, please contact the sender and delete the message. Any unauthorized use of the information contained in this message is prohibited.</td></tr>
</table>
</td>
</tr>
</table>Anleitung
So fügst du die Signatur in den gängigen E-Mail-Programmen ein.
A) Outlook Classic für Windows
- Signatur im Generator öffnen.
- Auf „Desktop-Signatur kopieren“ klicken.
- Outlook Classic öffnen.
- Datei > Optionen > E-Mail > Signaturen öffnen.
- „Neu“ anklicken und der Signatur einen Namen geben.
- In das Signaturfeld klicken.
- Mit Strg + V einfügen.
- Prüfen, ob die Bilder angezeigt werden.
- Standardsignatur für neue Nachrichten auswählen.
- Optional auch für Antworten und Weiterleitungen auswählen.
- Speichern.
- Outlook Classic verwendet Microsoft Word als Rendering Engine, deshalb können Abstände leicht abweichen.
- Verläufe, Hintergrundbilder, border-radius, Flexbox und Grid funktionieren nicht zuverlässig.
- Bilder müssen öffentlich per absoluter HTTPS-URL erreichbar sein.
- Nach dem Einfügen die Signatur möglichst nicht im Outlook-Editor nachbearbeiten — Outlook verändert sonst das HTML.
B) Outlook Online / Microsoft 365 Web
- Signatur im Generator öffnen.
- Auf „Desktop-Signatur kopieren“ klicken.
- Outlook Web öffnen.
- Einstellungen öffnen.
- E-Mail > Verfassen und Antworten öffnen.
- Neue Signatur erstellen.
- In das Signaturfeld klicken.
- Mit Strg + V bzw. Cmd + V einfügen.
- Signatur für neue Nachrichten und Antworten auswählen.
- Speichern.
- Outlook Online unterstützt HTML besser als Outlook Classic, kopierte Signaturen können trotzdem verändert werden.
- Wenn Bilder nicht erscheinen, müssen absolute HTTPS-URLs verwendet werden.
C) Apple Mail
- Mail öffnen.
- Einstellungen > Signaturen öffnen.
- Account auswählen.
- Neue Signatur erstellen.
- Signatur einfügen.
- Format und Bilder prüfen.
D) Gmail
- Gmail öffnen.
- Einstellungen öffnen.
- „Alle Einstellungen ansehen“ wählen.
- Bereich „Signatur“ öffnen.
- Neue Signatur erstellen.
- Signatur einfügen.
- Bilder und Links prüfen.
- Änderungen speichern.
Technische Hinweise
Wichtige Eigenheiten der HTML-E-Mail-Signatur.
- Die Signatur ist bewusst mit Tabellenlayout aufgebaut, da Outlook Classic Flexbox und Grid nicht zuverlässig rendert.
- Outlook Classic nutzt Microsoft Word als Rendering-Engine; viele moderne CSS-Funktionen werden ignoriert.
- Die rechte Brandingfläche wird als PNG/JPG eingebunden statt mit CSS-Verläufen, border-radius oder Hintergrundbildern.
- Für den produktiven Einsatz müssen alle Bildpfade absolute HTTPS-URLs sein.
- Keine lokalen Bildpfade in der finalen E-Mail-Signatur verwenden — sie werden in Outlook nicht aufgelöst.
- Keine base64-Bilder verwenden — werden häufig blockiert oder entfernt.
- PNG oder JPG statt SVG verwenden — SVG ist in Outlook nicht zuverlässig.
- Dark Mode kann Farben in manchen Clients invertieren oder verändern.
- Tests in Outlook Classic sind verpflichtend, Tests in Outlook Online werden empfohlen.
- Zusätzlich eine Testmail an Gmail, Apple Mail und ein iPhone senden.
- Bilder bekommen width/height sowohl als HTML-Attribut als auch im Inline-Style.
- Animierte GIFs, Webfonts, CSS-Variablen und JavaScript sind in der Signatur ausgeschlossen.
