Diferencia entre revisiones de «Principio 2/2.2 Tiempo Suficiente/2.2.2-B»
De WCAG Wiki
Página creada con «== '''2.2.2 B-Las actualizaciones parciales del contenido que se realizan de forma automática (p. ej. un ticker de noticias o con información de última hora) deben disponer de un mecanismo que permite a los usuarios pausarlas, detenerlas u ocultarlas, o bien controlar la frecuencia de la actualización''' == '''A) EJEMPLO ACCESIBLE:''' '''B) EJEMPLO NO ACCESIBLE:'''» |
Sin resumen de edición |
||
| (No se muestran 3 ediciones intermedias del mismo usuario) | |||
| Línea 1: | Línea 1: | ||
== | {{CriterioWCAG | ||
|id_wcag_criterio=2.2.2 | |||
|id_wcag_subcriterio=2.2.2-B | |||
|wcag_titulo_criterio=2.2.2-B. Actualizaciones parciales automáticas | |||
|wcag_nivel=A | |||
|wcag_version=2.0 | |||
|wcag_principio=2_Operable | |||
|wcag_principio_url=Principio_2 | |||
|wcag_pauta=2.2_Tiempo_Suficiente | |||
|wcag_pauta_url=Principio_2/2.2_Tiempo_Suficiente | |||
|wcag_grupo=Interacción | |||
|wcag_subgrupo=Movimiento_visual | |||
|wcag_subcriterio_url=Principio_2/2.2_Tiempo_suficiente/2.2.2-B | |||
''' | |wcag_discapacidades= | ||
<li class="discapacidad-item"> | |||
[[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]] | |||
<span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> – | |||
<span class="gravedad gravedad-grave">Barrera grave</span> | |||
</li> | |||
<li class="discapacidad-item"> | |||
[[Archivo:Sinvision.png|20px|class=icon-discapacidad|alt=Discapacidad visual total]] | |||
<span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</span> – | |||
<span class="gravedad gravedad-moderada">Barrera moderada</span> | |||
</li> | |||
<li class="discapacidad-item"> | |||
[[Archivo:Motriz.png|20px|class=icon-discapacidad|alt=Discapacidad motriz]] | |||
<span class="discapacidad-texto">[[:Categoría:Discapacidad motriz|Motriz]]</span> – | |||
<span class="gravedad gravedad-moderada">Barrera moderada</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> | |||
|wcag_lista_discapacidades= | |||
[[Categoría:Discapacidad cognitiva]] | |||
[[Categoría:Discapacidad visual total]] | |||
[[Categoría:Discapacidad motriz]] | |||
[[Categoría:Discapacidad sordoceguera]] | |||
|wcag_texto_criterioOAW= | |||
Las actualizaciones parciales del contenido que se realizan de forma automática (p. ej. un ticker de noticias o con información de última hora) deben disponer de un mecanismo que permite a los usuarios pausarlas, detenerlas u ocultarlas, o bien controlar la frecuencia de la actualización | |||
|wcag_descripcion_resumida= | |||
Los elementos que actualizan información automáticamente deben ofrecer controles claros para pausar, detener u ocultar los cambios o modificar su frecuencia. | |||
|wcag_objetivo= | |||
Permitir que las personas mantengan el foco y puedan leer o interactuar sin interrupciones causadas por actualizaciones automáticas de partes de la página. | |||
|wcag_importancia= | |||
El contenido dinámico que cambia sin control puede distraer, provocar pérdida de contexto y afectar la comprensión, especialmente para personas con discapacidad cognitiva o visual. | |||
|wcag_referencias= | |||
<ul> | |||
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/general/G4 G4: Allowing the content to be paused and restarted from where it was paused]</span></li> | |||
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/general/G186 G186: Using a control in the Web page that stops moving, blinking, or auto-updating content]</span></li> | |||
</ul> | |||
|wcag_recursos= | |||
<ul> | |||
<li>[https://web.dev/prefers-reduced-motion/ Google Web.Dev – prefers-reduced-motion]</li> | |||
<li>[https://wave.webaim.org/ WAVE Evaluation Tool]</li> | |||
<li>[https://accessibilityinsights.io/ Accessibility Insights]</li> | |||
</ul> | |||
|wcag_tipo_evaluacion=Manual | |||
|wcag_pasos_evaluacion= | |||
<ol class="paso-list"> | |||
<li><span class="paso-badge">Paso 1.</span> | |||
Localizar si existe en la página algún contenido que se actualice de forma automática. | |||
</li> | |||
<li><span class="paso-badge">Paso 2.</span> | |||
Verificar que para este contenido se ofrece alguna de las siguientes opciones: | |||
<ul> | |||
<li>a. Se permite detener la actualización.</li> | |||
<li>b. Se permite pausar y reanudar la actualización.</li> | |||
<li>c. Se permite ocultar el contenido que se actualiza.</li> | |||
<li>d. Se permite que los usuarios controlen la frecuencia de la actualización.</li> | |||
</ul> | |||
</li> | |||
</ol> | |||
|wcag_resultado_evaluacion= | |||
El usuario puede pausar, detener u ocultar las actualizaciones parciales o ajustar su frecuencia. | |||
|wcag_ejemplo_evaluacion= | |||
<div class="accessibility-card"> | |||
Este código crea un “ticker” informativo (un mensaje que se va actualizando solo cada cierto tiempo) y un botón para pausarlo o reanudarlo | |||
<pre class="wcag-codigo-html"> | |||
<div id="ticker">Última hora: Primera convocatoria abierta.</div> | |||
<button id="pause">Pausar</button> | |||
<script> | |||
let paused = false; | |||
let interval = setInterval(()=>{if(!paused) ticker.textContent="Actualización: "+Date()},4000); | |||
pause.onclick=()=>{paused=!paused;pause.textContent=paused?"Reanudar":"Pausar";} | |||
</script> | |||
</pre> | |||
</div> | |||
|wcag_otras_herramientas_evaluacion= | |||
<ul> | |||
<li>'''Revisión visual''': identificar contenido que se actualiza automáticamente en parte de la página (p. ej. tickers de noticias, marcadores en directo, resultados, notificaciones, contadores).</li> | |||
<li>'''Prueba funcional''': comprobar que existe un mecanismo para pausar, detener u ocultar las actualizaciones, o bien para ajustar su frecuencia.</li> | |||
<li>'''Inspección del navegador''': revisar scripts y peticiones periódicas (p. ej. <code>setInterval</code>, <code>fetch</code> recurrentes, WebSockets) que actualizan secciones sin recargar toda la página.</li> | |||
<li>'''Tecnologías de apoyo''': con lectores de pantalla y teclado (NVDA, JAWS, VoiceOver) verificar que las actualizaciones no interrumpen la lectura ni el foco, y que los controles para gestionarlas son accesibles.</li> | |||
</ul> | |||
}} | |||
Revisión actual - 12:42 6 nov 2025
2.2.2-B. Actualizaciones parciales automáticas
- Nivel: A
- Versión: 2.0
- Principio: 2_Operable
- Pauta: 2.2_Tiempo_Suficiente
- Grupo: Interacción
- Subgrupo: Movimiento_visual
Discapacidades afectadas
Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.
-
Cognitiva –
Barrera grave
-
Visual total –
Barrera moderada
-
Motriz –
Barrera moderada
-
Sordoceguera
–
Barrera grave
Enunciado del criterio (Observatorio de Accesibilidad Web)
- Las actualizaciones parciales del contenido que se realizan de forma automática (p. ej. un ticker de noticias o con información de última hora) deben disponer de un mecanismo que permite a los usuarios pausarlas, detenerlas u ocultarlas, o bien controlar la frecuencia de la actualización
Comprensión del criterio
Descripción resumida
Los elementos que actualizan información automáticamente deben ofrecer controles claros para pausar, detener u ocultar los cambios o modificar su frecuencia.
Objetivo
Permitir que las personas mantengan el foco y puedan leer o interactuar sin interrupciones causadas por actualizaciones automáticas de partes de la página.
Importancia de cumplir el criterio
El contenido dinámico que cambia sin control puede distraer, provocar pérdida de contexto y afectar la comprensión, especialmente para personas con discapacidad cognitiva o visual.
Referencias WCAG
Recursos de apoyo
Evaluación del criterio
Tipo de evaluación
Evaluación Manual
Procedimiento de evaluación
- Paso 1. Localizar si existe en la página algún contenido que se actualice de forma automática.
- Paso 2.
Verificar que para este contenido se ofrece alguna de las siguientes opciones:
- a. Se permite detener la actualización.
- b. Se permite pausar y reanudar la actualización.
- c. Se permite ocultar el contenido que se actualiza.
- d. Se permite que los usuarios controlen la frecuencia de la actualización.
Resultado esperado
El usuario puede pausar, detener u ocultar las actualizaciones parciales o ajustar su frecuencia.
Ejemplo
Este código crea un “ticker” informativo (un mensaje que se va actualizando solo cada cierto tiempo) y un botón para pausarlo o reanudarlo
<div id="ticker">Última hora: Primera convocatoria abierta.</div>
<button id="pause">Pausar</button>
<script>
let paused = false;
let interval = setInterval(()=>{if(!paused) ticker.textContent="Actualización: "+Date()},4000);
pause.onclick=()=>{paused=!paused;pause.textContent=paused?"Reanudar":"Pausar";}
</script>
Otras herramientas de evaluación
- Revisión visual: identificar contenido que se actualiza automáticamente en parte de la página (p. ej. tickers de noticias, marcadores en directo, resultados, notificaciones, contadores).
- Prueba funcional: comprobar que existe un mecanismo para pausar, detener u ocultar las actualizaciones, o bien para ajustar su frecuencia.
- Inspección del navegador: revisar scripts y peticiones periódicas (p. ej.
setInterval,fetchrecurrentes, WebSockets) que actualizan secciones sin recargar toda la página. - Tecnologías de apoyo: con lectores de pantalla y teclado (NVDA, JAWS, VoiceOver) verificar que las actualizaciones no interrumpen la lectura ni el foco, 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.2-B. Actualizaciones parciales automáticas
Loading comments...
