La selección de fuentes ayuda a transmitir la identidad de tu marca y a mejorar la legibilidad de tus emails. Brevo te permite elegir entre una variedad de opciones de fuentes para ayudarle a crear hermosos emails que tengan impacto en tu audiencia y mejoren el reconocimiento de tu marca.
❓ ¿Qué fuentes puedo utilizar para diseñar mi email?
A la hora de diseñar tu email, puedes utilizar:
Una fuente web segura es una fuente que probablemente esté disponible en la gran mayoría de los dispositivos de los usuarios. Las fuentes seguras se pueden usar como fuentes alternativas en caso de que las fuentes seleccionadas originalmente no sean compatibles con el dispositivo del destinatario. Si eliges fuentes seguras para utilizarlas como fuentes alternativas, puedes evitar posibles problemas con la representación de las fuentes y asegurarte de que tus emails no pierden el impacto buscado independientemente del dispositivo en el que se lean.
Google Fonts es una biblioteca de fuentes gratuitas de código abierto proporcionadas por Google que se pueden descargar para utilizarlas en diferentes proyectos digitales. Las fuentes de Google son compatibles con los siguientes clientes de email:
|
|
Brevo te permite usar tus propias fuentes en el editor de emails para diseñar mensajes con tu identidad de marca, lo que garantizará la coherencia y el reconocimiento de la marca en todos los canales de comunicación.
Para utilizar una fuente personalizada en el editor de emails de Brevo, puedes:
Busca y selecciona una fuente de una biblioteca de fuentes de un sitio web público, como Google o Adobe Fonts API. Una vez que hayas seleccionado la fuente, copia el enlace del archivo CSS de dicha fuente. Este enlace contiene los estilos y las variantes de la fuente, y debe parecerse a:
https://fonts.googleapis.com/css2?family=Your+Font+Name:ital,wght@0,100;1,200&display=swap
ohttps://use.typekit.net/xxxxxxx.css
@font-face.
Para usar una fuente personalizada de un archivo CSS:
- Carga el archivo que contiene la fuente personalizada en uno de los directorios del servidor. Los archivos de fuentes personalizadas suelen estar en formato .woff, .woff2 o .ttf.
Asegúrate de que sea accesible desde una URL directa, comohttps://yourserver.com/fonts/your-custom-font.woff2. -
Crea un archivo CSS usando la regla
@font-facey añade el enlace del archivo de la fuente personalizada utilizando la URL mencionada anteriormente. Por ejemplo:@font-face { font-family: 'Your Custom Font'; src: url('https://yourserver.com/fonts/your-custom-font.woff2') format('woff2'); font-weight: normal; font-style: normal; } - Carga el archivo CSS en uno de los directorios del servidor.
- En función del dominio y de la ubicación del archivo CSS, recupera la URL del archivo CSS.
Por ejemplo, si el dominio es thegreenyoga.com, el archivo CSS se encuentra en el directorio css y el nombre del archivo CSS es thegreenyoga-font, la URL debería serhttps://thegreenyoga.com/css/thegreenyoga-font.css.
Una vez que hayas copiado el enlace del archivo CSS que contiene la fuente personalizada, sigue el procedimiento ➕ Add a custom font (Añadir una fuente personalizada) que se describe a continuación. El enlace debe estar en formato http://.
Antes de empezar
Puedes configurar tu biblioteca de marca para que cada plantilla nueva que selecciones herede las propiedades de tu marca, como el logotipo, los colores, las fuentes y los enlaces a redes sociales. Para obtener más información, consulta nuestro artículo dedicado Guarda los activos de tu marca en la Biblioteca de marca para crear diseños de email unificados.
🔤 Añadir fuentes al editor de email
Al diseñar tu email, en las listas desplegables de selección de fuentes se muestran de forma predeterminada las fuentes seguras. Sin embargo, puedes agregar y mezclar todos los tipos de fuentes (Google, seguras y fuentes personalizadas). También puedes configurar fuentes alternativas para los encabezados y los párrafos en caso de que las fuentes seleccionadas originalmente no sean compatibles con el dispositivo de los destinatarios.
Para agregar y configurar fuentes:
- En el editor de email, haz clic en Style (Estilo) en la barra lateral izquierda y desplázate hacia abajo hasta la sección Text styles (Estilos de texto).
- En el menú desplegable Paragraph (Párrafo), selecciona el estilo al que quieras añadir una fuente.
- En el menú desplegable Font (Fuente), selecciona la fuente que quieras utilizar entre las predeterminadas.
-
Si quieres añadir una fuente personalizada, puedes añadir fuentes de Google o personalizadas haciendo clic en Manage web fonts (Gestionar fuentes web). Se te redirigirá a la página Manage web fonts (Gestionar fuentes web) donde podrás:
🖱 Seleccionar fuentes de GoogleEn la pestaña Google Fonts, haz clic en el menú desplegable Fonts (Fuentes) y selecciona las fuentes que quieras utilizar de la lista existente o introduce el nombre de una fuente para buscarla en la biblioteca Google Fonts:
➕ Agregar una fuente personalizada- Ve a la pestaña Custom font (Fuente personalizada).
- En el campo Custom font link (Enlace a fuente personalizada), pega la URL de la fuente que quieras utilizar.
➡️ Para obtener más información sobre cómo recuperar la URL de la fuente, consulta la información de la pestaña Fuentes personalizadas de ¿Qué fuentes puedo utilizar para diseñar mi email? - En el menú desplegable Font name (Nombre de la fuente), mostramos automáticamente los nombres definidos en el archivo CSS donde está guardada la fuente.
- Haz clic en Add font (Añadir fuente).
⛑️ Añadir fuentes alternativasVe a la pestaña Fallback fonts (Fuentes alternativas) y selecciona las fuentes de sustitución que quieras utilizar para los encabezados y otros textos, en caso de que el cliente de email de tus destinatarios no sea compatible con tus fuentes personalizadas.
🎉 Ahora puedes seleccionar la(s) fuente(s) que agregaste desde las listas desplegables de selección de fuentes del editor de email y aplicarlas a cualquier texto de tu email:
✍️ Editar o eliminar una fuente
Para editar las fuentes que has añadido:
- En el editor de email, haz clic en Style (Estilo) en la barra lateral izquierda y desplázate hacia abajo hasta la sección Text styles (Estilos de texto).
-
En el menú desplegable Font (Fuente), haz clic en Manage web fonts (Gestionar fuentes web) para editar o eliminar tus fuentes:
Haz clic en el icono de cruz para eliminar las fuentes de Google que ya no quieras que aparezcan en las listas desplegables de selección de fuentes.- Desmarca las fuentes personalizadas que no deseas que aparezcan en las listas desplegables de selección de fuentes.
- Haz clic en el icono Edit (Editar) para modificar el enlace o el nombre de la fuente personalizada.
- Haz clic en el icono de la papelera para eliminar permanentemente la fuente personalizada del editor de email.
En las listas desplegables, selecciona otras fuentes para reemplazar las fuentes alternativas elegidas inicialmente.
⏭ ¿Qué es lo siguiente?
- Acerca de secciones y bloques de contenido
- Configura el diseño de tu email con la pestaña Style (Estilo)
- Acerca de los bloques Title (Título) y Text Content (Contenido de Texto)
- Sección Drag & Drop email editor (Editor de correo electrónico Drag and Drop
🤔 ¿Tiene alguna duda?
Si tiene alguna pregunta, no dude en ponerse en contacto con nuestro equipo de asistencia mediante la creación de un ticket desde su cuenta. Si todavía no tiene una cuenta, puede ponerse en contacto con nosotros aquí.
Si necesitas ayuda con un proyecto usando Brevo, podemos ponerte en contacto con la agencia partner de Brevo adecuada.