Un HTML propio puede ser cualquier template o plantilla de email diseñada fuera de DataCrush, ya sea por un diseñador o programador.
Este tipo de plantillas propias podrán luego ser accedidas como plantillas predefinidas para poder ser utilizados en la creación de nuevas plantillas de email.
Luego de subir el HTML propio se accederá a la pantalla de diseño de la plantilla de email con nuestro HTML.
Los requerimientos que debe cumplir el HTML a subir son:
- Ser un archivo comprimido ZIP y contener:
- Archivo .html, Archivo obligatorio del contenido HTML.
- Directorio images: Directorio que contiene las imágenes utilizadas en el código HTML.
- Directorio css: Archivos de estilos utilizados en el código HTML.
- Directorio js: Archivos javascript utilizados en el código HTML (únicamente para páginas landing).
- Pueden crearse directorios personalizados que serán utilizado dentro del código HTML.
- Todas las referencias hacia los archivos externos deben realizarse dentro del código HTML en forma relativa, por ejemplo: <img src=“images/fondo.jpg”>
- El archivo zip debe contener todos estos archivos y directorios en su raíz, NO deben encontrarse los archivos dentro de otro directorio.
- Si se hacen referencias a archivos externos, de otro sitio web por ejemplo, debe soportar HTTPS, de lo contrario no funcionará correctamente
Para crear una plantilla a partir de un archivo html comprimido en formato .zip, se debe seleccionar el tipo de contenido "Subir HTML propio"
Luego se debe asignar un nombre a la plantilla y subir el archivo ZIP que contiene el archivo HTML y el contenido asociado que necesite, como estilos a imágenes.
Si se encuentra algún problema de validación de datos, se informará al momento de subir el archivo.
Checklist para usar HTML propio en plantillas de email
Diseño
-
Definir un ancho máximo recomendado para email marketing.
-
Mantener jerarquía visual clara con encabezados, cuerpo y llamadas a la acción.
-
Asegurar contraste adecuado entre texto y fondo.
-
Usar tipografías seguras para email.
-
Mantener un balance entre texto e imágenes para mejorar la entregabilidad.
-
Garantizar que los elementos interactivos sean visibles y fáciles de clicar en desktop y mobile.
-
Respetar márgenes y espaciados para facilitar la lectura.
-
Optimizar el peso total del email para carga rápida.
Estructura HTML
-
Si vas a usar tu HTML fuera de un editor, incluí toda la estructura (<html>, <head>, <body>).
-
Utilizar estructura compatible con la mayoría de los clientes de correo.
-
Evitar el uso de elementos y propiedades CSS con soporte limitado.
-
Incluir estilos inline para garantizar compatibilidad.
-
Organizar el contenido en contenedores claros y consistentes.
-
Asegurar que las imágenes tengan atributos esenciales definidos.
-
Usar clases y nombres consistentes para facilitar mantenimiento.
-
Mantener el HTML lo más limpio y ordenado posible.
Responsive y adaptabilidad
-
Diseñar pensando en desktop y mobile desde el inicio.
-
Incluir lógica para reordenar o adaptar columnas en pantallas pequeñas.
-
Evitar elementos que dificulten la lectura en dispositivos móviles.
-
Priorizar que el diseño se mantenga funcional sin depender de estilos avanzados.
Compatibilidad y pruebas
-
Considerar las diferencias de renderizado entre clientes de correo.
-
Validar que todos los enlaces y recursos sean accesibles y seguros.
-
Probar en diferentes plataformas antes de enviar.
-
Revisar que el contenido se visualice correctamente con imágenes bloqueadas.
-
Garantizar accesibilidad mínima para lectores de pantalla.
Comentarios
0 comentarios
Inicie sesión para dejar un comentario.