/ Tips Viernes, 21 de Enero de 2011
Si eres un webmaster, más de una vez te habrán pedido utilizar en una web alguna tipografía que muy poco probablemente estaría instalada en los ordenadores de los visitantes. Para solventar este problema, algunos optan por crear imágenes con la fuente deseada, práctica que suelo desaconsejar dado que se pierden posibles palabras claves de cara a los buscadores, a parte de restar agilidad a las actualizaciones posteriores de la web.
La solución más efectiva la encontramos utilizando la propiedad font-face de las hojas de estilos, y en esta aplicación online: Font-Face Generator.
Subimos la fuente deseada dándole al botón "add font", aceptamos las condiciones y presionamos "download your kit": se nos abrirá un .zip con la fuente convertida a diferentes formatos para que sea compatible con la mayoría de navegadores, y por supuesto las instrucciones para insertar la fuente en la web.
Algo parecido a este código css:
@font-face {
font-family: 'DroidSansMonoRegular';
src: url('DroidSansMono-webfont.eot');
src: local('Droid Sans Mono Regular'), url('DroidSansMono-webfont.woff') format('woff'), url('DroidSansMono-webfont.ttf') format('truetype'), url('DroidSansMono-webfont.svg#webfontVHHYtszH') format('svg');
font-weight: normal;
font-style: normal;
}
.miEstilo {
font-family:'DroidSansMonoRegular';
}
Actualización Marzo 2016: como es lógico con el pasar de los años ciertos trucos se vuelven obsoletos, hoy en día el mejor servicio para incrustar en una web fuentes no comunes y libres de derechos, es sin duda alguna Google Fonts.
