TL;DR (Too Long; Didn’t Read... o básicamente: mucho texto, dame el resumen rápido)
Darle negrita y un tamaño de letra gigante a un <p> o <div> no lo convierte en un título. Para las tecnologías asistivas, seguirá siendo un párrafo ordinario, y será excluido de la lista de navegación rápida (el índice mental del ciego).
La primacía de la semántica sobre el estilo
La WCAG 1.3.1 establece que la estructura y las relaciones transmitidas visualmente deben poder determinarse programáticamente. Un error gravísimo de los maquetadores es evadir los márgenes predeterminados de <h2> usando etiquetas genéricas con CSS para pintar un subtítulo. Esto es equivalente a imprimir un libro sin índice.
El patrón erróneo: Código Accesible Deficiente
Para el ojo humano es una nueva sección, pero para el código es simplemente más texto genérico y fluido, sin punto de anclaje.
<!-- MAL: Simulación visual sin semántica -->
<p style="font-size: 24px; font-weight: bold;">
Requisitos del Trámite
</p>
<p>Para continuar, debe presentar...</p>La Solución Accesible: Código Recomendado
Usar estrictamente las etiquetas <h1> a <h6> para seccionar el contenido, y sobreescribir sus estilos predeterminados con CSS si el diseño lo exige.
<!-- BIEN: Semántica pura que alimenta el índice del Lector de Pantalla -->
<h2 class="title-custom-style">
Requisitos del Trámite
</h2>
<p>Para continuar, debe presentar...</p>Metodología de Verificación y Testing
Pruebas Manuales con Lectores de Pantalla
Con NVDA, presionar H para saltar entre encabezados. Verificar que la jerarquía sea lógica y secuencial (h1 → h2 → h3), sin saltos de nivel. En VoiceOver (macOS), usar el Rotor (VO+U) y seleccionar "Encabezados" para listar la estructura completa del documento.
Inspección del Árbol de Accesibilidad
En Chrome DevTools, seleccionar el elemento afectado en el panel Elements, luego abrir la pestaña Accessibility. Verificar que las propiedades Role, Name y State reflejen correctamente la intención del componente según el criterio WCAG 1.3.1.
Herramientas Automatizadas
Ejecutar Axe DevTools: las reglas relacionadas con estructura (ej: list, listitem, landmark-*) son altamente confiables para detectar violaciones del Criterio 1.3.1. Complementar con el validador HTML del W3C para errores de modelo de contenido.
