jueves, 26 de abril de 2012

PresentandoUtilizando Google Font API y Google Font Directory


Introduciendo Google Font Api y Google Font Directory

Ayer 19 de Mayo de 2010 los chicos de Google presentaban dos grandes y buenas noticias para los desarrolladores / diseñadores web: Google Font API y Google Font Directory.
Su idea es compartir con todos nosotros una biblioteca de fuentes de letra amplia, de gran calidad y open source, conocida como Google Font Directory.
Google comparte una gran biblioteca de fuentes de letra open source listas para utilizar de forma realmente sencilla mediante su Google Font API.
Estas fuentes de letra podrán ser utilizadas mediante la Google Font API con el fin de mejorar el aspecto visual de todos nuestros diseños de manera realmente rápida y sencilla.
Han pasado muchos años y las fuentes de letra “no estándar” siguen sin tener un uso claro y sencillo, teniendo que recurrir a hacks, librerías javascript, objetos flash… todo esto pretende cambiar con CSS3 y su propiedad @font-face, y Google tratará de servir todas estas fuentes através de la nube según los requerimientos de cada navegador.

Ventajas y compatibilidad con múltiples navegadores

Todos aquellos que decidan usar la Google Font API tendrán asegurada la compatibilidad con múltiples navegadores para cualquiera de las fuentes de letra de su biblioteca. Todas estas fuentes tendrán las ventajas de un texto normal y corriente:
  • Se comportan como texto normal, no hay canvas ni otros objetos.
  • Indexables y legibles para los buscadores.
  • Visualmente atractivas y sin pérdida de calidad al hacer zoom.
  • Accesibles a todo tipo de lectores de pantalla.
  • Rápido a la hora de cargar las fuentes.
Por si fuera poco, navegadores “obsoletos” como Internet Explorer 6 serán perfectamente soportados por la Google Font API sin aparantemente ningún tipo de hack, canvas ni derivados.

Cómo utilizar la Google Font API

Como nos comentan en su blog, el método de uso es realmente sencillo. Tan sólo necesitamos crear un enlace a la Google Font API especificando las fuentes de letra que deseamos usar y aplicarla mediante selectores CSS en donde deseemos:
  1. <!DOCTYPE html>  
  2. <html>  
  3.     <head>  
  4.         <meta charset="utf-8">  
  5.         <title>Ontuts - Ejemplo de Google Fonts API</title>  
  6.         <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>  
  7.         <style>  
  8.             body{  
  9.                 font-family: 'Yanone Kaffeesatz', serif;  
  10.                 font-size: 72px;  
  11.                 text-shadow: 4px 4px 4px #bbb;  
  12.                 font-weight: 700;  
  13.                 text-align: center;  
  14.             }  
  15.         </style>  
  16. </head>  
  17. <body>  
  18.     ¡Ontuts arrasa por donde pasa!  
  19. </body>  
  20. </html>  
Este sería el resultado final:
Ejemplo Google Fonts API
Es realmente potente y sencillo, ¿verdad? No dejéis de mirar el html final que nos genera, es transparente, texto plano de toda la vida… pero con otro aspecto. Nada de canvas, objetos flash ni similares.

Reflexión final

Si bien todavía está en beta, como diseñador web me resulta realmente interesante ver que por fin podremos empezar a plantearnos el uso de fuentes de letra distintas a las habituales, que aporten mayor solidez a nuestros diseños sin necesidad de hacks, trucos baratos o imágenes en lugar de texto.
Me ha parecido una grandísima idea el hecho de que estén abiertos a que los diseñadores contribuyan a la biblioteca y seguramente en próximas semanas no parará de crecer.
Si bien puede parecer un problema, el hecho de que se aloje todo en los servidores de Google nos permitirá visualizar las fuentes de letra mucho más rápidamente ya sea por la velocidad con la que las sirven o por la cache que se irá acumulando a medida que visitemos más sitios que usen este método.
¿Qué opinión os merece a vosotros todo esto?

No hay comentarios:

Publicar un comentario