Ir al contenido
EUID Servicio de auditoría & sello, Inicio
Auditar su sitio web

Esta traducción aún no ha sido revisada editorialmente. La versión alemana es la vinculante. Deutsche Fassung

Accesibilidad

¿Qué tan grande tiene que ser un botón para los dedos y las manos afeitadas?

Un botón de 20 píxeles de altura golpea un dedo en el teléfono sólo con suerte, una mano afeitada con el ratón tampoco. Nivel AA (2.5.8, nuevo en WCAG 2.2) requiere 24 × 24 píxeles o distancia suficiente. El criterio de nivel AAA 2.5.5 requiere 44 × 44 píxeles CSS para cada objetivo operado con un puntero. Excluidos son enlaces en el texto de flujo, elementos con una alternativa más grande equivalente y elementos cuyo tamaño especifica el navegador.

Lo que el Criterio requiere

Cada objetivo se escribe o hace clic es al menos 44 píxeles CSS de ancho y alto. Esto corresponde a unos 9 milímetros en un teléfono móvil, la anchura de la punta de los dedos. Excepciones: enlaces en una frase o párrafo; objetivos para los cuales hay una alternativa equivalente de 44 píxeles en la misma página; Metas cuyo tamaño no está determinado por el autor (control de crecimiento); y objetivos para los cuales la representación concreta es esencial, como puntos en un mapa.

Para quien esto cuenta

Las personas con temblor, artritis, espasticidad o tras golpe no golpean objetivos pequeños o golpean a su lado. Por teléfono, esto afecta a todo el que toca con el pulgar, en el autobús, con un guante, con un dedo grueso. Los 44 píxeles provienen de las directrices de diseño de los grandes sistemas operativos y se han demostrado como un límite de los cuales los errores operativos disminuyen significativamente. Los objetivos más grandes también reducen la tasa de error para todos los demás.

Así es como nos ocupamos de ello

Hoy en día, el núcleo de medición mide cada superficie de operación en el área de prueba Responsabilidad frente al límite de 24-píxeles del nivel AA y especifica ancho y altura para cada ubicación. La misma medida dice qué áreas alcanzan 44 píxeles. El criterio es automáticamente decidable, salvo la cuestión de si una alternativa es equivalente. Pertenece a la categoría AAA en conocimiento; El informe establece las normas.

Ejemplos

Botón con 24 píxeles

No se conocen
.symbol-knopf { width: 24px; height: 24px; }  /* Stufe AA */
Fulfilled
.symbol-knopf { min-width: 44px; min-height: 44px; }  /* Stufe AAA */

44 × 44 píxeles CSS por objetivo, excluyendo intervalos. Se excluyen los vínculos del texto.

  • Introduzca botones, elementos de menú y enlaces de iconos con una altura mínima y una anchura de 44 píxeles (mínimo-altura, ancho min) o equivalente dentro de la distancia.
  • Aumente el área de clic de iconos con la limpieza interior, no el icono en sí.
  • Dejar los enlaces en el texto de flujo como están; están excluidos.
  • Compruebe las líneas en tablas y listas con acciones de icono: hay objetivos pequeños más comunes.

Deutsche Fassung dieser Seite

  • Sello Digitale Barrierefreiheit
  • Sello Daten & Recht
  • Sello Technische Qualität
  • Sello Digital Excellence
  • Sello Cyberversicherung

Auditado. Por un futuro digital mejor.euid.com