[CSS3] Fuentes tipográficas: Google Fonts

Como ya dije en su día, hoy toca hablar un poco más detenidamente de las fuentes de Google.
Como todo en el mundo web, la utilización de recursos ajenos a nuestros servidores trae consigo una serie de ventajas e inconvenientes, que nunca esta de más recordarlos.
Para empezar con lo positivo, lo bueno de tener cierto recursos fuera de nuestro servidor implica una menor carga del mismo a la hora de mostrar un determinado resultado, con su correspondiente reducción de ancho de banda por nuestra parte, al estar repartida.
Y aqui es donde viene el pero, ya que al no ser nosotros los administradores de dicho contenido, podremos estar haciendo referencia a algo que con el tiempo cambie, y tendremos un enlace caido, o aún peor, un enlace a algo que nunca hubiesemos deseado que estuviese en nuestras página.
A lo que veniamos: aqui les dejo un enlace a las fuentes de Google, junto con un pequeño tutorial de como generar el código, tanto CSS como HTML:

[CSS3] Fuentes tipográficas

Tipografías web en CSS3 - la regla @font-face
Las tipografías web permiten a los diseñadores usar fuentes que no se encuentren en el ordenador del cliente.
Cuando tienes en tu propia tipografía (o te la descargar, como escribiré en otro post, de sitios como Google Font) y la quieres usar, simplemente incluyela en tu servidor web (o haz crea una referencia en el código en el caso de que se encuentre en otro servido) y será descargada automaticamente cuando en el cliente se necesite.
Las tipografias personalizadas se definen con la regla CSS3 @font-face.

Diferentes formatos de fuente
Fuentes TrueType (TTF)
TrueType es un formato de fuente estándar desarrollado a finales de 1980, por Apple y Microsoft. TrueType es el formato de la fuente más común para los sistemas operativos Mac OS y Microsoft Windows.
Fuentes OpenType (OTF)
OpenType es un formato de fuente escalable. Fue desarrollado bajo TrueType, y es una marca comercial registrada de Microsoft. Las fuentes OpenType son comúnmente utilizadas hoy por las principales plataformas informáticas.
El formato de fuente tipográfica abierto web (The Web Open Font Format)(WOFF)
WOFF es un formato de fuente diseñado para usarse en páginas web. Fue desarrollado en 2009, y actualmente es el formato recomendado del W3C. WOFF es esencialmente una tipografía OpenType o TrueType comprimida y metadatos adicionales. El objetivo es fomentar la distribución de las fuentes desde el servidor al cliente, aun teniendo limitado el ancho de banda.
El formato de fuente tipográfica abierto web The Web Open Font Format(WOFF 2.0)
Mejora la compresión de las fuentes TrueType/OpenType con respecto a WOFF 1.0.
Fuentes OpenType incrustadas (Embedded OpenType Fonts)(EOT)
Las fuentes tipográficas EOT son una forma compactada de las fuentes OpenType, diseñado por Microsoft para usarse como fuentes incrustadas en las páginas web.

Un ejemplo rápido:

CSS:

@font-face {
    font-family: myFirstFont;
    src: url(sansation_light.woff);
}

div {
    font-family: myFirstFont;
}



Fuente del articulo: W3S