Buenas prácticas de accesibilidad en el e-commerce

Planificar una tienda virtual accesible permite no sólo que las personas con discapacidad accedan a tu sitio web correctamente, sino que también garantiza que todos tengan una mejor experiencia y se conviertan en consumidores de la marca.

Entonces, imaginemos el siguiente escenario:

Entras al sitio web de una tienda para comprar un artículo, todos los productos están sin imágenes, cuando ingresas a la página del producto no aparece la descripción del producto y la información del precio y las cuotas es un poco confusa. Después de mucho buscar puedes encontrar el producto que buscas pero la página no tiene botón de compra.

Sería una experiencia frustrante y simplemente cerrarías el sitio e intentarías comprar en otro.

Esto es más o menos lo que les ocurre a las personas que tienen algún tipo de discapacidad cuando acceden al 99% de las páginas web hoy en día.

¿Por qué invertir en accesibilidad en el e-commerce?

Alrededor del 8,4% de la población brasileña tiene algún tipo de discapacidad. Este valor representa más de 17,3 millones de personas que en conjunto generan alrededor de R$ 28,1 mil millones de ingresos personales al año.

Implementar la accesibilidad en tu tienda online significa cumplir con la Ley de Inclusión de Brasil (artículo 63). Además, aporta numerosos beneficios a la marca, como mejorar su posición en los rankings de los buscadores, mejorar la usabilidad, demostrar una actuación responsable y generar oportunidades comerciales.

Buenas prácticas de accesibilidad en el e-commerce

Después de comprender la importancia de tener un e-commerce accesible, puedes comenzar implementando los conceptos básicos de accesibilidad:

  • Navegación por teclado;
  • Enfoque visible al navegar por las teclas;
  • Mantener la opción de zoom desbloqueada;
  • Texto alternativo sobre imágenes no decorativas;
  • Botones y enlaces con texto descriptivo en lugar de texto genérico como “haz clic aquí”;
  • Alto contraste entre colores.

Además, pensando en los problemas más recurrentes que encontramos en las tiendas online, hemos separado algunas buenas prácticas enfocadas a la accesibilidad para el e-commerce. Compruébalo a continuación:

1) Modales (pop-ups):

El uso de modales es una práctica muy común y útil en el e-commerce, ya sea para recordar al usuario que se suscriba a la newsletter, avisar de una promoción o cupón de descuento.

El problema es que normalmente se abren más de un modal al mismo tiempo y sin que el usuario lo espere, lo que puede distraerlo o ponerlo ansioso, por lo que es importante evitar que se abran modales sin una acción previa por parte del usuario.

Y para garantizar la accesibilidad a través del lector de pantalla, el modal debe tener el foco del teclado cuando se abre y debe poder cerrarse usando la tecla ESC.

2) Teclas de acceso rápido:

Es importante facilitar la navegación a los usuarios que utilizan un lector de pantalla y/o acceden mediante teclado. Insertar accesos directos a las secciones más relevantes del sitio web evita que el usuario tenga que desplazarse por varios elementos hasta llegar al elemento deseado, por lo que es fundamental incluir un componente invisible en el diseño pero accesible al lector de pantalla que tiene accesos directos a el contenido principal, menú, búsqueda y pie de página del sitio web.

3) Acceso al soporte:

El acceso al soporte (chat, WhatsApp, teléfono, etc.) debe ser posicionado de manera visualmente clara en el sitio web, sin olvidar ser accesible a través del teclado, además de que para las opciones de servicio vía WhatsApp y teléfono, no basta con tener un texto con el número de teléfono, es obligatorio que exista un link que te lleva a las respectivas aplicaciones o enlace web en el caso de WhatsApp.

4) Árbol de categorías:

Garantizar que el árbol de categorías esté estructurado de forma sencilla y clara es fundamental para facilitar la navegación del usuario y conseguir que el menú no sea demasiado extenso y no haya repeticiones innecesarias de links.

5) Filtro de producto:

Las páginas de departamentos, categorías y búsquedas deben proporcionar una navegación clara e intuitiva con filtros relevantes como precio, color, voltaje, tamaño y material, por ejemplo.

6) Página del producto:

Se debe acceder fácilmente a la información principal del producto, como precio, valor de descuento, variación del sku, descripción del producto y opciones de pago en esta página, principalmente a través del lector de pantalla.

También para usuarios de lectores de pantalla, el botón de compra debe tener un texto descriptivo con el nombre del producto para no confundirse con el botón de compra de productos que aparecen en vitrinas.

Tener un cálculo de envío directamente en la página del producto también es fundamental para que el usuario no incluya en el carrito un producto que no pueda ser entregado en su domicilio.

7) Formularios:

Los formularios deben estar bien estructurados, con etiquetas descriptivas para cada campo. Los campos con un error deben mostrarse con texto que describa el error e instrucciones sobre cómo corregirlo, no limitado solo por el uso del color sino también con estímulos visuales y textuales de que hay un error en ese campo en particular.

8) CAPTCHA:

Los CAPTCHAs son mecanismos de seguridad para prevenir actividades maliciosas de software automatizado (bots) a través del famoso “No soy un robot”. En términos de accesibilidad, las personas con discapacidad visual son las más afectadas y por eso es importante garantizar que el CAPTCHA esté en portugués y tenga una opción de audio (también en portugués) como alternativa a las imágenes.

9) Cancelación de compra:

Todo consumidor tiene derecho a arrepentirse de su compra y la Ley de Comercio Electrónico (artículo 5 del Decreto 7.962/2013) deja claro que el usuario debe ser claramente informado de los medios para cancelar la compra.

10) Libras

Muchas personas sordas no dominan el portugués y por eso es importante ofrecer la traducción del contenido a LIBRAS a través de plugins de accesibilidad como HandTalk.

Es fundamental comprender que la accesibilidad es un proceso continuo y es fundamental que sea probada por personas con discapacidad. De esta manera podemos asegurarnos de que todos los usuarios puedan navegar, buscar y comprar productos con facilidad.

Si quieres acceder a más contenido como este, no olvides suscribirte a nuestra newsletter.

Escrito por:
Gabrielly Castro, Desarrolladora Front-end
at Corebiz