Página de pago accessible

Jan 14, 2025

1 Características principales
2 Mejoras de accesibilidad
- 2.1 Tamaño de texto ajustable
- 2.2 Fuentes Lexend
- 2.3 Ajustes de espaciado entre letras
- 2.4 Modo de alto contraste
3 Cumplimiento de accesibilidad
- 3.1 WCAG 2.1
- 3.2 RGAA
4 Diseño y disposición
5 Medidas de seguridad

La nueva Página de pago presenta una interfaz moderna, accesible y fácil de usar, que mejora tanto la experiencia del usuario (UX) como la interfaz del usuario (UI). Esta página está diseñada para satisfacer las necesidades de una audiencia global diversa, ofreciendo una integración perfecta con múltiples opciones de pago.

Características principales

Característica	Descripción

Característica	Descripción
Opciones de pago	Tarjeta: Ingrese los detalles de la tarjeta (nombre, número, vencimiento, CVC). WeChat & Alipay: Métodos de pago alternativos.
Selección de Cobadge	Para los usuarios con tarjetas Cobadge, ofrecemos la posibilidad de elegir su esquema de pago preferido.
Personalización	Los comerciantes pueden reemplazar el logotipo superior izquierdo predeterminado con el logotipo de su propia empresa para alinear la marca.
Modo oscuro y claro	La página detecta automáticamente el tema del sistema operativo del usuario y aplica el modo oscuro o claro correspondiente..
Información del pedido	Muestra la factura y la dirección de facturación para garantizar la transparencia.
Detalles del carrito	Una barra lateral opcional que muestra los montos totales y subtotales para mayor claridad.

ℹ️ Nota: Los comerciantes pueden activar o desactivar la barra lateral de Detalles del carrito, según sus necesidades específicas.

Mejoras de accesibilidad

Esta página cumple con los estándares WCAG 2.1 y RGAA, y ofrece las siguientes funciones de accesibilidad:

Tamaño de texto ajustable

Los usuarios pueden seleccionar entre tres tamaños de texto:

Pequeño (Aa): tamaño estándar para la mayoría de los usuarios.
Mediano (Aa): tamaño aumentado para una mejor legibilidad.
Grande (Aa): optimizado para usuarios con discapacidades visuales.

💡 Caso de uso de ejemplo: un usuario con baja visión puede aumentar el tamaño del texto y habilitar el modo de alto contraste para una navegación más sencilla..

Fuentes Lexend

Utilizamos fuentes Lexend, diseñadas específicamente para reducir el estrés visual y mejorar el rendimiento de lectura. Si bien inicialmente estaban pensadas para usuarios con dislexia y lectores con dificultades, estas fuentes también son beneficiosas para todos, ya que mejoran la legibilidad general.

Ajustes de espaciado entre letras

Tres niveles de espaciado para adaptarse a las preferencias del usuario:

Predeterminado (Aa).
Moderado (Aa).
Ancho (Aa).

Modo de alto contraste

Alterna para mejorar la visibilidad del texto en relación con el fondo para usuarios con baja visión o condiciones visuales específicas.

⚠️ Advertencia: Los usuarios con discapacidades visuales complejas pueden necesitar herramientas de asistencia adicionales para una funcionalidad óptima.

Cumplimiento de accesibilidad

WCAG 2.1

La página se alinea con los principios clave:

Perceptible: Las configuraciones visuales ajustables hacen que el contenido sea accesible.
Operable: El diseño intuitivo permite una navegación fluida.
Comprensible: Las etiquetas claras y los mensajes de error mejoran la usabilidad.
Robusta: La compatibilidad con tecnologías de asistencia garantiza un amplio acceso.

✅ Éxito: La página de pago pasó las auditorías de accesibilidad internas, lo que confirma su cumplimiento con los estándares WCAG 2.1..

RGAA

Nos comprometemos a mejorar continuamente nuestro cumplimiento de accesibilidad en función de los estándares RGAA.

Nuestro progreso en el cumplimiento de la RGAA está documentado en nuestro informe de autoevaluación.
Esto demuestra nuestro compromiso de garantizar la accesibilidad para todos los usuarios.

ℹ️ Nota: Se planean actualizaciones periódicas para mejorar los puntajes de accesibilidad y mantener el cumplimiento de los estándares de la RGAA.

Diseño y disposición

Elemento	Descripción

Elemento	Descripción
Opciones de idioma	Compatible con inglés, francés, español, alemán, italiano y chino simplificado (繁體中文).
Validación de formularios	Los mensajes de error en tiempo real guían a los usuarios para corregir errores y lograr una entrada sin inconvenientes.
Diseño adaptable	Optimizado para computadoras de escritorio, tabletas y dispositivos móviles para brindar una experiencia consistente.

Medidas de seguridad

Garantizamos transacciones seguras y privacidad de datos:

Procesamiento de pagos seguro: compatible con los protocolos estándar de la industria.
Privacidad y políticas: enlaces claros a la Política de privacidad, Términos y condiciones, Política de cookies y Quejas para la confianza del usuario.