2526UFV2.4.3-A-001

De WCAG Wiki
Revisión del 18:36 11 ene 2026 de 202526UFV16 (discusión | contribs.) (Página creada con «{{ActividadWCAG |id_criterio=2.4.3 - Orden de enfoque (Nivel: A) |id_subcriterio=2.4.3-A |id_universidad=UFV |curso_academico=2025-26 |enlace=https://wikiwcag.udl.cat/Principio_2/2.4_Navegable/2.4.3-A |noa_barrera_evidencia_html=<nowiki> <h2>Checkout</h2> <label>Name</label> <input type="text" tabindex="2"> <label>Address</label> <input type="text" tabindex="3"> <button tabindex="1">Pay now</button> </nowiki> |noa_barrera_explicacion=The Tab order goes to…»)
(difs.) ← Revisión anterior | Revisión actual (difs.) | Revisión siguiente → (difs.)

Edición de la página como formulario

1. Información básica

Id del criterio: 2.4.3 - Orden de enfoque (Nivel: A)
Título del subcriterio: 2.4.3-A
Universidad participante: UFV
Curso académico: 2025-26

Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/Principio_2/2.4_Navegable/2.4.3-A



2. Ejemplos prácticos

2.1. Ejemplo NO accesible

2.1.1. Evidencia en imagen y enlace:
a) Imagen
No se ha subido ninguna imagen.

b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.

2.1.2. Código HTML:

<h2>Checkout</h2> <label>Name</label> <input type="text" tabindex="2"> <label>Address</label> <input type="text" tabindex="3"> <button tabindex="1">Pay now</button>



Explicación del problema detectado:
The Tab order goes to “Pay now” first (tabindex=1) before the inputs, which is not logical for completing a checkout form. This can confuse keyboard users and make operation harder.

Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Keyboard-only users may reach actions before entering required information, causing mistakes, backtracking, and confusion about the intended workflow.


2.2. Ejemplo Accesible

2.2.1. Evidencia de imagen:
a) Imagen
No se ha subido ninguna imagen.
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.


2.2.2 Código HTML:

<h2>Checkout</h2> <label for="name">Name</label> <input id="name" type="text"> <label for="address">Address</label> <input id="address" type="text"> <button>Pay now</button>



Explicación de la solución aplicada:
The focus order follows the meaningful sequence of the form: name → address → submit. This preserves meaning and supports keyboard operation.