Diferencia entre revisiones de «Principio 1/1.3 Adaptable/1.3.5-A»

De WCAG Wiki
← Edición anterior
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
 
(No se muestran 11 ediciones intermedias del mismo usuario)
Línea 1: Línea 1:
{{CriterioWCAG
{{CriterioWCAG
|id_criterio=1.3.5-A
|id_wcag_criterio=1.3.5
|codigo_criterio=1.3.5-A. Propósito de los campos de datos
|id_wcag_subcriterio=1.3.5-A
|nivel=AA
|wcag_titulo_criterio=1.3.5-A. Propósito de los campos de datos
|version=2.2
|wcag_nivel=AA
|principio=1. Perceptible
|wcag_version=2.1
|principio_enlace=Principio_1
|wcag_principio=1_Perceptible
|pauta=1.3 Adaptable
|wcag_principio_url=Principio_1
|pauta_enlace=Principio_1/1.3_Adaptable
|wcag_pauta=1.3_Adaptable
|categoria=Formularios
|wcag_pauta_url=Principio_1/1.3_Adaptable
|subcategoria=Propósito de campos
|wcag_grupo=Formularios
|discapacidades=
|wcag_subgrupo=Propósito de campos
<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-grave">Barrera grave</span>
</li>


|wcag_discapacidades=
<li class="discapacidad-item">
<li class="discapacidad-item">
   [[Archivo:Motriz.png|20px|class=icon-discapacidad|alt=Discapacidad motriz]]
   [[Archivo:Motriz.png|20px|class=icon-discapacidad|alt=Discapacidad motriz]]
Línea 22: Línea 18:
   <span class="gravedad gravedad-leve">Barrera leve</span>
   <span class="gravedad gravedad-leve">Barrera leve</span>
</li>
</li>
<li class="discapacidad-item">
<li class="discapacidad-item">
   [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
   [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
Línea 29: Línea 24:
</li>
</li>


|descripcion_txtcriterioWCAG=
|wcag_lista_discapacidades=
El propósito de los campos de introducción de datos debe ser identificable por software para que navegadores y tecnologías de apoyo puedan reconocer automáticamente su finalidad.
 
 
|discapacidades_categorias=
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad motriz]]
[[Categoría:Discapacidad motriz]]
[[Categoría:Discapacidad cognitiva]]
[[Categoría:Discapacidad cognitiva]]


|wcag_texto_criterioOAW=
Se debe usar un método que permita al navegador identificar automáticamente el tipo de dato solicitado (por ejemplo, nombre, correo, dirección, etc.).


 
|wcag_descripcion_resumida=
|descripcion_resumida=
Cada campo que recopila datos personales debe estar correctamente identificado mediante atributos estándar como <code>autocomplete</code>.
Cada campo que recopila datos personales debe estar correctamente identificado mediante atributos estándar como <code>autocomplete</code>.


|objetivo=
|wcag_objetivo=
Facilitar la introducción de datos y mejorar la comprensión del propósito de cada campo en un formulario.
Facilitar la introducción de datos y mejorar la comprensión del propósito de cada campo en un formulario.


|importancia=
|wcag_importancia=
Reduce la carga cognitiva y motriz de completar formularios, evitando errores y mejorando la velocidad de introducción de datos.
Reduce la carga cognitiva y motriz de completar formularios, evitando errores y mejorando la velocidad de introducción de datos.


|referencias=
|wcag_referencias=
<ul>
<ul>
<li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/html/H98 H98: Using HTML 5.2 autocomplete attributes]</span></li>
<span lang="en">[https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html Understanding Success Criterion 1.3.5 (en inglés)]</span>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/failures/F107 F107: Failure of Success Criterion 1.3.5 due to incorrect autocomplete attribute values]</span></li>
</li>
</ul>
</ul>


|recursos=
|wcag_recursos=
<ul>
<ul>
<li> [https://www.w3.org/WAI/tutorials/forms/autofill/ Tutorial W3C sobre autocompletado en formularios (en inglés)] </li>
<li>[https://www.w3.org/WAI/tutorials/forms/autofill/ Tutorial W3C sobre autocompletado en formularios]</li>
<li> [https://www.w3.org/WAI/tutorials/forms/autofill/ Tutorial W3C sobre autocompletado en formularios (en inglés)]</li>
</ul>
</ul>


|tipo_comprobacion=Semiautomática
|wcag_tipo_evaluacion=Semiautomática
 
|wcag_pasos_evaluacion=
Usa la herramienta de ''' [https://chromewebstore.google.com/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm?hl=es Web Developer Toolbar].'''


|procedimiento=
<ol class="paso-list">
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Abrir la página y acceder a las herramientas de desarrollo.</li>
<li><span class="paso-badge">Paso 1.</span>  
<li><span class="paso-badge">Paso 2.</span> Localizar los campos de datos personales.</li>
Seleccionar <strong>“Forms – Display form details”</strong>.
<li><span class="paso-badge">Paso 3.</span> Comprobar que cada campo tiene un valor <code>autocomplete</code> adecuado.</li></ol>
</li>
<li><span class="paso-badge">Paso 2.</span>  
Localizar los campos de formulario que solicitan información acerca de las personas.
</li>
<li><span class="paso-badge">Paso 3.</span>  
Verificar que tienen el atributo <code>autocomplete</code> con un valor acorde a su propósito, según los criterios establecidos en
<span lang="en">[https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose Success Criterion 1.3.5: Input Purposes for User Interface Components]</span>
</li>
</ol>
 


|resultado=Los campos incluyen el atributo <code>autocomplete</code> con valores coherentes al propósito del campo.
|wcag_resultado_evaluacion=
Los campos incluyen el atributo <code>autocomplete</code> con valores coherentes al propósito del campo.


|ejemplo=
|wcag_ejemplo_evaluacion=
Se muestra un codigo de formulario con el campo autocomplete "email". Esto permite incluir datos de email almacenados en el navegador.
<div class="accessibility-card">
<div class="accessibility-card">  
Se incluye un codigo con autocomplete "email" correspondiente al campo de datos.
<pre class="wcag-codigo-html"><code>&lt;label for="correo"&gt;Correo electrónico&lt;/label&gt;<br />&lt;input id="correo" type="email" autocomplete="email"&gt;</code></pre></div>


|otras_herramientas=
<pre class="wcag-codigo-html">&lt;label for="correo"&gt;Correo electrónico&lt;/label&gt;
<ul>
&lt;input id="correo" type="email" autocomplete="email"&gt;</pre></div>
<li> [https://www.deque.com/axe/devtools/ '''axe DevTools'''] — Extensión de análisis automático de accesibilidad desarrollada por Deque Systems. Permite detectar errores técnicos y semiautomáticos directamente desde el navegador.
</li>


<li>
|wcag_otras_herramientas_evaluacion=
[https://chrispederick.com/work/web-developer/ '''Web Developer Toolbar'''] — Barra de herramientas para Firefox y Chrome que facilita la inspección visual de la estructura, etiquetas y atributos HTML relevantes para la accesibilidad.
</li>


<li> [https://accessibilityinsights.io/ '''Accessibility Insights'''] — Herramienta de Microsoft que combina comprobaciones automáticas, revisión guiada y evaluación manual conforme a las WCAG 2.2.
|wcag_otras_herramientas_evaluacion=
</li>
<ul>
<li>'''Inspección del navegador''': revisar que los campos de formulario que recopilan información personal utilicen atributos semánticos adecuados (p. ej. <code>autocomplete="name"</code>, <code>autocomplete="email"</code>, <code>autocomplete="street-address"</code>, etc.).</li>
<li>'''Pruebas del navegador''': comprobar si el navegador ofrece autocompletado adecuado y reconoce el propósito de cada campo al escribir o guardar información.</li>
<li>'''Lectores de pantalla''': (NVDA, JAWS, VoiceOver) verificar que los campos se anuncian correctamente y que el propósito está claro para usuarios con apoyo asistivo.</li>
<li>'''Validación HTML''': usar herramientas como el [https://validator.w3.org/nu/ W3C HTML Validator] o DevTools para detectar ausencia o uso incorrecto del atributo <code>autocomplete</code> en campos relevantes.</li>
</ul>
</ul>


}}
}}

Revisión actual - 09:43 5 nov 2025

1.3.5-A. Propósito de los campos de datos

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)

  • Se debe usar un método que permita al navegador identificar automáticamente el tipo de dato solicitado (por ejemplo, nombre, correo, dirección, etc.).

Comprensión del criterio

Descripción resumida

Cada campo que recopila datos personales debe estar correctamente identificado mediante atributos estándar como autocomplete.

Objetivo

Facilitar la introducción de datos y mejorar la comprensión del propósito de cada campo en un formulario.

Importancia de cumplir el criterio

Reduce la carga cognitiva y motriz de completar formularios, evitando errores y mejorando la velocidad de introducción de datos.

Referencias WCAG

Recursos de apoyo

Evaluación del criterio

Tipo de evaluación

Evaluación Semiautomática

Procedimiento de evaluación

Usa la herramienta de Web Developer Toolbar.
  1. Paso 1. Seleccionar “Forms – Display form details”.
  2. Paso 2. Localizar los campos de formulario que solicitan información acerca de las personas.
  3. Paso 3. Verificar que tienen el atributo autocomplete con un valor acorde a su propósito, según los criterios establecidos en Success Criterion 1.3.5: Input Purposes for User Interface Components

Resultado esperado

Los campos incluyen el atributo autocomplete con valores coherentes al propósito del campo.

Ejemplo

Se incluye un codigo con autocomplete "email" correspondiente al campo de datos. 

<label for="correo">Correo electrónico</label>
<input id="correo" type="email" autocomplete="email">

Otras herramientas de evaluación

  • Inspección del navegador: revisar que los campos de formulario que recopilan información personal utilicen atributos semánticos adecuados (p. ej. autocomplete="name", autocomplete="email", autocomplete="street-address", etc.).
  • Pruebas del navegador: comprobar si el navegador ofrece autocompletado adecuado y reconoce el propósito de cada campo al escribir o guardar información.
  • Lectores de pantalla: (NVDA, JAWS, VoiceOver) verificar que los campos se anuncian correctamente y que el propósito está claro para usuarios con apoyo asistivo.
  • Validación HTML: usar herramientas como el W3C HTML Validator o DevTools para detectar ausencia o uso incorrecto del atributo autocomplete en campos relevantes.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.3.5-A. Propósito de los campos de datos

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.3_Adaptable/1.3.5-A&oldid=3434»