Diferencia entre revisiones de «Principio 1/1.1 Texto Alternativo/1.1.1-J»

De WCAG Wiki
Sin resumen de edición
Línea 1: Línea 1:
== '''1.1.1-J. Alternativa textual para CAPTCHAs ''' ==
{{CriterioWCAG
<html>
|id_wcag_criterio=1.1.1
<!-- criterio 1.1.1-J -->
|id_wcag_subcriterio=1.1.1-J
<article class="wcag-card">
|wcag_titulo_criterio=1.1.1-J. Alternativa textual para CAPTCHAs
  <section class="wcag-info">
|wcag_nivel=A
    <ul>
|wcag_version=2.0
      <li><span class="label">Nivel:</span><span class="value">A</span></li>
|wcag_principio=1_Perceptible
      <li><span class="label">Versión:</span><span class="value">2.0</span></li>
|wcag_principio_url=Principio_1
      <li><span class="label">Principio:</span><span class="value">1. Perceptible</span></li>
|wcag_pauta=1.1_Textos_alternativos
      <li><span class="label">Pauta:</span><span class="value">1.1 Textos alternativos</span></li>
|wcag_pauta_url=Principio_1/1.1_Texto_Alternativo
      <li><span class="label">Categoría:</span><span class="value">Contenido</span></li>
|wcag_grupo=Contenido
      <li><span class="label">Subcategoría:</span><span class="value">No-texto</span></li>
|wcag_subgrupo=No-texto
    </ul>
  </section>
  <section class="wcag-users">
    <p>Usuarios más afectados</p>
    <ul>
      <li><img src="/images/4/4d/Sinvision.png" alt="Icono de una persona con discapacidad visual" />
      <span>Personas con discapacidad visual total - <span class="gravedad">Barrera grave</span></span></li>


        <li>
|wcag_discapacidades=
          <img src="/images/4/40/Cognitiva.png" alt="Icono discapacidad cognitiva" class="icono-discapacidad" />
<li class="discapacidad-item">
          Personas con discapacidad cognitiva – <span class="gravedad">Barrera grave</span>
  [[Archivo:Sinvision.png|20px|class=icon-discapacidad|alt=Discapacidad visual total]]
        </li>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</span>
    </ul>
 
   </section>
  <span class="gravedad gravedad-grave">Barrera grave</span>
</article>
</li>
</html>
<li class="discapacidad-item">
[[Categoría: Visual total]]
   [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
[[Categoría: Cognitiva]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span>
  –
  <span class="gravedad gravedad-grave">Barrera grave</span>
</li>


[[Categoría: Contenido]]
|wcag_lista_discapacidades=
[[Categoría: Nivel-A]]
[[Categoría:Visual total]]
[[Categoría: Versión-2.0]]
[[Categoría:Cognitiva]]


|wcag_texto_criterioOAW=
Los CAPTCHAs deben tener una alternativa textual que describa su propósito y proporcionar otro método de verificación accesible para personas que no puedan resolver el desafío visual o auditivo.


<html>
|wcag_descripcion_resumida=
<!--
Los CAPTCHAs requieren texto alternativo que explique su función.
Análisis: 1.1.1-J
Además, se debe ofrecer un sistema de verificación alternativo (por ejemplo audio, lógica o puzzle accesible) para garantizar que todas las personas puedan pasar el control de seguridad.
- Discapacidad: Personas con discapacidad visual total
- Problema: CAPTCHAs sin alternativas textuales o modalidades accesibles impiden completar formularios.
- Gravedad: Grave
-->
</html>


=== Descripción y comprensión del criterio ===
|wcag_objetivo=
<div class="wcag-info-criterio">
Asegurar que cualquier usuario pueda completar la verificación de seguridad, independientemente de su capacidad visual, auditiva o cognitiva.
Los CAPTCHAs deben tener un texto que describa su propósito y además un CAPTCHA alternativo en otra modalidad accesible.
</div>


==== Descripción resumida ====
|wcag_importancia=
Un CAPTCHA solo visual o solo auditivo excluye a muchos usuarios. 
Debe existir siempre una modalidad alternativa para garantizar la accesibilidad y no bloquear el acceso a formularios o servicios.


<div class="wcag-info-criterio"> Los CAPTCHAs deben tener un texto que explique su propósito y ofrecer una alternativa en otro formato (audio, visual o lógico). </div>
|wcag_referencias=
<ul>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html Understanding Success Criterion 1.1.1]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/general/G143 Technique G143 – Providing text alternative for CAPTCHAs]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/general/G144 Technique G144 – CAPTCHA alternative in different modality]</span></li>
</ul>


==== Objetivo ====
|wcag_recursos=
<ul>
<li><span lang="en">[https://www.w3.org/TR/turingtest W3C explanation of CAPTCHA accessibility issues]</span></li>
</ul>


<div class="wcag-info-criterio"> Asegurar que todas las personas puedan completar el proceso de verificación. </div>
|wcag_tipo_evaluacion=Manual


==== Importancia de cumplir el criterio ====
|wcag_pasos_evaluacion=
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Localizar el CAPTCHA.</li>
<li><span class="paso-badge">Paso 2.</span> Mostrar atributos ALT con Web Developer Toolbar.</li>
<li><span class="paso-badge">Paso 3.</span> Verificar que el CAPTCHA tiene un texto alternativo que describe su propósito.</li>
<li><span class="paso-badge">Paso 4.</span> Comprobar que existe una modalidad alternativa (audio, visual, lógica).</li>
</ol>


<div class="wcag-info-criterio">
|wcag_resultado_evaluacion=
Un CAPTCHA solo visual o solo auditivo excluye a parte de los usuarios.  
El CAPTCHA incluye texto alternativo que explica su finalidad y una segunda modalidad accesible para validar que el usuario es humano.


Debe existir siempre otra modalidad.
|wcag_ejemplo_evaluacion=
</div>
Se presenta CAPTCHA visual con opción accesible alternativa:
 
==== Referencias WCAG ====
 
<div class="wcag-info-criterio">
* <span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html Comprender el criterio 1.1.1 (en inglés)]</span>
*[https://www.w3.org/WAI/WCAG22/Techniques/general/G143 Técnica G143 – Texto alternativo para CAPTCHAs (en inglés)]</span>
* <span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/general/G144 Técnica G144 – CAPTCHA alternativo en otra modalidad (en inglés)]</span> </div>
 
==== Recursos de apoyo ====
<div class="wcag-info-criterio">
* <span lang="en">[https://www.w3.org/TR/turingtest Explicación de los CAPTCHAs inaccesibles (en inglés)]</span>
</div>
 
=== Evaluación del criterio ===
==== Tipo de comprobación ====
<div class="wcag-info-criterio">
Comprobación <strong>Manual</strong>
 
Es necesario revisar visualmente las imágenes y leer las descripciones para comprobar que la información esté completa.
</div>
 
==== Procedimiento de evaluación ====
<div class="wcag-info-criterio">
<span class="paso-badge>Paso 1.</span>
Usa la herramienta de ''' [https://chromewebstore.google.com/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm?hl=es Web Developer Toolbar].'''
 
<span class="paso-badge>Paso 2.</span>
Seleccionar “Images – Display alt attributes”.
 
<span class="paso-badge>Paso 3.</span>
Comprobar la '''Alternativa textual:''' Verificar que todos los CAPTCHAs tienen un texto alternativo adecuado que describe su propósito.
 
<span class="paso-badge>Paso 4.</span>
Comprobar si existe '''Alternativa en otra modalidad:''' Comprobar que existe otro CAPTCHA que cumple el mismo propósito, pero está disponible en una modalidad sensorial diferente (por ejemplo, si la prueba visual tiene un botón para activar una prueba de audio).
</div>
 
==== Ejemplo ====
 
<div class="wcag-info-criterio">
 
El código del CAPTCHA debe incluir una alternativa textual que describa su objetivo y ofrecer una opción de verificación diferente.
 
Se muestra un codigo que presenta dos tipos de CAPTCHAs, uno visual y tambien uno auditivo para que el usario pueda elegir cual quiere utilizar.
 
<div class="accessibility-card">


<pre class="wcag-codigo-html">
<pre class="wcag-codigo-html">
&lt;label for="captcha">Escriba el texto que ve en la imagen:&lt;/label>
<label for="captcha">Escriba el texto que ve en la imagen:</label>
&lt;img src="captcha.png" alt="Captcha para verificar que eres una persona">
<img src="captcha.png" alt="Captcha para verificar que eres una persona">
&lt;a href="#audio_captcha">Opción de audio CAPTCHA&lt;/a>
<a href="#audio_captcha">Opción de audio CAPTCHA</a>
</pre>
</pre>


</div>
|wcag_otras_herramientas_evaluacion=
</div>
<strong>Lector de pantalla:</strong> JAWS, NVDA, VoiceOver comprobar si el proceso es comprensible y posible<br>
 
<strong>Herramienta de inspección:</strong> verificar existencia del atributo <code>alt</code> y mecanismos alternativos
==== Otras herramientas de evaluación ====
}}
<div class="wcag-info-criterio">
 
 
'''Lector de pantalla'''
 
Uso de lectores de pantalla como JAWS, NVDA o VoiceOver, para comprobar que la información que se escucha al acceder a un CAPCHA, es comprensible.
 
</div>

Revisión del 11:29 4 nov 2025

1.1.1-J. Alternativa textual para CAPTCHAs

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)

  • Los CAPTCHAs deben tener una alternativa textual que describa su propósito y proporcionar otro método de verificación accesible para personas que no puedan resolver el desafío visual o auditivo.

Comprensión del criterio

Descripción resumida

Los CAPTCHAs requieren texto alternativo que explique su función. Además, se debe ofrecer un sistema de verificación alternativo (por ejemplo audio, lógica o puzzle accesible) para garantizar que todas las personas puedan pasar el control de seguridad.

Objetivo

Asegurar que cualquier usuario pueda completar la verificación de seguridad, independientemente de su capacidad visual, auditiva o cognitiva.

Importancia de cumplir el criterio

Un CAPTCHA solo visual o solo auditivo excluye a muchos usuarios. Debe existir siempre una modalidad alternativa para garantizar la accesibilidad y no bloquear el acceso a formularios o servicios.

Referencias WCAG

Recursos de apoyo

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Localizar el CAPTCHA.
  2. Paso 2. Mostrar atributos ALT con Web Developer Toolbar.
  3. Paso 3. Verificar que el CAPTCHA tiene un texto alternativo que describe su propósito.
  4. Paso 4. Comprobar que existe una modalidad alternativa (audio, visual, lógica).

Resultado esperado

El CAPTCHA incluye texto alternativo que explica su finalidad y una segunda modalidad accesible para validar que el usuario es humano.

Ejemplo

Se presenta CAPTCHA visual con opción accesible alternativa:
<label for="captcha">Escriba el texto que ve en la imagen:</label>
<img src="captcha.png" alt="Captcha para verificar que eres una persona">
<a href="#audio_captcha">Opción de audio CAPTCHA</a>

Otras herramientas de evaluación

Lector de pantalla: JAWS, NVDA, VoiceOver — comprobar si el proceso es comprensible y posible
Herramienta de inspección: verificar existencia del atributo alt y mecanismos alternativos










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.1.1-J. Alternativa textual para CAPTCHAs

Loading comments...