E-mailhandtekeninggenerator

Waarom HTML op basis van tabellen?

Mailprogramma’s interpreteren HTML op ongelijke manieren. Outlook gebruikt de renderingengine van Word, die veel modern CSS negeert (geen flexbox, geen grid, beperkte box-shadow). Tabelopmaak met inline stijlen is het enige patroon dat elke grote client voorspelbaar weergeeft. De generator schrijft precies die smalle stijl, zodat de handtekening er in Gmail, Outlook desktop, Outlook web, Apple Mail en iOS Mail hetzelfde uitziet.

Wat de generator oplevert

De uitvoer is een eenvoudige tabel: je naam vet op de eerste regel, daaronder je functie of bedrijf, en op de laatste regel je contactgegevens gescheiden door een verticale streep:

<table cellpadding="0" cellspacing="0" style="font-family: Arial, sans-serif; font-size: 14px; color: #111827;">
  <tr><td style="font-weight: 700; font-size: 16px;">Alex Rivera</td></tr>
  <tr><td>Lead Designer</td></tr>
  <tr><td style="padding-top: 8px;">alex@example.com | +34 600 000 000 | example.com</td></tr>
</table>

Velden die je leeg laat, worden gewoon overgeslagen, dus een handtekening met alleen naam en e-mail blijft compact.

Wat hoort er in een handtekening

Noodzakelijk:

• Volledige naam.
• Functie of rol.
• Bedrijfsnaam.
• Direct contact (e-mail of telefoon).

Handige toevoegingen:

• LinkedIn-URL of link naar je persoonlijke website.
• Telefoonnummer voor functies met klantcontact.

Vermijd:

• Lange inspirerende citaten.
• Geanimeerde GIF’s (veel clients verwijderen de animatie).
• Grote afbeeldingen (vertragen het laden van mail en worden als “zwaar” gemarkeerd).
• “Vertrouwelijkheids”-bepalingen van meer dan 2-3 regels, tenzij wettelijk vereist.
• Een muur van socialemedia-iconen voor elk netwerk waar je ooit een account hebt gehad.

Later een foto of logo toevoegen

De generator maakt alleen tekst. Om een portret of logo toe te voegen, plak je de gegenereerde HTML in de handtekeningeditor van je mailprogramma en gebruik je de afbeeldingsfuncties daar, of bewerk je de HTML en voeg je een img-tag toe die naar een gehoste afbeelding verwijst. De afbeelding moet op een publiek bereikbare URL staan:

• Bedrijfs-CDN: het beste voor zakelijke handtekeningen; je IT kan hosten onder het merkdomein.
• Gratis afbeeldingshosts (imgur, gratis laag van Cloudinary): snel en gratis; risico dat de host uitvalt.
• Base64-inbedding: bespaart hosting, maar maakt elke mail 20-50 KB groter en sommige Outlook-configuraties verwijderen het.

Houd afbeeldingen klein: onder de 20 KB, vierkant, 120x120 of kleiner.

Outlook-specifieke eigenaardigheden

• Breedte: blijf onder de 600px; bredere handtekeningen worden afgesneden in het voorbeeldvenster.
• Lettertypen: blijf bij Arial, Helvetica, Georgia, Verdana, of gebruik een stack zoals font-family: "Segoe UI", Arial, sans-serif;.
• Kleuren: vermijd puur #000; #333 of #444 renderen beter op Outlook in donkere modus.
• Gebruik geen CSS-variabelen, flex, grid of SVG als primaire elementen.

Juridische disclaimers

Sommige rechtsgebieden (UK Companies Act 2006, EU-vereisten voor bepaalde entiteiten) eisen een geregistreerde bedrijfsnaam, nummer en adres in zakelijke e-mails. Voeg de vereiste gegevens zelf toe, in de velden voor functie en bedrijf of door de HTML daarna te bewerken, en overleg met je juridische team of jouw markt dit vereist.