Grado y Máster de Multimedia Universitat Oberta de Catalunya
Diseño de Interfaces Grado y Máster de Multimedia

Especificaciones técnicas de diseño para web

WebFonts

El formato web Open Font (WOFF) es un formato de fuentes tipográficas orientado a su utilización en sitios web. Se desarrolló en el 2009, como resultado de un proceso de estandarización del uso de fuentes, siguiendo una recomendación del World Wide Web Consortium (W3C). El objetivo del W3C es que WOFF se convierta en el formato único e interoperativo para todos los navegadores web.

El formato WOFF también se conoce popularmente como WebFonts.

La página de FontShop dedicada a las WebFonts explica con mucha claridad las características de este formato. A continuación, se ofrece un extracto de su contenido, aunque se recomienda leerlo todo:

La mayoría de fuentes se habían diseñado hasta el momento para entornos de impresión o para ser incluidas en una imagen o en un PDF. Las WebFonts, en cambio, están optimizadas para su uso en páginas web, utilizando la regla CSS @ font-face. Mediante esta regla, las fuentes son enlazadas en la página web, y son descargadas por los navegadores, de modo que cualquiera que visite la página puede ver las fuentes declaradas por el diseñador de la página. Eso significa que el sitio web puede mostrar texto indexable, editable, escalable y dinámico, en una fuente diferente de las web seguras en las que los diseñadores web han tenido que basarse durante años. 

Lecturas recomendadas:


CSS3

Las hojas de estilo en cascada (cascading style sheets o CSS) son un formato aprobado por el World Wide Web Consortium (W3C), que trabaja con documentos HTML utilizando una sintaxis sencilla y varias propiedades de estilo.

Hasta ahora, se habían desarrollado las versiones CSS1 y CSS2, pero a principios del año 2010 aparece CSS3, que permite incorporar propiedades de formato más sofisticadas que las anteriores, lo que permite que el diseñador web disponga de más flexibilidad al preparar la interfaz gráfica de un sitio web.

Algunas de las características más destacadas de CSS3 son las siguientes:

  • esquinas redondeadas;
  • fuentes con nuevos atributos (por ejemplo, con degradados);
  • generación de efectos de sombra;
  • máscaras para imágenes, directamente especificadas desde CSS;
  • páginas con múltiples columnas de contenido;
  • configuración más detallada de las características del texto;
  • control del grado de opacidad de los elementos.

La mayoría de navegadores soportan CSS3.

Lecturas recomendadas: