En ocasiones, ya sea por diseño o imagen corporativa o alguna otra
razón necesitas utilizar una fuente específica en un sitio web, lo cual puede
dificultarse porque no todos los que vean el sitio tendrán instalada la fuente
que utilizamos. Para que todos nuestros visitantes vean el sitio tal como
queremos que lo vean hay que hacer lo siguiente:
Debes tener la fuente en formato ttf (formato True Type ) y pasarla a formato
Web Open Font (woff) para ello en cualquier buscador buscamos ttf to woff y
utilizamos alguna de los sitos que ofrecen hacer la conversión de manera
gratuita y en linea.
Ya que tenemos la fuente en formato woff, en nuestra hoja de estilos
(css) vamos a utilizar la directiva @font-face para incorporar nuestra fuente, en el Ejemplo vamos a incorporar una fuente
llamada Robot:
@font-face {
font-family: "Robot";
src: url("../fonts/Robot.woff");
}
Después de esto ya podemos utilizar el font-family en el resto de las
etiquetas
p {family: Robot;} o
.NuevoEstilo{color:#ffffff;font-size:13px;font-family: Robot}
Según la página www.caniuse.com esta es la tabla compatibilidad del formato
WOFF
