Skip to content

Esta traducción aún no ha sido revisada editorialmente. La versión alemana es la vinculante. Deutsche Fassung →

Barrierefreiheit

¿Por qué deben estar bien marcados los encabezados y tablas en el código?

Los encabezados y tablas deben estar bien marcados en el código porque lectores de pantalla y motores de búsqueda solo reconocen la estructura de una página por ello. Un visitante que ve reconoce de un vistazo qué es encabezado y qué es cabecera de tabla — un visitante ciego y Google solo se enteran si también está nombrado en el código. El texto en negrita no es un encabezado.

Estructura en el código: el índice del sitio

Los lectores de pantalla ofrecen a los visitantes ciegos un atajo: saltar de encabezado en encabezado, como se revisa rápidamente un índice. Esto solo funciona si los encabezados están marcados en el código como tales — con niveles de H1 a H6, como capítulos y subcapítulos. Si el marcado salta de H1 directamente a H4, es como un libro donde después del capítulo 1 sigue inmediatamente la subsección 1.1.1.1: el visitante se pregunta qué se ha perdido. Con las tablas ocurre lo mismo: solo si el encabezado está marcado como tal puede el lector de pantalla decir a cada número a qué columna pertenece. También Google usa esta estructura para entender sus contenidos.

Así verifica nuestro núcleo la estructura de la página

La verificación automática combina dos herramientas. La herramienta de comprobación axe-core examina listas, listas de descripción y las conexiones técnicas entre elementos. Además, pasos de comprobación propios verifican dos puntos que axe-core no cubre en su ejecución estándar: niveles de encabezado saltados — por ejemplo H1 seguido directamente de H4 — y tablas de datos sin una sola celda de encabezado marcada. Ambos son incumplimientos documentables y fluyen en el informe como tales. Importante para la clasificación: este criterio es tan amplio que una ejecución automática sin novedades nunca cuenta como «aprobado» en nosotros — el informe la señala como «revisar manualmente», y en el estándar oro una persona valida la estructura.

Estructura limpia paga directamente a Google

El mismo marcado que permite a los visitantes ciegos saltar también ayuda a su capacidad de búsqueda: Google pondera los encabezados al clasificar una página y muestra contenidos bien estructurados con mayor probabilidad como respuesta destacada en resultados. Una página con exactamente un encabezado principal, subencabezados lógicamente escalonados y listas verdaderas se lee para el motor de búsqueda como un documento bien organizado. Por el contrario, una página cuyos «encabezados» son solo texto en negrita pierde esta señal completamente — para la máquina es texto ordinario sin peso.

Beispiele

Überschrift als fetter Text

Verstoß
<p><strong style="font-size:24px">Öffnungszeiten</strong></p>
<p>Montag bis Freitag 8–16 Uhr</p>
Erfüllt
<h2>Öffnungszeiten</h2>
<p>Montag bis Freitag 8–16 Uhr</p>

Nur ein echtes h-Element erscheint in der Überschriftenliste des Vorleseprogramms.

Datentabelle ohne Kopfzellen

Verstoß
<table>
  <tr><td>Tarif</td><td>Preis</td></tr>
  <tr><td>Basis</td><td>9 €</td></tr>
</table>
Erfüllt
<table>
  <caption>Tarife</caption>
  <thead><tr><th scope="col">Tarif</th><th scope="col">Preis</th></tr></thead>
  <tbody><tr><td>Basis</td><td>9 €</td></tr></tbody>
</table>

Mit th und scope sagt das Vorleseprogramm zu jeder Zelle, zu welcher Spalte sie gehört.

  • Pida a su agencia una descripción de los niveles de encabezado de sus páginas más importantes — los pasos deben ser ininterrumpidos como un índice.
  • Verifique sus tablas: cada tabla de datos necesita una primera fila o columna marcada como encabezado.
  • Reemplace el texto en negrita que sirve como encabezado con verdaderos encabezados en el sistema de edición.
  • Use la función de lista en el sistema de edición en lugar de escribir viñetas a mano.
  • Asigne exactamente un encabezado principal por página que nombre el tema de la página.

Deutsche Fassung dieser Seite