viernes, 28 de agosto de 2020

Importancia de los encabezados en la accesibilidad

orden de encabezados en una web

H1 es una etiqueta que sirve para colocar la frase que indica el título del contenido de una página web. Importante en este punto delimitar de forma clara la diferencia entre sitio web y página web: un título H1 debe hacer referencia a una página de tu sitio web, y no al sitio web en general.
Google no reconoce por el momento textos en imágenes, por lo que hacer que tu H1 sea una imagen no es en absoluto una buena idea. Si no queda otro remedio que utilizar imágenes, vuelve a pensar si realmente no puedes hacerlo en texto. Si pese a todo decides utilizar imágenes para un titular, asegúrate de que esta imagen tenga un texto alternativo. Si ese titular está enlazado, deberías añadir también el atributo Title a la etiqueta A para indicar el contenido de la misma.
Un H1 no debería en principio ir enlazado a otros documentos, pues su contenido debería ser importante únicamente para el documento que estamos viendo. Si colocamos un enlace en ese H1, vamos a indicar inconscientemente que la página importante para ese título es a la que enlazamos, y no la página actual.
H2 es un elemento similar al H1, que indica títulos de importancia para subsecciones del documento web actual. Por su naturaleza, puede haber varios H2 en un sitio, que indiquen los diferentes títulos de importancia de la página en la que nos encontramos.
H2 marca las diferentes secciones de un texto, los títulos de los nodos accesibles desde un listado de elementos, etcétera. Su texto debe cumplir las mismas directrices que las dadas para el H1, pero sus palabras clave deben hacer referencia al texto que encontramos justo a continuación, o en la página a la que enlazan. No existe un número determinado de elementos H2 que pueden colocarse en una página, pero el contenido debe ser el que marque este requerimiento. Entre 2 y 8 titulares H2 son lo más adecuado, aunque pueden no aparecer o presentarse en un número mayor si la longitud del texto lo requiere.
H3 en adelante nos permiten definir títulos de subapartados de un bloque encabezado con un H2. Su incidencia en SEO es más limitada, y por ello no es habitual ni recomendable el trabajar los titulares a partir de H4.

Opción para incorporar una imagen a un titular es colocar la imagen de fondo del H1, e incorporar un padding a esta etiqueta que haga que el texto quede fuera de la zona de visión. Es algo que funciona visualmente, pero de nuevo insisto en que no es en absoluto aconsejable el jugársela con estas tácticas en el elemento más importante de nuestro documento.

No hay comentarios:

Publicar un comentario