20 de mayo de 2010

Google Web Fonts: Cómo utilizar cualquier tipo de fuente en una web en HTML

Una de las máximas limitaciones que hemos tenido los desarrolladores a la hora de diseñar webs son las tipografías, HTML soporta por defecto muy pocas y si introducimos alguna tipografía que el usuario no tiene instalada la web puede dar un aspecto lamentable.

Existen desde hace tiempo soluciones para paliar este problema, tanto en Flash, como en PHP como con Javascript, pero todas ellas dan algún tipo de problema por lo que al final sólo las he terminado utilizando para algunos titulares y poco más, en mi caso mi solución preferida es el sIFR, pero a veces no me muestra bien los textos por lo que siempre que lo he utilizado he tenido que cruzar los dedos.

Afortunadamente Google acaba de lanzar Font API que nos permite utilizar de manera muy sencilla en nuestras webs todas las fuentes que tiene recopiladas en su Font Directory.

Funciona de manera muy sencilla:
  1. Introducimos en primer lugar la llamada a la fuente, en este caso la fuente Cantarell:
    <link href="http://fonts.googleapis.com/css?family=Cantarell" rel="stylesheet" type="text/css" />
  2. Ya podemos editar nuestra hoja de estilos para utilizar esta fuente, os pongo un ejemplo:
    .textoPrueba {font-family: 'Cantarell' }
En fin, más sencillo imposible. Esta gente de Google se ha salido :)

    No hay comentarios: