La ventana Añadir Fuentes Web, que se abre pulsando el botón Agregar que hay en la ventana Preferencias | Fuente Web, presenta las opciones necesarias para añadir una nueva Fuente Web a la lista de las utilizables en el Proyecto.
Antes de nada es necesario elegir qué técnica se va a utilizar para integrar las Fuentes Web:
▪ | Fuente Google: los archivos de las fuentes están disponibles en los servidores de Google y se toman de allí para las hojas de estilo de las páginas del sitio web. |
▪ | Fuente Web: los archivos de las fuentes están en nuestro equipo y se publican en nuestro servidor web. |
Tanto si decide utilizar una Fuente Google como si decide integrar una Fuente Web, es necesario importar:
▪ | Archivo TTF para la visualización local: es el archivo en formato TrueType (TTF) necesario para poder visualizar la fuente localmente. Así WebSite X5 puede utilizar la fuente como si estuviese instalada en el sistema operativo del ordenador y ofrecerla en el editor de texto, y en general en cualquier punto en el que sea posible configurar el tipo de fuente que se quiere emplear para un texto. |
En el caso de una Fuente Google, además, es necesario especificar:
▪ | Código @Import: es el código, proporcionado directamente por Google, que sirve para vincular la fuente a la Hoja de Estilo (CSS) de las páginas del sitio web. |
En el caso de una Fuente Web es también aconsejable importar:
▪ | Archivo WOFF (recomendado): es el archivo de la fuente en formato WOFF. Este tipo de formato es compatible con Internet Explorer, Mozilla Firefox y Google Chrome. |
▪ | Archivo SVG (iPhone/iPad): es el archivo de la fuente en formato SVG. Este tipo de formato es compatible con Mozilla Firefox, Safari, Google Chrome y Opera. |
▪ | Archivo EOT (solo IE): es el archivo de la fuente en formato EOT. Este tipo de formato es compatible solo con Internet Explorer. |
|
Debido a que la compatibilidad de las Fuentes Web en los principales exploradores no es homogénea, se aconseja importar no solo el archivo TTF (obligatorio) sino también los archivos WOFF, SVG y EOT de las fuentes que se quiere utilizar.
|
|
Best practice:
Profundización: