Categorías: Desarrollo Javascript Recursos

Utiliza cualquier tipografía en web con Javascript

Typeface.js es la librería javascript esperada por muchos diseñadores, typeface mediante el uso de <canvas/> se encarga de que puedas utilizar en tu sitio web cualquier tipografía que desees.

Es decir normalmente en un diseño web únicamente puedes utilizar tipografías como Verdana, Arial, Georgia u cualquier otra con el único requisito que esa fuente exista en el equipo de tu visitante, cosa que generalmente no sucede.

Typeface soluciona este detalle dando la posibilidad de usar cualquier tipografía sin necesidad de preocuparte, como se hace y cuales son su ventajas en comparación a otras alternativas como sIFR3 y FLIR?

Ventajas

Legibles para buscadores
No es necesario Flash ni PHP, solo javascript el 99% de los navegadores lo tiene.
Multiplataforma
Fácil de utilizar
Ligero
Permite seleccionar y copiar el texto

Como utilizarlo?

1.-Descargar la libreria TypeFace.js

2.-Renombrar la fuente que deseas utilizar por ejemplo de: helvetica.ttf > helvetica.typeface.js

3.-Utilizar el siguiente codigo en la cabezera <head>

<script type="text/javascript" src="typeface-0.10.js"></script>
<script type="text/javascript" src="helvetiker_regular.typeface.js"></script>
<div class="myclass typeface-js" style="font-family: Helvetiker">
 Text here in Helvetiker font...
</div>

Eso es todo en caso de que el script no pueda cargar la fuente personalizada esta mostrara automáticamente la dispuesta como fuente por default para el sitio web.

Si quieres puedes ver algunos ejemplos del uso de este excelente script: