Más

    Primeros pasos con el diseño web inclusivo

    - Advertisement -



    Una parte clave del diseño de sitios web exitosos para los clientes es asegurarse de que tantos usuarios finales como sea posible puedan acceder y disfrutar de ese sitio.

    Entonces, ¿qué pasa si descubres que alrededor de mil millones de personas no pueden disfrutar de tus diseños? Incluso si esas personas logran hacer clic en un enlace y visitar el sitio web que creaste, es posible que no puedan entender lo que se vende o navegar a la página de pago.

    De acuerdo a estadísticas del Banco Mundial, hay mil millones de personas con discapacidad en todo el mundo. Eso es el 15% de la población total del globo.

    A pesar de esto, muchos diseñadores no tienen en cuenta a los clientes con diferentes capacidades al crear una aplicación o un sitio web atractivos. A menos que su cliente le diga explícitamente que está apoyando a clientes con discapacidades, es posible que ni siquiera piense en esos usuarios.

    Aprender a adoptar el concepto de diseño web inclusivo significa que ofrece mejores resultados a sus clientes; cuantos más clientes puedan alcanzar sus clientes, más elogios y críticas positivas obtendrán sus diseños.

    Entonces, ¿cómo introduce la accesibilidad en sus opciones de diseño?

    ¿Qué es la accesibilidad del sitio web?

    En términos generales, la inclusión se refiere a actividades o comportamientos que empoderan a las personas marginadas de la sociedad. Diseñar para la inclusión significa hacer que su contenido sea más accesible para cualquier persona que tenga un problema mental o físico que pueda dificultarles el uso de un sitio tradicional.

    En última instancia, la accesibilidad es uno de los principales objetivos de una estrategia de diseño inclusivo. Cuando hace que los sitios web o las aplicaciones sean más accesibles, modifica aspectos de su interfaz de usuario y código para que el sitio sea lo más accesible y utilizable posible para personas con ciertas limitaciones.

    De acuerdo con la Iniciativa de Accesibilidad Web, muchos sitios y herramientas web modernos están diseñados sin tener en cuenta las necesidades de las personas con discapacidades. Esto crea barreras de accesibilidad que hacen que los sitios web sean casi imposibles para algunas personas para usar.

    Estos son solo algunos de los diferentes tipos de discapacidad que pueden afectar la forma en que los usuarios finales interactúan con un sitio web o una aplicación:

    • Problemas cognitivos: Afectando la comprensión y dificultando la navegación por los sitios;
    • Problemas auditivos: Evitar que los clientes escuchen videos y contenido de audio;
    • Problemas neurológicos: Hacer que ciertos términos y acciones sean más difíciles en su sitio;
    • Problemas físicos: Hacer que sea difícil deslizar o tocar ciertas herramientas;
    • Problemas del habla: Un problema común con los diseños de interfaz de usuario de voz;
    • Problemas visuales: Prevenir una experiencia positiva en sitios altamente visuales.

    La accesibilidad web también puede tratarse de hacer la vida más fácil a las personas que encuentran problemas en situaciones particulares. Por ejemplo, las personas con problemas musculares pueden tener más dificultades para usar botones y enlaces en una pantalla pequeña.

    Entonces, ¿cómo haces que tus diseños sean más accesibles?

    Conozca a su audiencia

    Hay más en el diseño web inclusivo que hacer que sus fuentes sean un poco más grandes y esperar lo mejor. Para brindar una experiencia verdaderamente accesible, debe conocer las personas y los grupos a los que se dirige su cliente. Dedicar un tiempo a revisar las personas de los usuarios de sus clientes y hacerles preguntas sobre las personas con discapacidad puede ayudarlo a tomar decisiones informadas.

    por ejemplo, el Kit de herramientas de diseño inclusivo de Microsoft pide a los diseñadores que reconozcan la exclusión, examinen las partes de su sitio web que podrían ser inaccesibles y aprendan de la diversidad.

    Antes de diseñar cualquier cosa, pregúntate si puedes:

    • Aborde cualquier necesidad única, como problemas de la vista o problemas auditivos;
    • Reemplace las soluciones tradicionales con algo más exclusivo. Por ejemplo, en lugar de depender de los colores para resaltar una parte del texto, ¿podría usar el peso de fuente en su lugar? Esto podría ser ideal para alguien con daltonismo;
    • Cree algo que atraiga tanto a los clientes con y sin discapacidades.

    Diseñe un diseño limpio y claro

    Cualquier diseño de sitio web debe centrarse primero en la claridad.

    Ya sea que esté diseñando para la inclusión o no, el objetivo debe ser brindar una experiencia lo más simple y directa posible, evitando cualquier pecado de diseño web en el camino.

    Por ejemplo, a nadie le gusta un diseño desordenado lleno de señales de navegación poco razonables. Necesita un sitio lleno de enlaces comprensibles, botones en los que sea fácil hacer clic en cualquier pantalla y fuentes grandes que sean fáciles de leer.

    Cada vez que esté creando un nuevo elemento para un sitio web o una aplicación, pregúntese cómo puede hacer la vida más fácil para los clientes de todos los orígenes. Por ejemplo, parque parramatta utiliza un excelente contraste, fuentes claras y un tamaño de elemento ideal para garantizar que su sitio web se sienta lo más fácil de usar posible para los clientes.

    📷 Primeros pasos con el diseno web inclusivo

    Observe cómo los botones son claros y fáciles de presionar. Los colores son brillantes y atractivos en cualquier pantalla, y la navegación también es fácil de seguir. Recuerde, cuando esté diseñando un prototipo inclusivo:

    • Pruebe las opciones de navegación y asegúrese de que sean fáciles de usar;
    • No abarrotes la pantalla, recuerda que menos es más a la hora de reducir la carga cognitiva;
    • Asegúrese de que su diseño siga siendo fácil de usar en cualquier pantalla.

    simplificar el idioma

    Los elementos visuales en un sitio web inclusivo deben ser tan simples y fáciles de entender como sea posible. Sin embargo, es importante no olvidar la forma en que manejas la palabra escrita también.

    El uso de términos simples en lugar de la jerga compleja de la industria puede marcar una gran diferencia para las personas con problemas de lectura. También hay que pensar en la tipografía, desde el color y el contraste de sus palabras contra el fondo elegido hasta la claridad de la fuente.

    Recuerde, el diseño subóptimo con imágenes y lenguaje también afecta a las personas sin discapacidades. Seguir las reglas básicas para simplificar ofrece una mejor experiencia para cualquier persona que visite su sitio.

    Asegúrese:

    • Enlaces subrayados, en negrita o redimensionados para lograr un contraste visual;
    • Refuerce el espaciado de línea adecuado con alrededor de 1,5 veces el tamaño de fuente;
    • Habilite el espaciado de párrafo consistente;
    • Utilice un lenguaje sencillo para reducir la carga cognitiva;
    • Describa las abreviaturas cuando las use;
    • Use encabezados claramente redactados para estructurar el contenido de manera lógica;

    Mire las opciones de diseño para texto sobre la Nomensa sitio web, por ejemplo. Un montón de espacio en blanco hace que el contenido sea más fácil de leer. Las palabras simples son comprensibles y atractivas. Incluso la elección de la fuente imita el logotipo al tiempo que ofrece legibilidad.

    📷 1654978759 996 Primeros pasos con el diseno web inclusivo

    Optimizar los colores del diseño web

    Las tendencias de diseño web inclusivo van y vienen. Sin embargo, el color y el contraste siempre serán fundamentales en tus decisiones.

    Al asegurarse de que sus elementos de diseño cumplan con las proporciones mínimas de contraste de color definidas por las WCAG, significa que está apoyando la legibilidad para los usuarios con discapacidades visuales y mejorando las experiencias para los clientes que no tienen discapacidades visuales también.

    Para los diseñadores que necesitan ayuda adicional en esta área, herramientas como Rígido ayudar a medir el contraste de color. Esta herramienta también ofrece una gama de otras herramientas destinadas a apoyar la accesibilidad también.

    📷 1654978760 235 Primeros pasos con el diseno web inclusivo

    Recuerda, la proporción mínima a la que necesitas acceder dependerá del elemento que estés diseñando. Las WCAG recomiendan las siguientes pautas:

    • relación 3:1 para objetos gráficos (gráficos);
    • relación 3:1 para enfoque, estados activos y desplazamiento;
    • Proporción 3:1 para elementos en los que se puede hacer clic y componentes de formulario.

    Mientras trabaja en sus estrategias de contraste de color con aplicaciones como Stark, asegúrese de considerar también las necesidades de los usuarios daltónicos. El 4,5% del mundo no ve el color de la misma manera que los demás. Si le resulta difícil lograr el contraste correcto mientras se apega a las pautas de la marca de su cliente, intente subrayar y poner en negrita los elementos también.

    Considere elementos de video y audio

    Finalmente, en estos días, más empresas están optando por incorporar contenido de video y audio en sus sitios. Estas herramientas visuales y auditivas pueden ofrecer información útil sobre una marca y lo que hace. Sin embargo, podría tener dificultades para entregar información vital a algunos clientes solo a través de video y audio.

    Los subtítulos para el contenido de video podrían ser esenciales para las personas con pérdida auditiva. Es posible que deba pensar en agregar transcripciones a videos pregrabados a los que puedan acceder las personas con discapacidad auditiva. Estas transcripciones y subtítulos también son útiles para cualquier persona que no tenga acceso al audio en teléfonos inteligentes o computadoras.

    Las transcripciones también pueden ayudar a las personas con discapacidades visuales al brindarle a la herramienta de texto a voz algo que describir a su usuario. De esa manera, todos obtienen información útil. Mirar este video subtitulado de la Universidad de Washington, por ejemplo. Asegura que todos puedan entender lo que está pasando en el contenido. Si agrega transcripciones a las páginas de su sitio web para los clientes, también podría ayudarlos a beneficiarse de un SEO mejorado. Las transcripciones brindan más oportunidades de clasificación de palabras clave que los videos y los podcasts por sí solos.

    Diseño para la accesibilidad primero

    Para que los diseñadores se destaquen en la entrega de entornos de interfaz de usuario verdaderamente inclusivos, deben ser tan buenos en la creación de sitios web para personas con discapacidades como en la creación de interfaces para personas como ellos. Como diseñadores, tratamos de ser lo más inclusivos posible, pero es fácil quedar atrapado pensando en hacer que un sitio web sea más fácil de usar para nosotros.

    Si puede ponerse en el lugar de alguien que no es como usted y pensar primero en las necesidades poco comunes, es posible que descubra que ofrece una experiencia más sólida y atractiva para cada usuario.

    Por ejemplo, en lugar de diseñar un sitio web para alguien con las mismas necesidades visuales que usted, y luego pensar en hacer ajustes para aquellos con daltonismo o problemas de visión, piense primero en las necesidades de las personas con discapacidades.

    Puede obtener más información sobre cómo priorizar las necesidades poco comunes consultando la publicación de blog de Vasilis Van Gemert en el «método de crisis.”

    La accesibilidad es buena para los negocios

    El diseño web inclusivo, o diseñar para la accesibilidad, se trata de maximizar la audiencia potencial que sus clientes pueden ganar. Independientemente de la situación en la que se encuentren los usuarios finales, debe asegurarse de aprovechar el diseño inclusivo.

    Si puede demostrarles a sus clientes que puede cumplir con las necesidades de todos los clientes, puede desbloquear una audiencia mucho más grande y muchas más oportunidades.

    Populares

    Más de esta categoría

    DEJA UNA RESPUESTA

    Por favor ingrese su comentario!
    Por favor ingrese su nombre aquí

    This site uses Akismet to reduce spam. Learn how your comment data is processed.