¿Qué es Cufon?

cufon

Cufon es la técnica de reemplazo de fuentes utilizando javascript, de manera que puedas usar cualquier tipo de fuente en tu diseño web y no solamente las fuentes estándar como Arial, Times, etc.

¿Cómo utilizar Cufon?

Para utilizar cufon es necesario seguir los siguientes pasos:

1. Conseguir el javascript de cufon (cufon-yui.js), el cual es como el intérprete del font javascript generado, lo puedes bajar desde aquí o en la opción de descarga de la página oficial.

2. Generar la fuente, igualmente a través de la página oficial generamos la fuente elegida en un archivo javascript, en esta página apareceren una serie de opciones las cuales debemos seleccionar cuidadosamente para no incrementar demasiado el tamaño del archivo generado.

3. Colocar el código en nuestro HTML, hacemos referencia a nuestros archivos javascript generados y seleccionamos las etiquetas sobre las cuales se tendrá efecto.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon.js" type="text/javascript"></script>
<script src="computer-font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h1');
</script>
</head>
<body>
<h1>Hola Mundo</h1>
</body>
</html>

Descargar el ejemplo

Código adicional para internet explorer

Para solucionar un problema en IE se tiene que colocar una línea de código antes de la etiqueta </body> en caso de utilizar otro script como el de analytics se tendrá que colocar antes de este último.

//este paso será obsoleto en el futuro
<script type="text/javascript"> Cufon.now(); </script>

Indice Volver al índice

Diseño de páginas Web en Puerto Vallarta y Bahía de Banderas akus.net
subir

Síguenos en Facebook

Artículo de la semana

Cómo iniciar una página WebMetodología para la creación de sitios

Comprende las fases de Análisis, Planificación, Contenido, Diseño. ¿Qué método utilizas?