12 trampas de accesibilidad para evitar

La usabilidad no es una ciencia exacta. Lo que un visitante considera útil, otro lo considera molesto. A pesar de esta incertidumbre y complejidad, siempre debe esforzarse para que su sitio sea lo más accesible posible para las personas a las que intenta llegar. Encontrará que un poco de atención a las necesidades especiales de una minoría de usuarios puede mejorar drásticamente la función de su sitio para todos los usuarios. Aquí está nuestra lista de doce escollos de accesibilidad para evitar junto con algunos ejemplos que muestran sitios que sobresalen o fallan miserablemente en estas áreas.

Captchas

A los desarrolladores web les encantan los captchas, pero los usuarios no los soportan. Concédelo, no todos son malos, pero la mayoría de ellos son imposibles de leer o innecesariamente complicados como el de arriba. Otro tema importante es que los captchas a menudo representan un obstáculo serio para las personas con discapacidad visual. Si es absolutamente necesario usar un captcha, asegúrese de que la mayoría de los seres humanos puedan leerlo / entenderlo y tener opciones para aquellos usuarios que no puedan verlo.

No está utilizando? Alt? Atributos en Imágenes

Definitivamente es una buena práctica siempre insertar un poco útil de alt Texto para las imágenes en su sitio. De esta manera, los usuarios que no pueden ver sus imágenes se representan con un texto equivalente. Tenga en cuenta que no todos los navegadores tratan el alt atribuir de la misma manera. Debido a esto muchos desarrolladores confunden el propósito de alt y título, pensando erróneamente que las imágenes con una alt atributo debe mostrar una punta de la herramienta. En realidad, la título atributo es lo que debería mostrar una sugerencia al pasar el mouse por encima (vea el ejemplo de Smashing Magazine más arriba).

Usando Pop Ups para contenido

La mayoría de los navegadores modernos aseguran que su contenido será bloqueado si se presenta en forma de una ventana emergente. Esto significa que está corriendo el riesgo de perder varios posibles usuarios que simplemente seguirán adelante cuando se den cuenta de que su sitio no es compatible con su configuración. Solo los visitantes más dedicados investigarán el problema en sus páginas de ayuda para descubrir cómo resolverlo.

Etiquetas inadecuadas en los formularios

Visite Mint.com (que se muestra arriba) y revise su formulario de registro. Observe que puede seleccionar un campo específico si hace clic en el campo en sí o en la etiqueta adjunta. Esto se debe a que los desarrolladores de Mint están utilizando el etiqueta elemento correctamente La lección aquí es que simplemente etiquetar sus formularios con texto simple no es suficiente. En su lugar, siempre debe utilizar el etiqueta Elemento para maximizar la usabilidad. Esto no solo proporciona campos fáciles de seleccionar, sino que también garantiza que los lectores de pantalla y las funciones de llenado automático funcionen correctamente con sus formularios.

Enlaces irreconocibles

La captura de pantalla anterior muestra una sección de la página de inicio del Tutorial 9. Observe que puede diferenciar instantáneamente entre el texto que contiene un enlace y el texto que no lo contiene. Las formas populares de crear la diferenciación de enlaces incluyen contraste de color, subrayados y efectos de rollover. ¡Observa que el Tutorial 9 emplea los tres métodos! Esto aumenta dramáticamente la facilidad de uso porque los usuarios pueden ver claramente dónde hacer clic si desean acceder a más contenido.

Texto de enlace vago

Considere los siguientes ejemplos:

1. Para visitar nuestra Galería CSS, haga clic aquí.
2. ¡Asegúrese de pasar por nuestra Galería CSS!

Al escanear una página, es probable que sus ojos se enfoquen en enlaces diferenciados más que en el resto del texto porque se destacan. El primer ejemplo puede parecer una buena manera de ir porque la llamada a la acción? Haga clic aquí? es lo que te llama la atención. Sin embargo, sin leer correctamente la oración completa, haga clic aquí. no inspira acción porque el usuario no está seguro de a dónde conduce. En contraste, el segundo enlace puede reconocerse y entenderse instantáneamente como una ruta a una galería CSS, independientemente de si el usuario ha leído el contenido antes o no.

Contenido desordenado y espacio insuficiente

El sitio anterior es en realidad más una parodia que un ejemplo apropiado, pero tiene el punto de vista y fue demasiado divertido como para no incluirlo. En pocas palabras, no mezcle su contenido o incluya una extraña cantidad de imágenes o texto (las noticias y publicaciones en el blog son excepciones). Los propietarios de pequeñas empresas que recién comienzan a usar la web casi siempre son víctimas de este error e incluyen un párrafo tras otro de la información que nadie leerá jamás. Nos guste o no, la web es una bestia visual. La información en su página debe estar claramente organizada y ser fácil de entender en segundos.

Cambiar el tamaño de fuente no debería romper el diseño

No todos en la web tienen 19 años y tienen una visión 20/20. Muchos usuarios, jóvenes y viejos, tienen que aumentar su tamaño de texto predeterminado para hacer que una página sea más legible. Vea qué sucede con Fox News (y varios otros sitios de noticias populares) cuando aumenta el tamaño de la fuente. El diseño está completamente destruido: todos los enlaces de navegación se ejecutan juntos, los botones están a millas de su texto asociado y los anuncios que se ejecutan en el lado derecho han desaparecido por completo. Este tipo de supervisión puede alienar a una gran parte de los visitantes.

Contraste pobre entre el texto y el fondo

Es posible que estos chicos estén usando sus habilidades de diseño, pero han arruinado su credibilidad al hacerlo con un gráfico casi imposible de leer. Entiendo que a veces los clientes requieren que use una foto de archivo con cero espacio de copia, pero su trabajo como diseñador es descubrir cómo integrar texto fácilmente legible con la imagen. Use texto en negrita, trazos, sombras, barras de color y cualquier otra cosa que pueda pensar para diferenciar su mensaje de su fondo.

Uso excesivo de Flash

No malinterpretes esto como un mantra de destello de destello. Flash ha llevado a la web a un nivel de riqueza que puede hacer realidad los sueños más salvajes de un desarrollador. Soy tan propenso a ser absorbido por un sitio flash increíble y único como el siguiente tipo.Sin embargo, tenga mucho cuidado al integrar Flash tanto en su sitio web que no funcionará sin él.

Asegúrese de considerar cuidadosamente la razón detrás de la existencia del sitio y su mercado objetivo para el sitio. Si desea crear una aplicación en línea o un atractivo visual para los visitantes, Flash puede ser el camino a seguir. Pero si su mercado objetivo es el público en general, un sitio completo de Flash puede ser una mala idea por varias razones. La primera es la facilidad de uso, los desarrolladores de sitios basados ​​en Flash a menudo pueden estar tan obsesionados con hacer algo bonito que no se piense si un usuario puede realmente averiguar cómo usar el sitio o no. Me he dado cuenta de que las agencias de publicidad de renombre tienden a seguir esta tendencia al crear sitios web hermosos que pueden tardar minutos en descubrir cómo usarlos. Otra razón para evitar Flash es que muchos usuarios están tan molestos con Flash que lo deshabilitan por completo. Finalmente, siempre considere si es aceptable sacrificar visitantes móviles. Muchos teléfonos inteligentes como el iPhone aún no admiten flash y, por lo tanto, están apagados en muchos sitios web convencionales.

Complicados menús desplegables

Hay una línea delgada entre un menú útil y un lío sobrecargado y los desarrolladores de Microsoft están coqueteando con él. Por un lado, brindan a los usuarios un fácil acceso a su línea completa de productos. Por otro lado, están lanzando una tonelada más de contenido a los usuarios de lo que están acostumbrados en un simple menú desplegable. Esto podría ser aceptable si hace clic en "Todos los productos". El botón lo llevó a una página dedicada que contiene la lista de productos, pero ese no es el caso (al hacer clic solo se cierra el menú). Pase un minuto en su sitio y verá que casi todos los menús de navegación están repletos de enlaces monótonos pequeños (posiblemente difíciles de leer).

El punto es que sobreponer los menús generalmente surge de un intento de aumentar la facilidad de uso, mientras que en realidad resulta en una disminución de la facilidad de uso debido a la excesiva cantidad de información que se debe examinar para llegar a donde quieres ir.

Conclusión

Así que ahí lo tienen, doce formas fáciles de hacer que su sitio sea más amigable para las masas. Espero que este artículo le haya ayudado a detectar algunas formas en que puede comenzar a mejorar la accesibilidad de sus diseños. Háganos saber lo que piensa de estos consejos. Siéntase libre de estar completamente en desacuerdo sobre cualquiera o todos ellos y asegúrese de informarnos sobre todas las pequeñas cosas que le molestan con respecto a la accesibilidad.