Ver el código de «Principio 3/3.2 Predecible/3.2.2-A»

{{CriterioWCAG
|id_wcag_criterio=3.2.2
|id_wcag_subcriterio=3.2.2-A
|wcag_titulo_criterio=3.2.2-A. Al recibir entradas
|wcag_nivel=A
|wcag_version=2.0
|wcag_principio=3_Comprensible
|wcag_principio_url=Principio_3
|wcag_pauta=3.2_Predecible
|wcag_pauta_url=Principio_3/3.2_Predecible
|wcag_grupo=Comportamiento
|wcag_subgrupo=Cambios_de_contexto
|wcag_subcriterio_url=Principio_3/3.2_Predecible/3.2.2-A

|wcag_texto_criterioOAW=
No se debe provocar ningún cambio de contexto cuando se cambia el estado, configuración o valor de cualquier elemento de interacción, a menos que se haya avisado previamente a los usuarios.

|wcag_descripcion_resumida=
Modificar un campo o activar un control no debe desencadenar automáticamente cambios importantes —como enviar formularios, redirigir o abrir paneles— sin aviso previo.

|wcag_objetivo=
Garantizar interacciones predecibles, evitando que usuarios pierdan el contexto o interrumpan tareas al introducir información o cambiar un control.

|wcag_importancia=
Evita desorientación, pérdida de progreso y errores de navegación, especialmente en usuarios de teclado, lectores de pantalla o con dificultades cognitivas.

|wcag_referencias=
<ul>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/on-input.html Understanding Success Criterion 3.2.2: On Input]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/quickref/#on-input WCAG Quick Reference – 3.2.2]</span></li>
<li>[https://webaim.org/techniques/forms/ WebAIM — Predictable Forms]</li>
</ul>

|wcag_recursos=
<ul>
<li>Evitar auto-submit sin confirmación</li>
<li>Diseño de formularios accesibles y predecibles</li>
</ul>

|wcag_tipo_evaluacion=Manual

|wcag_pasos_evaluacion=
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Modificar valores en controles (select, radio, checkbox, sliders, inputs).</li>
<li><span class="paso-badge">Paso 2.</span> Confirmar que no ocurre envío automático, redirección o apertura inesperada.</li>
<li><span class="paso-badge">Paso 3.</span> Revisar código en busca de <code>onchange</code>, <code>oninput</code>, auto-submit o navegación automática.</li>
<li><span class="paso-badge">Paso 4.</span> Si existe acción automática, comprobar aviso claro previo.</li>
</ol>

|wcag_resultado_evaluacion=
Los cambios en controles no provocan cambios inesperados; si los hay, existe aviso previo.

|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
<strong>✅ Interacción predecible sin auto-cambio</strong>
<pre class="wcag-codigo-html">
<label for="country">País</label>
<select id="country" name="country">
  <option>España</option>
  <option>México</option>
  <option>Argentina</option>
</select>
<button type="submit">Continuar</button>
</pre>
</div>

<div class="accessibility-card">
<strong>✅ Auto-acción avisada previamente</strong>
<pre class="wcag-codigo-html">
<p>Al seleccionar un idioma, la página se actualizará automáticamente.</p>
<label for="lang">Idioma</label>
<select id="lang" name="lang" onchange="location=this.value;">
  <option value="/es">Español</option>
  <option value="/en">Inglés</option>
</select>
</pre>
</div>

|wcag_otras_herramientas_evaluacion=
<ul>
<li>Pruebas manuales en formularios</li>
<li>Inspección de eventos en DevTools</li>
<li>Lectores de pantalla: NVDA, JAWS, VoiceOver</li>
</ul>
}}