Diferencia entre revisiones de «Principio 2/2.2 Tiempo Suficiente/2.2.1-C»

De WCAG Wiki
← Edición anteriorEdición siguiente →
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
Línea 4: Línea 4:
|wcag_titulo_criterio=2.2.1-C. Actualizaciones automáticas con control del usuario
|wcag_titulo_criterio=2.2.1-C. Actualizaciones automáticas con control del usuario
|wcag_nivel=A
|wcag_nivel=A
|wcag_version=2.2
|wcag_version=2.0
|wcag_principio=2_Operable
|wcag_principio=2_Operable
|wcag_principio_url=Principio_2
|wcag_principio_url=Principio_2
Línea 38: Línea 38:
   <span class="discapacidad-texto">[[:Categoría:Discapacidad auditiva|Auditiva]]</span> –
   <span class="discapacidad-texto">[[:Categoría:Discapacidad auditiva|Auditiva]]</span> –
   <span class="gravedad gravedad-leve">Barrera leve</span>
   <span class="gravedad gravedad-leve">Barrera leve</span>
</li>
<li class="discapacidad-item">
  [[Archivo:sordoceguera.png|20px|class=icon-discapacidad|alt=Discapacidad sordoceguera]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad sordoceguera|Sordoceguera]]</span>
  –
  <span class="gravedad gravedad-grave">Barrera grave</span>
</li>
</li>


Línea 46: Línea 52:
[[Categoría:Discapacidad baja visión]]
[[Categoría:Discapacidad baja visión]]
[[Categoría:Discapacidad auditiva]]
[[Categoría:Discapacidad auditiva]]
[[Categoría:Discapacidad sordoceguera]]


|wcag_texto_criterioOAW=
|wcag_texto_criterioOAW=
Sólo deben existir actualizaciones automáticas de todo el contenido de la página (como recargas vía <code>&lt;meta refresh&gt;</code>) si se proporcionan herramientas para detener, extender o ajustar dicho límite de tiempo. Si no se permite al usuario controlar el refresco automático, éste no debe producirse.
Sólo deben existir actualizaciones automáticas <meta> de todo el contenido de la página si se proporcionan herramientas para detener, extender o ajustar el límite de tiempo.


|wcag_descripcion_resumida=
|wcag_descripcion_resumida=
Línea 61: Línea 69:
|wcag_referencias=
|wcag_referencias=
<ul>
<ul>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/timing-adjustable.html Understanding Success Criterion 2.2.1]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/failures/F41 F41: Failure of Success Criterion 2.2.1, 2.2.4, and 3.2.5 due to using meta refresh to reload the page]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/quickref/#timing-adjustable WCAG Quick Reference — 2.2.1]</span></li>
<li><span lang="en">[https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta MDN — Meta refresh]</span></li>
</ul>
</ul>


|wcag_recursos=
|wcag_recursos= No hay
<ul>
<li>[https://wave.webaim.org/ WAVE Evaluation Tool]</li>
<li>[https://accessibilityinsights.io/ Accessibility Insights]</li>
<li>[https://developer.mozilla.org/ MDN Web Docs]</li>
</ul>


|wcag_tipo_evaluacion=Semiautomática
|wcag_tipo_evaluacion=Manual


|wcag_pasos_evaluacion=
|wcag_pasos_evaluacion=
<ol class="paso-list">
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Inspeccionar si existen <code>&lt;meta http-equiv="refresh"&gt;</code> o scripts como <code>location.reload()</code> o <code>setTimeout()</code>.</li>
<li><span class="paso-badge">Paso 1.</span>
<li><span class="paso-badge">Paso 2.</span> Confirmar si la actualización ocurre automáticamente sin intervención del usuario.</li>
Usando la herramienta de inspección de código del navegador, localizar si existen actualizaciones automáticas mediante etiquetas <code>&lt;meta&gt;</code>.
<li><span class="paso-badge">Paso 3.</span> Verificar que se proporcione opción para detener, posponer o desactivar la actualización automática.</li>
</li>
<li><span class="paso-badge">Paso 4.</span> Comprobar que la actualización no interrumpe el foco ni el contenido en lectura.</li>
 
<li><span class="paso-badge">Paso 5.</span> Testear con lector de pantalla para asegurar que no hay pérdida de contexto.</li>
<li><span class="paso-badge">Paso 2.</span>
Verificar que se ofrece algún medio para detener, extender o ajustar el límite de tiempo asociado a dichas actualizaciones.
</li>
</ol>
</ol>


|wcag_resultado_evaluacion=
|wcag_resultado_evaluacion=
Línea 89: Línea 93:
|wcag_ejemplo_evaluacion=
|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
<div class="accessibility-card">
<strong>✅ Accesible</strong>
La pagina se actualiza cada 60 segundos, pero el usuario puede parar la actualización.
<pre class="wcag-codigo-html">
<pre class="wcag-codigo-html">
<p>La página se actualiza cada 60 segundos.</p>
<p>La página se actualiza cada 60 segundos.</p>
Línea 100: Línea 104:
</div>
</div>


<div class="accessibility-card-error">
<strong>❌ No accesible</strong>
<pre class="wcag-codigo-html">
<meta http-equiv="refresh" content="30">
</pre>
</div>
<div class="accessibility-card">
<strong>✅ Alternativa accesible</strong>
<pre class="wcag-codigo-html">
<p>Contenido actualizado. Haz clic para refrescar.</p>
<button onclick="location.reload()">Actualizar contenido</button>
</pre>
</div>


|wcag_otras_herramientas_evaluacion=
|wcag_otras_herramientas_evaluacion=
<ul>
<ul>
<li>Inspector del navegador (buscar meta refresh y timers)</li>
<li>'''Inspección del navegador''': buscar actualizaciones automáticas del contenido realizadas mediante etiquetas <code>&lt;meta&gt;</code> (p. ej. <code>meta refresh</code>) o scripts que recargan la página o fragmentos sin interacción del usuario.</li>
<li>Pruebas con JAWS, NVDA, VoiceOver</li>
<li>'''Prueba funcional''': comprobar si la página se actualiza sola y verificar que el usuario dispone de mecanismos para detener, pausar, extender o controlar el ritmo de actualización.</li>
<li>Validadores HTML</li>
<li>'''Herramientas de desarrollo''': usar DevTools (Network/Performance) para detectar recargas automáticas, peticiones periódicas o temporizadores (<code>setInterval</code>, <code>setTimeout</code>).</li>
<li>'''Tecnologías de apoyo''': (NVDA, JAWS, VoiceOver) confirmar que las actualizaciones no interrumpen la lectura ni mueven el foco de manera inesperada y que los controles para gestionarlas son accesibles.</li>
</ul>
</ul>
}}
}}

Revisión del 14:48 5 nov 2025

2.2.1-C. Actualizaciones automáticas con control del usuario

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • Sólo deben existir actualizaciones automáticas <meta> de todo el contenido de la página si se proporcionan herramientas para detener, extender o ajustar el límite de tiempo.

Comprensión del criterio

Descripción resumida

Las páginas que se actualizan automáticamente (ej., mediante meta refresh o scripts) deben ofrecer controles para desactivar, pausar o ajustar la frecuencia de actualización.

Objetivo

Evitar que los usuarios pierdan información, foco o contexto debido a recargas automáticas, especialmente quienes necesitan más tiempo para leer, quienes usan lectores de pantalla o tecnologías de apoyo.

Importancia de cumplir el criterio

Las actualizaciones automáticas pueden interrumpir tareas, causar pérdida de datos y generar desorientación, afectando especialmente a personas con discapacidad cognitiva, visual o motriz.

Referencias WCAG

Recursos de apoyo

No hay

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Usando la herramienta de inspección de código del navegador, localizar si existen actualizaciones automáticas mediante etiquetas <meta>.
  2. Paso 2. Verificar que se ofrece algún medio para detener, extender o ajustar el límite de tiempo asociado a dichas actualizaciones.

Resultado esperado

El usuario puede detener o ajustar la actualización automática, o la página no se actualiza automáticamente.

Ejemplo

La pagina se actualiza cada 60 segundos, pero el usuario puede parar la actualización. 

<p>La página se actualiza cada 60 segundos.</p>
<button id="pause">Detener actualización</button>
<script>
let autoRefresh=setInterval(()=>{location.reload()},60000);
document.getElementById('pause').addEventListener('click',()=>clearInterval(autoRefresh));
</script>

Otras herramientas de evaluación

  • Inspección del navegador: buscar actualizaciones automáticas del contenido realizadas mediante etiquetas <meta> (p. ej. meta refresh) o scripts que recargan la página o fragmentos sin interacción del usuario.
  • Prueba funcional: comprobar si la página se actualiza sola y verificar que el usuario dispone de mecanismos para detener, pausar, extender o controlar el ritmo de actualización.
  • Herramientas de desarrollo: usar DevTools (Network/Performance) para detectar recargas automáticas, peticiones periódicas o temporizadores (setInterval, setTimeout).
  • Tecnologías de apoyo: (NVDA, JAWS, VoiceOver) confirmar que las actualizaciones no interrumpen la lectura ni mueven el foco de manera inesperada y que los controles para gestionarlas son accesibles.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 2.2.1-C. Actualizaciones automáticas con control del usuario

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_2/2.2_Tiempo_Suficiente/2.2.1-C&oldid=3514»