HTML Heading Hierarchy Checker

Cómo usar esta herramienta para desarrolladores

1. Pega el HTML.
2. Pulsa “Comprobar jerarquía”.
3. Revisa cada incidencia con posición y texto.

Qué hace esta herramienta para desarrolladores

Extrae h1–h6 en orden y aplica reglas prácticas de jerarquía: primer encabezado, saltos superiores a un nivel y recuento de h1.

Las recomendaciones son heurísticas de estructura; el contexto editorial y el patrón de componentes pueden justificar variantes.

Ejemplo

Entrada:

<article>
<h1>Manual</h1>
<h3>Instalación</h3>
<h2>Configuración</h2>
</article>

Ejecuta la herramienta para obtener un resultado coherente con este contenido.

Casos de uso

• QA de plantillas
• Auditoría de accesibilidad
• Revisión SEO on-page
• Control editorial

Consejos para obtener resultados fiables

• Evita saltar de h1 a h3 sin un h2 lógico.
• No uses headings solo para aplicar estilos.
• Comprueba componentes repetidos dentro del contexto completo.
• Prueba la navegación por encabezados con lector de pantalla cuando sea relevante.

Detalles del procesamiento

Un salto como h2 → h4 se marca como incidencia. Bajar de h4 a h2 no se considera por sí mismo un error porque puede cerrar subsecciones. Extrae h1–h6 en orden y aplica reglas prácticas de jerarquía: primer encabezado, saltos superiores a un nivel y recuento de h1.

Las recomendaciones son heurísticas de estructura; el contexto editorial y el patrón de componentes pueden justificar variantes.