Cambiando de fuentes con Google Font Directory
Hay una serie de fuentes que son coincidentes en casi todo los sistemas, así que lo más que se podía hacer es elegir una y sus análogas, y rezar para que el diseño se viera “más o menos igual” en todos los sitios. Este es un ejemplo, de los muchos que hay, sobre la cantidad de elementos cambiantes con los que cuenta un diseñador web a la hora de hacer una jompeich.
La única alternativa era hacer un apaño complicado y lento, tirando de javascript y flash para redibujar el texto con la fuente, para que fuera seleccionable (y claro está, indexable). O eso, o rotular con imágenes directamente, lo cual es una cutrada antiseo.
Resumiendo, como no habían garantías de que todo el mundo tuviera las mismas fuentes, te tenías que cortar a la hora de hacer el diseño sin salirte mucho de Arial, Helvetica, San-serif.
Ayer Google presentó Google Font Directory, un directorio de fuentes alojadas en la nube (en sus servidores) y que puedes usar para tus web, con lo que se garantiza que cualquier usuario dispondrá de dichas fuentes en su navegador, sin necesidad de tenerlas instaladas.
La solución es tan buena como sencilla, en vez de citar a la fuente que podría estar instalada(o no) en el ordenador de quien visualiza la página, se cita la fuente que está alojada, si o si, en los servidores de Google, lo cual da muchas más garantías a la hora de maquetar. El riesgo está, claramente, en que estarás externalizando un elemento del diseño (el de las tipografías) a su alojamiento en los servidores de Google, aunque no creo que sea un riesgo grande, en cualquier caso, siempre puedes seguir definiendo las siguientes fuentes en la lista.
Al grano, he hecho una prueba en este blog, con la fuente Lobster, para los títulos de las entradas y funciona perfectamente. Lo que hay que hacer es lo siguiente:
1º Copiar el código a incrustar de la fuente, el de la pestaña “Get code“:
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
2º Ir a la cabecera de la plantilla, en este caso, al fichero header.php (ya que está en wordpress) y copiar el código.
3º Redefinir el estilo para que tenga en cuenta la nueva fuente, en este caso redefiní el h3:
h3 { font-family: 'Lobster', arial, serif; }
Busqué una letra cantosa para que se notara.
Julio Loayza
may 21, 2010 @ 15:14:15
El problema de las fuentes viene dado por el coste de la licencia de las mismas. Los sistemas operativos vienen con una serie de fuentes libres de derechos y/o aportadas por la empresa desarrolladora del propio sistema operativo. Lógicamente el número de fuentes que incorpora cada sistema es limitado, dado el coste que supondría distribiurlo con un gran número de ellas.
Como comentas, esta escasa variedad ha afectado a la web.
El tema es que la regla @font-face, que es en lo que se basa todo esto, llegó con CSS 2, que tiene ya 10 años. Pero su uso nunca llegó a prosperar, básicamente por el mencionado problema de los derechos. Subir la fuente original a un servidor para que el agente de usuario pudiera descargarla y utilizarla contraviene claramente las licencias de las fuentas. También existía el problema de los tiempos de descargar y de costes de ancho de banda.
Recientemente @font-face ha cobrado nuevamente vida con soluciones como Typekit. Ahora llega Google para darle un gran empujón.
¿Y por qué esta parrafada? Pues porque da la impresión, no me refiero a ti, si no en general, de que Google llega e inventa algo nuevo y maravilloso. Y para nada es así. Es la nueva Microsoft, solo que más inteligente y potencialmente muchísimo más peligrosa. Sinceramente, aunque soy un “power-user” de sus servicios, cada vez me está agobiando más que se metan en ab-so-lu-ta-men-te TODO.
¡Un saludo!
P.D.: Una puntualización: sans-serif no es una fuente, si no, muy a grandes rasgos, un tipo de fuente.
me gustan las tapas
may 21, 2010 @ 18:37:21
Chacho Julio, chiquito palique mano! Aunque no te falta razón falta que no hace falta…
por cierto, sans-serif no es un tipo de fuente sino una característica que las une, en este caso, la falta de serifas.
Jose Frechín
may 21, 2010 @ 21:19:11
Julio eres un fiera, muchas gracias por las aclaraciones, siempre pesco con esto de las fuentes, cuando estaba en win nunca me planteé el tema de los costes de las fuentes y ahora en linux menos, pero está claro que es crítico.
Respecto al PDM de Google, estaba pensando que utilizando la misma solución pero colgando las fuentes en S3 de Amazon o algo lo suficiente grande, estable y escalable que permita alojarlas, se podría conseguir el mismo resultado sin dependencia de una sola empresa.
Mantenimiento informático Tenerife
may 23, 2010 @ 11:48:05
[...] am on Mayo 23, 2010 | # | 0 Cambiando de fuentes con Google Font Directory http://tunelcarpiano.net/2010/05/cambiando-de-fuentes-con-google-font-directory.html [...]
Julio Loayza
may 27, 2010 @ 08:41:20
@Frechín: Lo que dices sería una solución excelente para fuentes libres de derechos. Lo que, es evidente, la gente en general tenderá a lo más fácil, que es tirar de Tito Google y “no complicarse”. Por otro lado, lo que, mucho me temo, podría hacer Google es comprar catálogos de fuentes, o llegar a un acuerdo con propietarios de derechos, para ofrecerlas en su paquete y tener un plus. Digo “mucho me temo” porque el objetivo de Google no es otro que el de generar dependencia.
@me gustan las tapas: Por eso decía “muy a grandes rasgos”.