CSS3 :: Font-face

Hay en ocasiones que estamos desarrollando webs en XHTML y nos encontramos en el diseño con tipografías que no tendrá la mayoría de los usuarios por lo que no podrán tener una correcta visualización de la página. Por lo que hasta ahora nos quedaban dos soluciones:

  • Uso de imágenes de fondo en el elemento que contiene la tipografía.
  • Algún método alternativo como el SIFR

Ahora en CSS3 tenemos la etiqueta font-face que permite usar una tipografía ubicada en el servidor.
La sintaxis de uso es la siguiente:

@font-face {
  font-family:NOMBRE_TIPOGRAFIA;
  src: url(RUTA_TIPOGRAFIA);
}

A partir de ese momento ya se puede usar en el CSS.

La verdad que me parece un gran paso. Ahora a buscar soluciones para versiones de navegadores antiguas que no lo soporten :) . Os dejo un ejemplo para que veais como queda (se debe de probar en navegadores que ya lo soporten como puede ser a partir de la versión 3.1 de Firefox o safari 3.1) Prueba de font-face

2 comentarios

  1. Es un gran adelanto bien usado pero, a la vez, ya sabemos lo que traerá… más webs hechas en word con 200 tipografías distintas…

    Offtopic: Qué tal? Y el resumen de SBF?

  2. elOtro[Q] (Autor)

    Por Subflash muy bien!!!, que te voy a contar :) . El año que viene a ver si contamos contigo!!!

Deja un comentario