Calculadoras que cualquier visitante puede usar

Cada campo tiene una etiqueta visible y un texto de ayuda que explica qué ingresar. La calculadora está pensada para poder usarse con teclado, y los resultados se muestran como texto, no como imágenes, para que las tecnologías de asistencia puedan leerlos. Un bloque de definiciones en lenguaje sencillo explica los términos. Los visitantes pueden cambiar entre 2 idiomas (el árabe se lee de derecha a izquierda), y el modo claro, oscuro o automático sigue sus preferencias.

• Etiquetas y texto de ayuda en cada campo, tomados de las definiciones de campos de la propia calculadora.
• Uso con teclado: los campos, los botones y el formulario están pensados para poder alcanzarse y usarse sin mouse.
• Resultados como texto que se actualiza mientras el visitante escribe, en lugar de una respuesta solo en gráfico.
• Definiciones en lenguaje sencillo, contraídas, expandidas o en una pestaña.
• Modo claro, oscuro y automático, para que la calculadora pueda seguir la configuración del dispositivo del visitante.
• Interfaz en 2 idiomas (inglés, español, chino simplificado, coreano, vietnamita y árabe), que el visitante puede cambiar; el árabe se dispone de derecha a izquierda.

Su paleta, sus colores personalizados, sus fuentes, su CSS personalizado y su tema cambian lo legible y usable que resulta la calculadora. Un color de marca que se ve bien puede no cumplir el contraste en el texto de un botón, y un tema decorativo puede agregar movimiento que a algunos visitantes les cuesta manejar. Revise el contraste y el foco del teclado después de cada cambio en estos ajustes.

Los temas con muchos efectos, como Particles, Aurora y Depth 3D, son decorativos. Si su público incluye muchos visitantes mayores, algo común en páginas de Medicare (el seguro médico federal para mayores de 65 años), de cuidado a largo plazo y de anualidades, un tema más sereno como Ledger, Minimal o Editorial, con un tamaño de letra cómodo, es la opción más segura. Revise cómo se comporta el tema elegido con la opción de movimiento reducido de su sistema operativo activada.

El CSS personalizado puede ocultar los contornos de foco o reducir el texto sin que usted lo note. Mantenga visibles los indicadores de foco y evite tamaños de letra fijos por debajo del predeterminado.

Pruebe en la página publicada, no en el editor. Complete la calculadora y el formulario usando solo el teclado; verifique que el foco esté siempre visible. Use un lector de pantalla para escuchar las etiquetas y los resultados. Amplíe la página al 200 por ciento, pruebe los modos claro y oscuro y active el movimiento reducido. Repita después de cambiar el tema o la paleta.

• Recorra con Tab cada campo, las definiciones, el selector de idioma y el formulario; nada debe atrapar el foco.
• Escuche con el lector de pantalla integrado de su dispositivo: la etiqueta de cada campo y el resultado deben anunciarse con claridad.
• Revise el contraste de textos y botones según el nivel AA de las WCAG 2.2 con su paleta real.
• Amplíe al 200 por ciento y vea la página en la pantalla estrecha de un teléfono; nada debe quedar cortado.
• Cambie a cada idioma en que atienda (y al árabe, si lo usa, para revisar el diseño de derecha a izquierda) y confirme que su texto de consentimiento y su descargo se lean correctamente.
• Active el movimiento reducido y revise el tema que eligió.

Su agencia es responsable de su sitio web en conjunto, incluida cualquier herramienta insertada en él. Nosotros diseñamos las calculadoras con el nivel AA de las WCAG 2.2 como objetivo y queremos saber de cualquier barrera dentro de ellas, pero no podemos controlar el diseño de su página, sus colores ni su CSS personalizado. Pruebe la combinación y avísenos de cualquier cosa dentro de la calculadora que falle.

Esta página describe objetivos de diseño, no una certificación ni una opinión legal. Nuestra declaración de accesibilidad cubre este sitio web, y puede reportar una barrera a través de la página de contacto.