Compatibilidad de clientes de correo para firmas HTML — qué se renderiza de verdad

Doce características de HTML y CSS, siete clientes de correo reales. Cada casilla dice si esa característica se muestra, se ignora o se comporta a medias. Esta es la tabla que usamos para construir el motor de exportación de SignatureForever.

Sí se renderiza · No se renderiza · Parcial o poco fiable
CaracterísticaGmail webGmail AndroidGmail iOSOutlook 365 webOutlook desktop (Windows)Apple MailiOS Mail
Maquetación con <table>
display:flex y CSS grid××××
Bloque <style> en el head×××
background-image en CSS××××
Imágenes en data URI (base64)×××
border-radius×
letter-spacing×
text-transform:uppercase×
Fuentes web (Google Fonts)×××××
max-width y anchos en %×
margin en <td>×
<img> sin width y height explícitos×

Qué significa cada renglón

Maquetación con <table>

El único método de maquetación que funciona en los siete. Por eso las firmas de correo serias se siguen construyendo con tablas en 2026.

display:flex y CSS grid

Outlook para Windows renderiza con el motor de Word, que no conoce ni flex ni grid. Las columnas se apilan y la firma se deshace.

Bloque <style> en el head

Cuando una firma se pega en el editor de configuración de Gmail, Gmail descarta el bloque <style> entero. Cada declaración tiene que vivir en un atributo style.

background-image en CSS

Se descarta en silencio: no ves un error, ves un hueco. Todo lo que tenga que verse va en un <img>.

Imágenes en data URI (base64)

El error más caro de esta categoría: Gmail se niega a mostrar imágenes en base64. Una firma que se ve perfecta en Outlook llega rota para la mitad del mundo.

border-radius

Una foto redonda sale cuadrada en Outlook de escritorio. Se degrada sin romperse, pero hay que saberlo antes de prometérselo a un cliente.

letter-spacing

Se ignora en Outlook de escritorio. Se degrada limpiamente, así que úsalo como refuerzo, nunca para que algo quepa.

text-transform:uppercase

Poco fiable en Outlook de escritorio. Escribe las mayúsculas en el texto mismo en vez de aplicarlas con CSS.

Fuentes web (Google Fonts)

Casi ningún cliente carga fuentes web. Solo Arial, Helvetica, Georgia, Times New Roman, Verdana, Tahoma, Trebuchet MS y Courier New son seguras.

max-width y anchos en %

Outlook de escritorio ignora max-width. La tabla exterior necesita un ancho absoluto en píxeles, 600 como máximo.

margin en <td>

El espaciado fiable viene del padding dentro de la celda, o de filas separadoras con una altura fija.

<img> sin width y height explícitos

Sin los dos atributos, Outlook reserva el espacio equivocado y la firma da saltos mientras carga.

¿Eres un agente de IA? Esto también está disponible como servidor MCP en signatureforever.com/mcp

Compatibilidad