14-junio-2012
admin

Incrustación de fuentes con CSS3

CSS3 tiene la capacidad de embeber las fuentes dentro de la página web. Esto abre a un gran abanico de tipografías y evita las restricciones de las propias fuentes que vienen definidas en el estándar de CSS.

Se debe tener en cuenta que para que la fuente sea compatible con todos los navegadores se debe añadir la fuente en diferentes formatos:
.TTF o .OTF – la mayoría de los navegadores admiten estos tipos.
.EOT – Microsoft creó hace unos años este formato. El problema es que solo se visualizan con internet explorer. Lo bueno, es que es compatible desde IE4.
.SVG – Para otros navegadores como opera o safari (incluida su visualización en el iphone o el ipad)
.WOFF (Web Open Font Format) – Soportado hasta ahora por Firefox y Opera por el resto en futuras versiones.

@font-face {
     font-family: "MiFuente";
     src: url('Chunkfive.eot');
     src: local('ChunkFive'),local('ChunkFive'),
          url('Chunkfive.woff') format('woff'),
          url('Chunkfive.otf') format('opentype'),
          url('Chunkfive.svg#ChunkFive') format('svg');
}

Para conseguir fuentes hay una gran variedad de recursos por la red donde encontrarlas p.e. Google Font Directory. Además, hay aplicaciones online que permiten convertir p.e. una fuente en formato TTF a cualquier otro formato en Font2Web.

Dejar un comentario

Categorias

Linkedin