Diferencia entre revisiones de «Principio 2/2.3 Reacciones físicas/2.3.1-A»

De WCAG Wiki
← Edición anteriorEdición siguiente →
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
Línea 1: Línea 1:
== '''2.3.1-A. Umbral de tres destellos''' ==
{{CriterioWCAG
<!-- 
|id_wcag_criterio=2.3.1
  Análisis interno:
|id_wcag_subcriterio=2.3.1-A
  Este criterio impacta principalmente a: Personas con discapacidad visual y cognitiva 
|wcag_titulo_criterio=2.3.1-A. Umbral de tres destellos
  Problema grave: Destellos rápidos pueden provocar ataques fotosensitivos o mareos en personas con epilepsia fotosensible y dificultades cognitivas, generando barreras graves de accesibilidad.
|wcag_nivel=A
-->
|wcag_version=2.2
<html>
|wcag_principio=2_Operable
<!-- criterio 2.3.1-A -->
|wcag_principio_url=Principio_2
<article class="wcag-card">
|wcag_pauta=2.3_Ataques_fotosensitivos
   <section class="wcag-info">
|wcag_pauta_url=Principio_2/2.3_Ataques_fotosensitivos
    <ul>
|wcag_grupo=Percepción_visual
      <li><span class="label">Nivel:</span><span class="value">A</span></li>
|wcag_subgrupo=Fotosensibilidad
      <li><span class="label">Versión:</span><span class="value">2.2</span></li>
|wcag_subcriterio_url=Principio_2/2.3_Ataques_fotosensitivos/2.3.1-A
      <li><span class="label">Principio:</span><span class="value">2. Operable</span></li>
 
      <li><span class="label">Pauta:</span><span class="value">2.3 Se puede navegar</span></li>
|wcag_discapacidades=
      <li><span class="label">Categoría:</span><span class="value">Presentación visual</span></li>
<li class="discapacidad-item">
      <li><span class="label">Subcategoría:</span><span class="value">Destellos y parpadeos</span></li>
   [[Archivo:Bajavision.png|20px|class=icon-discapacidad|alt=Baja visión]]
    </ul>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad baja visión|Baja visión]]</span> –
  </section>
  <span class="gravedad gravedad-grave">Barrera grave</span>
  <section class="wcag-users">
</li>
    <p>Usuarios más afectados</p>
<li class="discapacidad-item">
    <ul>
  [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
      <li><img src="/images/b/b7/Bajavision.png" alt="Icono baja visión" class="icono-discapacidad" /> Personas con baja visión – <span class="gravedad">Barrera grave</span></li>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> –
      <li><img src="/images/4/40/Cognitiva.png" alt="Icono discapacidad cognitiva" class="icono-discapacidad" /> Personas con discapacidad cognitiva – <span class="gravedad">Barrera grave</span></li>
  <span class="gravedad gravedad-grave">Barrera grave</span>
    </ul>
</li>
  </section>
<li class="discapacidad-item">
</article>
  [[Archivo:Sinvision.png|20px|class=icon-discapacidad|alt=Discapacidad visual total]]
</html>
  <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-leve">Barrera leve</span>
</li>
<li class="discapacidad-item">
  [[Archivo:Auditiva.png|20px|class=icon-discapacidad|alt=Discapacidad auditiva]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad auditiva|Auditiva]]</span> –
  <span class="gravedad gravedad-leve">Barrera leve</span>
</li>
 
|wcag_lista_discapacidades=
[[Categoría:Discapacidad baja visión]]
[[Categoría:Discapacidad cognitiva]]
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad motriz]]
[[Categoría:Discapacidad auditiva]]
 
|wcag_texto_criterioOAW=
El contenido no debe presentar destellos con una frecuencia superior a tres destellos por segundo, a menos que el área con destellos sea suficientemente pequeña.
 
|wcag_descripcion_resumida=
El contenido no puede incluir destellos rápidos que puedan provocar ataques fotosensitivos. Si hay destellos, su frecuencia debe ser menor o igual a tres por segundo o cumplir el umbral de tamaño seguro.
 
|wcag_objetivo=
Evitar desencadenar ataques fotosensitivos o convulsiones en personas sensibles a destellos rápidos, garantizando un entorno visual seguro.
 
|wcag_importancia=
Los destellos intensos y rápidos pueden causar ataques, mareos o desorientación. Controlar la frecuencia y área destellante protege la salud y seguridad de las personas usuarias.
 
|wcag_referencias=
<ul>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/three-flashes-or-below-threshold.html Understanding Success Criterion 2.3.1]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/quickref/#three-flashes-or-below-threshold WCAG Quick Reference – 2.3.1]</span></li>
<li>[https://trace.umd.edu/peat/ PEAT – Photosensitive Epilepsy Analysis Tool]</li>
</ul>
 
|wcag_recursos=
<ul>
<li>[https://trace.umd.edu/peat/ Herramienta PEAT para epilepsia fotosensitiva]</li>
<li>[https://wave.webaim.org/ WAVE Evaluation Tool]</li>
<li>[https://accessibilityinsights.io/ Accessibility Insights]</li>
</ul>
 
|wcag_tipo_evaluacion=Semiautomática
 
|wcag_pasos_evaluacion=
<ol class="paso-list">
<li>Identificar videos, animaciones o efectos con destellos visibles.</li>
<li>Comprobar si hay más de tres destellos por segundo.</li>
<li>Analizar el área destellante para confirmar si entra dentro del umbral permitdo.</li>
<li>Utilizar PEAT u otras herramientas de evaluación fotosensible.</li>
<li>Validar que el contenido no supone riesgo ni genera malestar visual.</li>
</ol>
 
|wcag_resultado_evaluacion=
El contenido no supera los tres destellos por segundo o cumple el umbral seguro de área.
 
|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
<strong>✅ Accesible</strong>
<pre class="wcag-codigo-html">
<style>
.pulse { animation: slowBlink 1.5s infinite; }
@keyframes slowBlink {
  0%,100% { opacity:1; }
  50% { opacity:.4; }
}
</style>
<div class="pulse">Mensaje destacado</div>
</pre>
</div>
 
<div class="accessibility-card">
<strong>❌ No accesible</strong>
<pre class="wcag-codigo-html">
<style>
.flash { animation: fastBlink .2s infinite; } /* 5 destellos/segundo */
@keyframes fastBlink {
  0%,100% { opacity:1; background:red; }
  50% { opacity:.2; background:yellow; }
}
</style>
<div class="flash">¡Oferta!</div>
</pre>
</div>
 
|wcag_otras_herramientas_evaluacion=
<ul>
<li>PEAT — análisis de destellos fotosensitivos</li>
<li>AXE, WAVE, Accessibility Insights</li>
<li>Pruebas en distintos monitores y contrastes</li>
</ul>
}}

Revisión del 11:40 5 nov 2025

2.3.1-A. Umbral de tres destellos

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)

  • El contenido no debe presentar destellos con una frecuencia superior a tres destellos por segundo, a menos que el área con destellos sea suficientemente pequeña.

Comprensión del criterio

Descripción resumida

El contenido no puede incluir destellos rápidos que puedan provocar ataques fotosensitivos. Si hay destellos, su frecuencia debe ser menor o igual a tres por segundo o cumplir el umbral de tamaño seguro.

Objetivo

Evitar desencadenar ataques fotosensitivos o convulsiones en personas sensibles a destellos rápidos, garantizando un entorno visual seguro.

Importancia de cumplir el criterio

Los destellos intensos y rápidos pueden causar ataques, mareos o desorientación. Controlar la frecuencia y área destellante protege la salud y seguridad de las personas usuarias.

Referencias WCAG

Recursos de apoyo

Evaluación del criterio

Tipo de evaluación

Evaluación Semiautomática

Procedimiento de evaluación

  1. Identificar videos, animaciones o efectos con destellos visibles.
  2. Comprobar si hay más de tres destellos por segundo.
  3. Analizar el área destellante para confirmar si entra dentro del umbral permitdo.
  4. Utilizar PEAT u otras herramientas de evaluación fotosensible.
  5. Validar que el contenido no supone riesgo ni genera malestar visual.

Resultado esperado

El contenido no supera los tres destellos por segundo o cumple el umbral seguro de área.

Ejemplo

✅ Accesible 

<style>
.pulse { animation: slowBlink 1.5s infinite; }
@keyframes slowBlink {
  0%,100% { opacity:1; }
  50% { opacity:.4; }
}
</style>
<div class="pulse">Mensaje destacado</div>

❌ No accesible 

<style>
.flash { animation: fastBlink .2s infinite; } /* 5 destellos/segundo */
@keyframes fastBlink {
  0%,100% { opacity:1; background:red; }
  50% { opacity:.2; background:yellow; }
}
</style>
<div class="flash">¡Oferta!</div>

Otras herramientas de evaluación

  • PEAT — análisis de destellos fotosensitivos
  • AXE, WAVE, Accessibility Insights
  • Pruebas en distintos monitores y contrastes










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 2.3.1-A. Umbral de tres destellos

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_2/2.3_Reacciones_físicas/2.3.1-A&oldid=3464»