2010
26
May

Cómo usar estilos CSS en correos electrónicos (email) con HTML

Por:

¿Habéis intentado alguna vez maquetar y dar formato a un correo electrónico con HTML+hoja de estilos CSS?Email / correo electrónico
Entonces habréis sufrido las inclemencias de los clientes de correo, ya que no soportan las hojas de estilos externas; la solución es utilizar estilos CSS dentro de las etiquetas (inline).
Incluso algunos clientes de correo (por ejemplo, Lotus Notes) no son compatibles con XHTML.
Alguna otra perla: Outlook 2007 no admite imágenes de fondo.
A continuación vamos a ennumerar una serie de Recomendaciones para maquetar emails con HTML+CSS:

  • Usar HTML 3.2
  • Body compuesto por un único DIV
  • Ancho máximo 600 píxeles. Para los smartphones, 320px.
  • Utilizar tablas para maquetar
  • Anchos (width) en las celdas; no aplicar ancho a la tabla.
  • No utilizar porcentajes
  • No utilizar imágenes de fondo
  • Estilos dentro de las etiquetas

Por supuesto, es importante que completemos este artículo entre todos con vuestras experiencias y los clientes de correo más importantes del mercado. Todas vuestras sugerencias y recomendaciones a través de los comentarios las probaremos y si son buenas las añadiremos al artículo.

GD Star Rating
loading...

Tags: , , , , , ,


2 Respuestas a “Cómo usar estilos CSS en correos electrónicos (email) con HTML”

  1. iparres dice:

    Alberto, existe un método para embeber las imágenes en el cógido HTML (en vez de referencias externas). Algunos clientes de correo, al detectar la imagen embebida y no tener que descargarla, la muestran directamente (por ejemplo Outlook).

  2. Alberto dice:

    ¿cómo se pueden hacer las imágenes siempre visibles?