Cómo usar fuentes personalizadas mediante CSS

Autor: Armonth | El lunes 15 de octubre del 2007 @ 01:25.

Leo (con retraso) a Andrés Nieto que habla sobre @font-face, una propiedad de CSS que justo ahora WebKit ha empezado a soportar. Esto permite especificar una fuente personalizada que se descarga desde nuestra web:

@font-face {   
  font-family: "Kimberley";   
  src: url(http://www.princexml.com/fonts/larabie/ »   
  kimberle.ttf) format("truetype");   
}

h1 { font-family: "Kimberley", sans-serif; }

La idea no es nueva y ya recuerdo hace tiempo un intento parecido por parte de Internet Explorer 5.5/6 que no llego a buen puerto, además en anteriores versiones de CSS se incorporó y posteriormente eliminó (por problemas) la propiedad @font-face.

También existen asuntos legales ya que muchas fuentes no son libres y su uso en sitios web puede dar dolores de cabeza por cuestiones de copyright.

El hecho de que sea vía CSS sin duda ayudará a que aumente la uniformidad entre plataformas y poder ver diseños más vistosos. Aunque es posible que en un par de años veamos entradas de "recomendaciones" tipo: "no abuses de @font-face" o "no pongas fuentes de más de 20KB" al igual que ya pasó con (el abuso de) AJAX.

De momento la propiedad no está soportada por la mayoría de navegadores, incluyendo Mozilla Firefox ni Internet Explorer así que toca esperar (y rezar)...

PD: mi bola de cristal también dice que sacarán entradas de trucos para eliminar de $tu-navegador-favorito el soporte de @font-face para evitar atentados al buen gusto (¿alguien dijo Comic Sans con esteroides?).

Comentarios