Diseño web en Puerto Vallarta
1.2.1 Encabezamientos de sección
Puntos de verificación en esta sección:
3.5 Utilice elementos de encabezado para transmitir la estructura lógica y utilícelos de acuerdo con la especificación. [Prioridad 2]
Diseño web en Puerto Vallarta Los documentos largos se suelen dividir en una serie de capítulos, los capítulos tienen apartados, los apartados se dividen en distintas secciones, las secciones en párrafos, etc. Estos trozos semánticos de información constituyen la estructura del documento. Las secciones deberían iniciarse con los elementos de encabezamiento HTML (H1-H6). Otras etiquetas pueden complementar estos diseño web
elementos para mejorar la presentación (por ejemplo, el elemento HR para crear una línea divisoria horizontal), pero la presentación visual no es suficiente para identificar las secciones de un documento. Puesto que algunos usuarios ojean un documento navegando sus encabezamientos, es importante usarlos apropiadamente para expresar correctamente la estructura del documento. Los desarrolladores deberían ordenar los elementos de encabezamiento de forma apropiada. Por ejemplo, en HTML, los elementos H2 deberían seguir a los elementos H1, los H3 deberían seguir a los elementos H2, etc. Los desarrolladores de contenido no deberían «saltarse» niveles (por ejemplo, pasar directamente de H1 a H3). No utilice encabezamientos para crear efectos de fuentes. Use hojas de estilo para cambiar los estilos de fuentes, por ejemplo. Observe que en HTML, los elementos de encabezamiento (H1 – H6) sólo inician secciones y no las contienen como contenido del elemento. El siguiente etiquetado HTML muestra cómo pueden usarse las hojas de estilo para controlar la presentación de un encabezamiento y el contenido que sigue: Ejemplo. Diseño web en Puerto Vallarta
<HEAD>
<TITLE>Técnicas de cocina</TITLE>
<STYLE type=»text/css»> /* Sangra el encabezamiento y el contenido siguiente */ DIV.section2 { margin-left: 5% } </STYLE>
</HEAD>
<BODY>
<H1>Técnicas de cocina</H1> … algún texto aquí ..
<DIV class=»sección2″>
<H2>Cocinar con aceite</H2> … texto para esta sección …
</DIV>
<DIV class=»sección2″>
<H2>Cocinar con mantequilla</H2> … texto para esta sección …
</DIV>