Este es un complemento a este video, en el que codificamos y estilizamos un correo electrónico HTML responsivo desde cero —
http://youtu.be/XnWIperMy08----
Este video cubre algunos puntos principales:
# Estructura de codificación
- No importa, no te preocupes por directorios y cosas, quieres hacerlo rápido y sucio.
- No te dejes engañar pensando que necesitas usar tablas. Esa es una práctica obsoleta y solo es útil para crear diseños de múltiples columnas, que en sí mismos no son una gran idea...
- Ten en cuenta que tus etiquetas head y body probablemente serán eliminadas por el cliente de correo. Esto hace que las etiquetas de estilo sean un buen complemento, pero no puedes depender de ellas.
- Lo que hace que las consultas @media también sean poco confiables.
- Lo que significa que un buen correo electrónico responsivo es naturalmente flexible y está diseñado en una sola columna desde el principio.
- Todos tus estilos deben ser en línea. Pero eso no significa que debas escribirlos de esa manera.
- Usa el inliner de CSS de Mailchimp para mover el CSS en línea después de que hayas terminado de crearlo usando el método que prefieras. Yo uso SASS. Como un jefe.
# Mensajería móvil primero
Los diseñadores y remitentes de correos electrónicos realmente necesitan entender y aceptar que una gran mayoría de sus correos electrónicos se abrirán en un dispositivo móvil. He descrito cómo diseño para una columna de ancho flexible. Pero esto también significa mantener tu contenido con un enfoque móvil primero.
- Un mensaje claro.
- Un llamado a la acción claro.