Establecer fuentes alternativas seguras en los emails

Los diseñadores de emails tienen a su disposición dos tipos distintos de fuentes: fuentes web-safe (o seguras para la web) y fuentes web. Como ejemplos de fuentes seguras para la web están las Arial, Times New Roman, Verdana o Georgia. Son los tipos de letra por defecto que encontramos en la mayoría de los diferentes dispositivos y sistemas operativos. A diferencia de estas, las fuentes web no están disponibles por defecto en diversos dispositivos/sistemas operativos. Como fuentes web que quizás conozcas podemos citar Open Sans o Roboto.

Aunque las fuentes web abren todo un abanico de posibilidades de diseño, el profesional del email marketing tiene que tener cuidado al respecto, ya que, desgraciadamente, no todos los clientes de email las admiten. Por eso, si utilizas fuentes web, es fundamental contar con una fuente alternativa que sea segura para la web, para aquellos clientes que no sean compatibles con las primeras. Simplemente se trataría de tener una lista de fuentes por orden de preferencia: si un cliente no puede aplicar la opción número uno, entonces que use la siguiente de la lista. 

Cómo implementar fuentes alternativas seguras para la web

Asegúrate de tener un proveedor de servicios de envío de emails que te ofrezca la posibilidad de trabajar con código para crear tus emails. Para configurar tus fuentes alternativas:

• Ejemplo de situación de partida: quieres usar Roboto en tu campaña de email, pero hay clientes de email que no son compatibles con fuentes web y, al abrir el mensaje, la sustituirán con otra fuente, como Arial. 

• Si manejas el código de tus emails, puedes seleccionar tú qué fuente alternativa quieres, para mantener el diseño lo más parecido posible. De lo contrario, si no estableces fuente alternativa, el cliente de email mostrará tu email con la fuente que el cliente tenga por defecto (Arial en nuestro ejemplo). 

• ¿Que lo que tú quieres es que la fuente alternativa sea Helvetica preferiblemente antes que Arial? Entonces utiliza el siguiente código en tu CSS: font-family: "Roboto", Helvetica, Arial, sans-serif;