Boletines
Los boletines digitales de Argos deben ofrecer una experiencia visualmente atractiva, alineada con la identidad de marca y completamente funcional en cualquier dispositivo y gestor de correo. A continuación, se detallan los principios clave para garantizar que el diseño sea atractivo, responsivo y compatible con plataformas como: Brevo, Mailchimp, HubSpot, y otros.
Aspectos generales
- Usar un remitente confiable y consistente. Evitar direcciones genéricas como “noreply@argos.com” y optar por direcciones personalizadas. Ejemplo: “comunicaciones@argos.co”.
- El asunto debe captar la atención y motivar a abrir el correo. Para esto se sugiere seguir algunos lineamientos:
- Debe ser corto y claro, idealmente entre 30 y 50 caracteres.
- Generar curiosidad o urgencia, pero sin caer en clickbait, una estrategia de contenido en internet que busca atraer a los usuarios mediante títulos sensacionalistas que pueden rozar lo engañoso.
- Emplear palabras clave que sean del interés de los usuarios. Y, por el contrario, deberán evitarse palabras que activen filtros de spam, como “gratis”, “promoción”, “oferta exclusiva”.
- Usar emojis estratégicamente para destacar entre otros correos, pero sin exagerar. En este campo se debe limitar su uso a 1 o 2, con el fin de evitar rebotes o bloqueos.
Ejemplo de asunto bien optimizado: “Construye con calidad y mayor eficiencia. Descubre cómo hacerlo”
- Preheader optimizado: El preheader es el texto que aparece justo después del asunto en la bandeja de entrada. Muchas veces, si no se configura, se muestra el primer texto del correo, que suele ser irrelevante o incompleto. Para tener un preheader atractivo se recomienda:
- Mantener la brevedad, se sugieren entre 40 y 100 caracteres, porque en móviles se corta más rápido.
- Expandir o reforzar la idea del asunto.
- Usar llamados a la acción sutiles.
Ejemplo de preheader bien optimizado: Con Argos One logras mayor eficiencia en obra, porque tienes mejor gestión de tus pedidos. Conoce más aquí.
- Diseño responsive sin comprometer la identidad visual:
- El diseño debe adaptarse automáticamente a celulares, tabletas y escritorio.
- Evitar la segmentación del diseño en franjas exportadas (una imagen dividida), esta es una práctica común para mantener la composición visual creada en los programas de diseño. Tal acción puede generar líneas blancas visibles entre secciones en algunos gestores de correos, afectando la estética y legibilidad. En su lugar, se recomienda:
– Diseñar boletines en formato HTML + CSS para garantizar que sean completamente responsivos.
– Utilizar fondos de color sólidos y bloques de contenido dinámicos, en lugar de imágenes segmentadas.
– Asegurar que cada bloque de contenido tenga su propia función sin depender de cortes de imagen.
- Evitar la segmentación del diseño en franjas exportadas (una imagen dividida), esta es una práctica común para mantener la composición visual creada en los programas de diseño. Tal acción puede generar líneas blancas visibles entre secciones en algunos gestores de correos, afectando la estética y legibilidad. En su lugar, se recomienda:
- La estructura debe ser de una sola columna y con un ancho máximo de 600 px para garantizar compatibilidad con gestores de correos.
- Ubicación estratégica de elementos visuales:
– Logotipo en el pie de página, no en el encabezado, ya que el remitente deja claro quién envía el correo. En caso de que la marca no sea muy conocida por los destinatarios, este elemento puede ubicarse en la franja superior.
– Los íconos y gráficos deben seguir un estilo minimalista, en versiones rellenas o delineadas, según corresponda, tal como se especificó en la sección de sitios web.
- Evitar fuentes personalizadas que no sean seguras para email.
- En cuanto a la frecuencia y los horarios óptimos, se recomienda que varíen según la tasa de apertura y recepción de la audiencia. No obstante, se debe evitar enviar más de dos correos semanales a la misma base de datos para prevenir desuscripciones.
Colores y tipografía
- Uso de colores alineados con la identidad visual de Argos:
- Los colores primarios deben estar siempre presentes en los diseños.
- Los colores secundarios pueden usarse para gráficos, pero priorizando los más similares al verde y azul de la paleta principal, y los colores terciarios para textos o íconos puntuales.
- Asegurar suficiente contraste para accesibilidad.
- Tipografía corporativa:
- Los títulos deben utilizar la tipografía Integral. Para garantizar que esta se mantenga en todos los gestores de correos, hay dos opciones:
– Exportar los títulos como imágenes, asegurando que el diseñador mantenga el peso y legibilidad adecuada.
– Incrustar la fuente en el código HTML del boletín, siempre validando su compatibilidad con los principales gestores de correo. - Para el cuerpo del texto se recomienda emplear la Trade Gothic Ltd. siempre y cuando se sigan las instrucciones anteriormente descritas, o utilizar la Trebuchet, que es una fuente segura para email.
- Los títulos deben utilizar la tipografía Integral. Para garantizar que esta se mantenga en todos los gestores de correos, hay dos opciones:
Estructura recomendada
- Encabezado:
- Se recomienda que la primera sección de los boletines no incluya el imagotipo o logotipo principal de Cementos Argos, ya que el remitente del correo indica su procedencia.
- Sin embargo, cuando el boletín esté relacionado con una plataforma, programa o iniciativa específica que cuente con su propio logotipo o imagotipo, este sí deberá ubicarse en el encabezado. Esto aplica para casos como e-commerce, programas de lealtad, plataformas de aprendizaje u otros proyectos dirigidos a públicos específicos.
- Esta práctica garantiza una presentación visual más limpia y profesional, manteniendo la identidad de la marca sin sobrecargar la sección inicial del boletín.
- En aquellos casos donde sea necesario incluir el imagotipo o logotipo en el encabezado, se recomienda ubicarlo en la esquina superior izquierda o centrado en la parte superior, dependiendo del diseño y la jerarquía visual del contenido.
- Puede contener imágenes y empleo de los colores primarios o secundarios de la marca, tal como se especifica en los otros apartados.
- Se recomienda emplear en esta sección, un título principal llamativo y, en casos puntuales, una breve introducción. El título principal debe ser conciso y claro, idealmente entre 5 y 10 palabras (máximo 50 a 60 caracteres) para asegurar que sea fácil de leer y que no se corte en dispositivos móviles. Debe utilizarse Integral CF Bold o Extra Bold, entre 1.8 REM y 2 REM en escritorio, dependiendo de la jerarquía del diseño, y para pantallas pequeñas de 1.3 REM a 1.5 REM, asegurando buena legibilidad sin desbordarse. Su alineación debe ser preferiblemente a la izquierda o centrada, según el diseño.
- Se recomienda emplear la opción de “Ver en navegador”, para quienes tengan problemas con la visualización en su gestor de correos.
- Cuerpo del boletín:
Se debe priorizar la jerarquización de la información. Para ello, se recomienda establecer un orden de importancia tipográfico en cada diseño: H1, H2, H3… Asimismo, para lograr una correcta jerarquización, se pueden emplear elementos como el tamaño de la tipografía, los colores, las negritas, las cursivas, entre otros.- Subtítulos: Deben ser claros y captar la atención del lector en menos de 6 palabras, para esto, es preciso incluir palabras claves relevantes para el tema tratado.
- Mensaje principal: Se deben evitar boletines saturados de información, por lo que es recomendable mantener una extensión entre 200 y 400 palabras. En relación con esto, a su vez, deben evitarse grandes bloques de texto, por lo que hacer uso de viñetas o destacados pueden ser útiles para facilitar la lecturabilidad. Se recomiendan textos de 2 a 4 líneas cuando se trate de una sola columna; y de 6 a 8 líneas cuando el diseño está dividido en dos columnas.
Así como en el asunto, se sugiere no saturar con demasiados enlaces ni palabras spam. Además, es importante no abusar del uso de emojis en el cuerpo del correo. Se recomienda un máximo de 6 emojis por mensaje, pero si el contenido es breve, lo ideal es usar aún menos para evitar que el correo se perciba como emoji-heavy, lo que podría aumentar el riesgo de que sea marcado como spam.
Finalmente, cabe aclarar que el lenguaje empleado en el boletín debe alinearse con el público al que este se dirige, tal cual se especifica en el capítulo “Tono comunicacional”.
- Imágenes: Deben ser coherentes con el mensaje del boletín y reforzar el contenido, no ser solo un elemento decorativo. Además de las fotografías, que deben ser coherentes con los lineamientos de Argos, también pueden emplearse elementos como ilustraciones, íconos y gráficos.
En cuanto a las ilustraciones y gráficos, se recomienda que sean minimalistas y limpios, alineados con la identidad visual de la marca; pueden ser útiles para explicar procesos o hacer resúmenes visuales de información compleja. Estas deben trabajarse y exportarse como vectoriales (SVG o PNG de alta calidad) para garantizar nitidez en diferentes resoluciones y dispositivos.
Es recomendable mantener una proporción ideal de 80% texto – 20% imágenes para evitar que el boletín sea detectado como spam. Adicionalmente se recomienda:
– Utilizar los formatos JPG o PNG de alta resolución, pero optimizadas para web con un peso máximo de 100 KB por imagen.
– No incluir videos incrustados, sino capturas de pantalla con un botón de “Reproducir” que redireccione a la plataforma de video.
– Incluir texto alternativo (ALT) en las imágenes para mejorar accesibilidad y legibilidad en correos con bloqueadores de imágenes.
- Botón de llamada a la acción (CTA): Para garantizar la efectividad de los botones en un boletín es importante colocarlos en lugares visibles y estratégicos a lo largo del contenido, como al principio, en el medio y al final; de esta manera el lector siempre podrá encontrarlos sin dificultad. Es esencial que estos no compitan entre sí: un enfoque efectivo es tener un CTA principal, que refleje el objetivo primario del boletín, y uno secundario, que sea menos urgente y esté relacionado con contenido relevante. Por ejemplo:
CTA principal: “Compra ahora y ahorra 20%”
CTA secundario: “Descubre más productos como este”
Estos deben ser visualmente llamativos, pero sin resultar invasivos; por lo que es recomendable que tengan un contraste claro con el fondo del boletín. Además, es fundamental usar verbos de acción que incentiven al lector a tomar decisiones, como “Descubre más”, “Descarga la guía” o “Regístrate”, en lugar de frases genéricas como “Haz clic aquí”.
- Botón de llamada a la acción (CTA): Para garantizar la efectividad de los botones en un boletín es importante colocarlos en lugares visibles y estratégicos a lo largo del contenido, como al principio, en el medio y al final; de esta manera el lector siempre podrá encontrarlos sin dificultad. Es esencial que estos no compitan entre sí: un enfoque efectivo es tener un CTA principal, que refleje el objetivo primario del boletín, y uno secundario, que sea menos urgente y esté relacionado con contenido relevante. Por ejemplo:
- Opciones interactivas: Con el objetivo de hacer el boletín más atractivo, se pueden utilizar elementos como GIFs ligeros para resaltar información clave o contadores de tiempo para promociones, especialmente en el caso de los ecommerce o eventos. Es fundamental asegurarse de que estos elementos no impacten el tiempo de carga ni la estética del boletín, ya que podrían afectar negativamente la experiencia de usuario (UX) y la interfaz de usuario (UI).
- Pie de página: Se recomienda evitar sobrecargar el pie de página con demasiada información. El ancho debe ser adaptable al 100% de la pantalla, con un máximo de 600 px para prevenir cortes en dispositivos móviles. Además, se debe mantener un espaciado uniforme, con márgenes de 16px en desktop y 12px en dispositivos móviles alrededor del contenido. Para organizar el contenido, se sugiere dividir el pie de página en 3 franjas:
- Franja 1:
Logotipo de Argos y patas corporativas: Deben estar ubicados en una franja de lado a lado del boletín, en uno de los colores de la paleta primaria (según diseño), con una altura máxima de 40 px para garantizar legibilidad sin afectar la experiencia en dispositivos móviles. La estructura debe ser:
– Izquierda: Logotipo de Argos, seguido de una línea divisoria que da paso al lema corporativo: LUZ VERDE.
– Derecha: Logotipo de Grupo Argos con la frase “Empresa perteneciente a Grupo Argos” (solo para Colombia).
Espaciado: Mínimo de 16 px de margen entre cada elemento para evitar saturación visual.
- Franja 1:
- Franja 2:
En esta sección se incluirían las redes sociales corporativas activas, el correo de contacto y el número de atención al cliente. Se debe hacer uso de íconos minimalistas rellenos, que estén alineados debajo del logotipo y patas corporativas. Para estos se recomienda un tamaño de íconos de 24 px a 32 px, con una separación entre ellos de 8 px a 12 px entre íconos. Para el texto de correo y teléfono, se sugiere emplear la misma tipografía del cuerpo del boletín, en tamaño de 14 px a 16 px.
Esta franja es opcional, dependiendo del objetivo del correo, tema o público.
- Franja 2:
- Franja 3:
Por último, debe ubicarse el aviso de privacidad y opción de baja. El texto debe ser legible pero discreto, por lo que se recomienda emplear un tamaño de fuente de 12 px a 14 px. Los textos “Aviso de privacidad” y “Darse de baja” deben tener enlaces clicables.
Estos elementos son obligatorios para cumplir normativas GDPR y CAN-SPAM.
- Franja 3:
A continuación, se proponen tres opciones para variar los colores de las franjas, respetando la identidad visual de la marca.
