Agencia Interactiva

En Techlosofy comentan algunos de los cambios que va a traer la nueva versión de HTML, donde se va a ver un cambio importante para adaptar el lenguaje a las necesidades de la web semántica que está pegando con tanta fuerza desde hace un tiempo.

Y es que ya le tocaba al HTML actualizarse, porque desde 1999 tenemos la versión 4.0. Y 8 años sin cambios son una eternidad en la Web, así que habrá que esperar impacientes las modificaciones que HTML 5 va a incluir. En Techlosofy comentan algunas:

Nuevos elementos estructurales

Estos nuevos elementos van a dar mucho juego, por ejemplo a la hora de ver el código fuente de un blog, ya no será lo mismo. Muchos elementos div, cuyo identificador era muy común repetir, ahora tienen su propio elemento HTML5:

• section: Puede ser un capítulo, una sección de un capítulo o básicamente cualquier cosa que incluya su propio encabezamiento.
• header: La cabecera de una página. No confundir con el elemento head
• footer: El final de la página.
• nav: Una colección de links a otras páginas
• article: Una entrada independiente en un blog, revista, etc.

Acercándose a la web semántica

Estos nuevos elementos nos harán dar un paso más hacia la web semántica. Algunas páginas de hecho podrán cambiar del todo su código para incluir estas novedades:

• aside: Es un bloque semántico que representa una nota, un consejo una explicación….
• figure: Se utilizará para representar una imagen
• dialog: Se utilizará para representar una conversación entre varias personas
• time: Se utilizará para marcar un momento temporal en una historia
• meter: Se utilizará para indicar ciertas medidas dependiendo de los atributos
• progress: Representará el estado de cierto proceso
• video: Siempre sabremos que entre estas etiquetas hay un video
• audio: En este caso un archivo de audio
• details: Más detalles sobre alguna cosa
• datagrid: Una tabla, una recopilación de datos formateados
• menu: Un listado, un menu….

El listado está basado en una web alemana que ha recopilado las mejores 100 tipografías o fuentes de la historia.

Es difícil puntuar o valorar una tipografía, por lo que han hecho una tabla de valores y han puntuado con los siguientes criterios:

1. Cifras de ventas: 40%
2. Valor histórico / Significado: 30%
3. Cualidades estéticas: 30%

Cabe recalcar que las fuentes que se han juzgado son fuentes de pago o de uso bajo licencia, por lo que fuentes como las que vienen por defecto en sistemas operativos o fuentes gratuitas no se han tenido en cuenta.

Las 100 mejores fuentes de la historia
(Nombre de la fuente [año de creación - nombre del diseñador])

1. Helvetica [1957 - Max Miedinger]
2. Garamond [1530 - Claude Garamond]
3. Frutiger [1977 - Adrian Frutiger]
4. Bodoni [1970 - Giambattista Bodoni]
5. Futura [1927 - Paul Renner]
6. Times [1931 - Stanley Morison]
7. Akzidenz Grotesk [1966 - G nter Gerhard Lange]
8. Officina [1990 - Erik Spiekermann]
9. Gill Sans [1930 - Eric Gill]
10. Univers [1954 - Adrian Frutiger]
...

Acabo de descubrir una herramienta parecida a typetester, que al igual que la anterior sirve para probar online cómo queda una tipografía determinada modificando sus características principales, a la vez que te devuelve el código CSS necesario para implementarla en tu web.

Como digo la idea es muy similar, ingresas un texto y vas modificando opciones como el tamaño de fuente, color, espacio entre caracteres, alineación, etc. y te muestra a un lado el resultado final y al otro el código CSS necesario. La diferencia con typetester es que csstypeset es más sencilla de usar (tiene menos opciones también), sus controles son más gráficos y de un vistazo ya sabes para que sirve cada uno. Como contrapunto, no permite tanto control sobre las tipografías como typetester y tiene menor número de ellas.