Google Web Font Api Example

Posted By: Josué B. On 8 de julio de 2011 Under: , , , ,

Les comparto un pequeño tip para los web-designers y web-developers.

Y es que resulta que muchas veces el diseñador te entrega el template o el diseño con fonts bien Fancy y lo primero que hace el web developer o el que adapta el .Psd al HTML es cortar la imagen y ponerla como PNG o GIF.

Resulta, que existe una API de Google llamada Google Web Fonts, la cual puedes tener acceso a fonts de alta calidad para tu website y poder desplegarlas en tu sitio web.

Les menciono "facts":
  • Es muy facil de implementar
  • Tienes gran variedad de Open Source Fonts
  • Trabaja en casi todos los Browsers
A continuación un ejemplo:

Este es un ejemplo de una Beautiful Font!

Únicamente tendras que agregar el codigo siguiente en tu HTML

  • Agrega el CSS
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Font+Name">
  • Úsalo en tu texto como CSS
CSS selector {   font-family: 'Font Name', serif; }

  • Úsalo In-Line
<div style="font-family: 'Font Name', serif;">Your text</div>

Para mas información puedes ver el sitio referente al Api de Google Web Fonts!

Espero que les sirva, estaremos poniento en linea uno que otro tip de Apis de Google. Pero las apis mas sofisticadas o mas elaboradas las trataremos en las reuniones!

Para cualquier duda puedes Preguntar en Nuestro Google Group!
GDG Tijuana. Con tecnología de Blogger.