2010
26
05

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

por: Ignacio Parres

¿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.

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?

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

  Acepto la política de privacidad

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.