Hacer que su sitio web sea lo más accesible posible es importante si desea aumentar su audiencia potencial. Sin embargo, hay muchos pequeños errores de diseño web que puedes cometer sin darte cuenta de cuánto afectan la accesibilidad de tu sitio web.
El diseño web afecta todo, desde cómo los usuarios perciben su sitio hasta la forma en que interactúan con él. Por lo tanto, tomar buenas decisiones de accesibilidad puede aumentar la facilidad de uso de su sitio. En este artículo, profundizaremos en la importancia del diseño web cuando se trata de accesibilidad. Luego, hablaremos sobre cuatro errores de accesibilidad de diseño web que debe evitar, discutiremos por qué y le mostraremos cómo evitarlos.
¡Hablemos de diseño!
La accesibilidad web es simplemente la práctica de optimizar los sitios para que la mayor cantidad posible de personas puedan usarlos. En muchos casos, esto se refiere específicamente a asegurarse de que las personas con discapacidad puedan usar su sitio web o aplicación. Ya hemos hablado de ese tipo de optimización de la accesibilidad antes. Sin embargo, para este artículo queremos centrarnos en la estrecha relación que existe entre el diseño web y la accesibilidad.
Puedes tener un sitio web increíble en tus manos, pero sin un diseño atractivo, es posible que las personas no le presten atención. Aun así, cuando diseñes tu sitio, no debes concentrarte únicamente en hacerlo lo más hermoso posible. También debe tener en cuenta que las elecciones de diseño que haga pueden afectar la facilidad con la que se interactúa. En otras palabras, existe una correlación directa entre un diseño excelente y un buen nivel de accesibilidad.
Por ejemplo, imagina que el fondo de tu sitio es blanco y decides hacer que tu texto tenga un tono azul claro:
Esta opción de diseño no funciona porque no tiene en cuenta la accesibilidad. Una opción mucho mejor sería usar un color más oscuro para el texto, de modo que sea claramente visible sobre un fondo blanco. Los errores de accesibilidad pueden afectar a su sitio web de innumerables maneras, como por ejemplo:
- Aumentar su tasa de rebote . Si su sitio es demasiado difícil de usar, los visitantes pueden optar por buscar en otra parte.
- Impactando sus tasas de conversión. Su sitio web debe convencer a los usuarios de que la conversión es lo mejor para ellos, y las malas opciones de accesibilidad pueden socavar ese objetivo .
- Usar su sitio web no será agradable. Si navegar por su sitio es una molestia debido a las malas elecciones de diseño, muchas personas probablemente no se molestarán en volver.
Idealmente, su sitio web debe ser elegante y fácil de usar. Si puede lograr esa combinación y respaldarla con contenido excelente, tendrá un ganador en sus manos.
4 errores de accesibilidad en el diseño web que debes evitar
Hay muchas maneras en que el diseño puede afectar la accesibilidad de su sitio web. Sin embargo, evitar estos cuatro errores debería resultar en un sitio con una buena base de accesibilidad. Comencemos hablando de imágenes y texto.
1. Incluir texto en tus imágenes
Como regla general, no debe incluir texto en sus imágenes a menos que pueda asegurarse de que los usuarios de dispositivos móviles puedan leerlo.
Uno de los errores más comunes que cometen las personas en el diseño web es incluir texto importante dentro de las imágenes. Por ejemplo, en la captura de pantalla al comienzo de esta sección, puede ver que hay texto dentro de la imagen, pero dado que es solo decorativo, no hay inconveniente en usarlo.
Sin embargo, incluir texto que es esencial para que sus visitantes lean dentro de sus imágenes generalmente es un no-no. Esto se debe a que muchos probablemente verán su sitio web en pantallas más pequeñas, lo que significa que su texto podría volverse menos legible a medida que se reduce. Además, los motores de búsqueda no pueden leer el texto dentro de las imágenes, por lo que incluir contenido importante dentro de ellas es una gran oportunidad de optimización.
Aquí hay una buena regla general:
Si tu texto es importante, no uses una imagen para decirlo.
Si tiene que incluir imágenes con texto, también puede dar contexto usando el cuerpo del texto. De esa manera, incluso si la imagen es un poco difícil de distinguir en un dispositivo más pequeño, el lector no se perderá nada.
2. Usar encabezados incorrectamente
Los subtítulos siempre deben ser informativos, en lugar de solo remates.
Cuando trabaja en un sitio web de WordPress con mucho texto, los encabezados y subtítulos son algunos de sus mejores amigos. Mucha gente se siente intimidada por los bloques de texto, por lo que debe encontrar formas de dividirlos.
Los saltos de párrafo son esenciales, por supuesto. Sin embargo, también puede usar imágenes, listas, tablas y otros elementos visuales para dividir el texto. Sin embargo, en nuestra opinión, la herramienta más poderosa a su disposición para esto son los encabezados. Cuando las personas se desplazan por su contenido, solo sus encabezados deben pintar una imagen precisa de lo que van a encontrar.
También es importante que no convierta texto aleatorio en encabezados, ya que los motores de búsqueda usan esas etiquetas para descubrir de qué trata su contenido. Aquí hay algunos consejos útiles para asegurarse de que siempre use los encabezados correctamente:
- Use subtítulos para presentar nuevas secciones de su contenido. Por ejemplo, nos gusta separar las secciones de nuestro artículo usando subtítulos.
- Evite el uso de subtítulos vagos. Los subtítulos no deben insinuar lo que hay dentro, sino explicarlo lo mejor posible.
- Utilice fuentes que sean fáciles de leer . Si los visitantes tienen que hacer un esfuerzo para averiguar lo que dicen sus encabezados, tiene un serio problema de accesibilidad en sus manos.
En estos días, la mayoría de las personas hojean el contenido en línea en lugar de leerlo todo. Esto significa que los subtítulos son especialmente importantes, ya que es más probable que capten la atención de los visitantes y los guíen a las secciones que más les interesan.
3. Usar colores similares en tus diseños
Si usa colores que son demasiado similares a lo largo de su diseño, puede ser difícil distinguir las secciones individuales.
Los colores que eliges para el diseño de tu sitio web son más importantes de lo que imaginas. No es suficiente elegir colores que se vean bien juntos, también deben hacer que su contenido se destaque para que los usuarios puedan distinguir secciones importantes fácilmente.
Al comienzo de este artículo, le mostramos un ejemplo de lo que sucede cuando intenta poner texto claro sobre un fondo blanco. Hace que sea difícil para los visitantes distinguir cada elemento, algo que debes evitar. En términos generales, debe aspirar a un nivel decente de contraste para poder diferenciar fácilmente los elementos.
Tome el ejemplo al principio de esta sección. Usamos un fondo gris claro para el índice de nuestro blog. Además de eso, colocamos tarjetas blancas para cada publicación del blog, y siempre que sea posible, nos gusta usar imágenes destacadas coloridas. Si bien el blanco y el gris son bastante similares, hay suficiente contraste para que sea fácil diferenciar entre cada publicación. Además, elementos importantes, como el botón VER PUBLICACIÓN COMPLETA, se destacan por sí solos gracias a nuestra elección de colores. Aquí hay algunos puntos clave de nuestra implementación que pueden ayudarlo a mejorar la accesibilidad de su sitio usando el color:
- Apunta a un nivel decente de contraste entre los elementos de tu página. Sus visitantes deben poder distinguir cada elemento de su sitio de un vistazo, así que no tenga miedo de arrojar algunos colores fuertes y contrastantes allí.
- Use una rueda de colores para ayudarlo a elegir los tonos correctos. Las ruedas de colores te facilitan encontrar tonos que contrasten bien entre sí.
- Desarrolle una paleta de colores para su sitio web y apéguese a ella. La consistencia es clave si desea crear una identidad de marca en todo su sitio web.
Usar el contraste correctamente es una excelente manera de aumentar la accesibilidad de su sitio. Sin embargo, desea asegurarse de que haya cierto nivel de consistencia en los colores que elija. De lo contrario, se verá como si hubiera creado un diseño a toda prisa, y es probable que el resultado no sea divertido para que sus visitantes naveguen.
4. Diseño de formularios difíciles de usar
Los formularios de contacto deben ser fáciles de usar, pero eso no significa que tengan que ser aburridos.
Los formularios no reciben tanto amor como deberían, especialmente porque son uno de los elementos más importantes de su sitio. Permiten a los usuarios ponerse en contacto contigo sin tener que compartir tu correo electrónico públicamente. Esto significa que son directamente responsables, como mínimo, de muchas conversiones.
Por ejemplo, también puede usar formularios para permitir que los visitantes se registren en su lista de correo. Como sabrá, las listas de correo son una de las herramientas de marketing más poderosas a su disposición, por lo que solo debería ser razón suficiente para prestar más atención al diseño de su formulario.
Si sus formularios no son intuitivos, pueden afectar directamente la cantidad de personas que los usan, lo que puede perjudicar sus conversiones. Sin embargo, hay algunos consejos de diseño que debe tener en cuenta para que sean fáciles de usar:
- Establezca bordes para sus campos siempre que sea posible. Los campos sin bordes en los formularios pueden verse bien, pero dificultan que los usuarios descubran dónde comienza cada uno.
- Agregue etiquetas a sus campos. Con las etiquetas, los visitantes sabrán exactamente qué escribir en cada campo.
- Diseñe botones de envío que sean fáciles de ver y hacer clic. Su botón de envío debe ser fácil de detectar y hacer clic, especialmente desde dispositivos móviles.
La buena noticia es que sus formularios no necesitan ser aburridos para ser accesibles. Si está luchando por encontrar inspiración, aquí hay algunos diseños de formularios elegantes para ayudar a que fluya su creatividad.
Conclusión
El diseño web y la accesibilidad van de la mano. Crear un sitio web que sea altamente accesible no significa que deba verse aburrido. Simplemente significa que debe tener en cuenta las mejores prácticas de accesibilidad y encontrar una manera de incorporarlas en sus diseños.
Aquí hay cuatro errores que mucha gente comete cuando se trata de accesibilidad en el diseño web, que debe evitar:
- Incluir texto en tus imágenes.
- Usar encabezados incorrectamente.
- Usar colores similares en todo su sitio.
- Diseño de formularios que son difíciles de usar.
¿Tiene alguna pregunta sobre cómo mejorar la accesibilidad de su sitio web? ¡Hablemos de ellos en la sección de comentarios a continuación!
Imagen en miniatura del artículo de Dooder / shutterstock.com.