Intentar agregar fuentes "no seguras" a una página web es una de las actividades más frustantes para todo aquel que se inicie en el diseño web.
Se puede recurrir al reemplazo de texto por imágenes, vía CSS o, de otra manera, implementar sIFR, mediante JavaScript y Flash.
Recientemente, David Chester ha presentado (bajo licencia MIT) a typeface.js un JavaScript que renderiza las fuentes vía canvas (para los navegadores que lo soportan) o mediante VML para Internet Explorer.
La implementación, se lleva a cabo de la siguiente forma:
<html>
<head>
<!-- load any external stylesheets first -->
<link rel="stylesheet" type="text/css" ref="/style.css">
<!-- then load the typeface.js library and typeface.js fonts -->
<script type="text/javascript" src="typeface-0.10.js"></script>
<script type="text/javascript" src="helvetiker_regular.typeface.js"></script>
</head>
<body>
<!-- go ahead and specify typeface.js fonts with CSS -->
<div class="myclass typeface-js" style="font-family: Helvetiker">
Text here in Helvetiker font...
</div>
</body>
</html>
Actualmente, sólo están disponibles 3 fuentes para este script.
- Helvetiker
- Optimer
- Gentilis
Para un ejemplo, se puede consultar un test con la fuente Fraktur (gentileza del sitio http://coruna.elahorcado.net/)
Entradas relacionadas:
@font-face: lo que se viene en Firefox 3.1
Mi nombre es