La arquitectura de la información y las interfaces humanas
Nos proponemos, a partir de un documento HTML 5 vacío, agregar contenidos ficticios y elaborar: primero una arquitectura de información jerárquica básica que organice la sintaxis, luego agregarle elementos de interfaz que hagan posible una navegación mínima, enriquecer esa interfaz para mejorar la experiencia del usuario, y darle adaptabilidad para diferentes dispositivos y medios a través de la creación de estilos CSS.
Un documento básico de HTML se compone de los elementos que se muestran debajo:
<html>
<head>
<meta charset="UTF-8">
<title>Taller Multimedia</title>
</head><body>
Ejemplo
</body>
</html>
El documento HTML elemental
Título de mi artículo
Subtítulo
El documento HTML organizado
- Elementos estructurales básicos:
- Todo lo que queda encerrado entre <h1> y </h1> es un título de tipo 1, es decir, el de máxima jerarquía; se espera que en una página cualquiera sólo haya un único titular de tipo 1 para mantener la consistencia semántica.
- Todo lo que queda encerrado entre <h2> y </h2> es un título de tipo 2, es decir, el segundo en jerarquía; en una página pueden aparecer varios titulares de tipo 2 y, por lo general, se van a limitar a encabezar secciones o artículos.
- Todo lo que queda encerrado entre <p> y </p> es un párrafo convencional de texto, es decir, una frase, oración o un conjunto de frases y oraciones que deberían tener un significado específico; los párrafos, por definición, deberían ser completos y comprensibles con independencia del contexto.
- Elementos contextuales de notación secundaria (formato):
- Todo lo que queda encerrado entre <em> y </em> es contenido enfatizado, no ya una estructura de información, sino una notación secundaria que mejora la comprensibilidad del sentido del texto al introducir un cambio formal visual que concede énfasis al fragmento que queda dentro de las etiquetas.
- Todo lo que queda encerrado entre <strong> y </strong> es contenido importante o fuerte, no ya una estructura de información, sino una notación secundaria que mejora la comprensibilidad del sentido del texto al introducir un cambio formal visual que concede importancia al fragmento que queda dentro de las etiquetas.
Como puede observarse en el código HTML, las etiquetas pueden anidarse: en el ejemplo, la etiqueta p anida al párrafo y a la notación secundaria de éste (lo que está etiquetado por em y strong), y al mismo tiempo existe una etiqueta em que anida a una etiqueta strong para combinar ambos formatos.
El documento HTML enriquecido
El lenguaje de marcado de hipertexto (HTML) hace posible la organización semántica de la información mediante el uso de elementos jerárquicos, de notación primaria (elementos de estructura), secundaria (formato) y el enriquecimiento a través de la incorporación de atributos.
