El pasado mes de febrero, el New York Times dio a conocer su selección de las mejores ilustraciones publicadas del 2019. Para ello, habilitó una web interactiva que te animo a visitar; no solo para deleitarte en algunas de las ilustraciones más top del momento, sino también para observar la creatividad e ingenio que han aplicado al propio diseño de la web.
En vez de hacer una simple recolección de imágenes estáticas, el New York Times ha incorporado algunos elementos interactivos para captar la atención del lector y despertar su espíritu de juego.
Por un lado, permite al usuario reordenar las palabras del título, “The Best of Illustration”, y, por otro, el cursor se convierte en un lápiz que anima al visitante a hacer sus propios garabatos sobre la página.
Se trata de detalles pequeños y puramente accesorios, pero, sin duda, muy bien logrados teniendo en cuenta la temática del artículo y sus potenciales lectores: lo más probable es que otros ilustradores o artistas sean los más interesados en ver las mejores ilustraciones del New York Times, así que, ¿por qué no permitirles a ellos también dibujar un poco?.
Con este ejemplo, el diseñador nos demuestra que ha pensado en su receptor final y en proporcionarle la mejor experiencia de usuario.
Seguro que más de una vez has visitado un sitio web y has sido incapaz de encontrar aquello que buscabas. Había demasiado información, contenido desordenado o los enlaces ni siquiera funcionaban. Sea lo que sea lo que dificultara tu navegación, esa web tenía un claro problema: no era “usable”.
La usabilidad web dictamina la facilidad con la que un usuario es capaz de interactuar con una página web y encontrar lo que busca de forma intuitiva.
¿Simple, verdad?
Sin embargo, a veces cuesta encontrar webs que cumplan con este requisito imprescindible.
El diseño siempre ha de girar en torno a la experiencia de usuario. Si tu web resulta difícil de navegar, tus visitantes se sentirán frustrados, lo cual acabará afectando a tu tráfico y, a largo plazo, al éxito de tu proyecto.
Por tanto, ¿qué aspectos has de tener en cuenta si quieres conseguir una buena usabilidad web?
Estructurar y jerarquizar la información. El usuario necesita orden para poder encontrar lo que busca. Por eso, antes de ponerte manos a la obra, te recomiendo que empieces con un simple árbol de contenidos. Este ejercicio te ayudará a visualizar la información de forma mucho más clara y ordenarla con coherencia. Luego, no tengas miedo a pedir feedback a personas ajenas a tu proyecto: si son capaces de orientarse por tu web sin necesidad de ayuda, es que has hecho un buen trabajo.
Reducir el número de clicks. Si bien puedes haber creado un camino coherente a seguir dentro de tu sitio web, ¿estás seguro de que es el camino más corto? El usuario quiere llegar a la información que le interesa de la forma más rápida posible, así que no añadas páginas intermedias o pasos extra que aumente el número de veces que ha de hacer click en tu web. Cíñete a lo esencial y elimina todo aquello que “sobre”. En la misma línea, asegúrate de que todos los enlaces funcionen correctamente y que el tiempo de carga de la web no supere los 20 segundos. Todos estos obstáculos no harán más que frustrar a tu visitante.
Tener un diseño responsive. Como mencionaba en el post anterior de Los 10 errores en diseño web que debes evitar, la gran mayoría de personas que navegan por Internet lo hacen a través de dispositivos móviles o tabletas, por lo que una web no adaptada a estos formatos está en clara desventaja con respecto al resto. Una web convertida a uso móvil no puede mantener la misma estructura, porque el tamaño de pantalla y forma de navegar del usuario no es el mismo. Aunque se ha de mantener la coherencia entre diseños, cada dispositivo requiere un enfoque propio.
Fomentar la accesibilidad. Otro aspecto importante a tener en cuenta es hacer que tu web pueda ser usada con facilidad por todo tipo de usuarios, incluyendo aquellos con discapacidades. Por ejemplo, una web accesible incluirá elementos como subtítulos en sus vídeos, para personas con dificultades auditivas, o descripciones ALT en las imágenes, para aquellos con visión reducida.
Ya lo dice el dicho: las primeras impresiones son las que cuentan.
Piensa en la web de tu empresa como tu carta de presentación al mundo. Tus clientes potenciales se harán una idea de cómo eres y cómo trabajas a través de lo que comuniques con ella. Si tu sitio web es difícil de navegar, presenta faltas de ortografía o contenido desactualizado, lo único que conseguirás es transmitir una imagen poco profesional de lo que tienes por ofrecer.
Si estás pensando en crear tu propio sitio o simplemente buscas mejorar el que ya tienes, aquí reúno algunos de los errores más frecuentes en diseño web:
Falta información o está mal organizada
No hay nada más frustrante para el usuario que buscar algo en una web y no encontrarlo. A veces, la información está allí, pero escondida o mal categorizada.
La organización previa es clave. Antes de empezar a diseñar tu web, hazte las siguientes preguntas:
¿Qué información van a querer ver mis usuarios?
De esa información, ¿qué es lo más importante y qué es lo que menos?
¿Cuál es el camino más lógico para llegar a esa información?
Pongamos un ejemplo: si tienes un apartado de “¿Quiénes somos?”, tiene sentido que dentro añadas subapartados como “Nuestra Historia”, “Dónde encontrarnos”, etc. Ahora bien, si tu negocio cuenta con un blog donde habla de las novedades del sector, o quizás ofrece muchos y variados servicios que quieres explicar detalladamente, ¿lo añadirías bajo esa misma pestaña? ¿Acaso no sería mejor crear otro apartado diferenciado?
Los textos son largos y difíciles de leer
¿Sabías que tardamos el doble en leer en pantalla que en leer sobre papel? La luz de las pantallas fatiga la vista y las webs suelen estar plagadas de distracciones visuales (banners, anuncios, etc), cosa que dificulta nuestra concentración y nos acaba empujando a leer en diagonal.
Si no quieres que tus usuarios se sientan fatigados, no llenes tu web de bloques de texto largos y farragosos. Sé breve y utiliza espacios en blanco para romper la información en bloques fáciles de digerir.
Hay tipografías y colores poco legibles
De nada sirve llenar tu web de contenido útil y atractivo si luego está presentada bajo una tipografía y color que dificulta la lectura. Como puedes imaginar, la combinación de colores más segura a la vista es texto oscuro sobre fondo claro, como negro sobre blanco.
El texto está justificado
De nuevo, no todo lo que funciona en papel tiene que funcionar en pantalla. Los textos justificados, aunque a simple vista parezcan más ordenados, dificultan la legibilidad del usuario web. Apuesta por texto no justificado y acertarás.
El diseño no es responsive
Hoy en día, el 90% de las personas que navegan la web lo hace a través de su smartphone. No tener una web adaptada a pantalla móvil o tableta es un error garrafal que impedirá a tus usuarios sentirse cómodos consultando tu web.
No hay contenido original
Si bien Internet nos ofrece un montón de recursos para crear una web atractiva de forma fácil (fotos de stock, información que podemos “copiar y pegar”, etc), es aconsejable crear nuestro propio contenido que dé personalidad a nuestro sitio.
Las plantillas o el uso exagerado de imágenes de stock puede dotar a tu web de un look genérico, nada memorable y poco trabajado. Y el duplicado de textos es penalizado por Google, ya que considera ésta una práctica engañosa para subir en posicionamiento.
El contenido no aporta nada
A veces nos encontramos con webs que tienen apartados con apenas una o dos líneas de texto y que fácilmente se podrían eliminar. Todo lo que aparece en nuestra web debería cumplir una función y ser de utilidad para el usuario. Al igual que en el punto anterior, Google penaliza la creación de páginas “en blanco”, ya que no aporta ningún valor para el usuario.
Los enlaces están rotos y la información, desactualizada
Es normal que, con el tiempo, algunas cosas que publicaste por primera vez en tu web hayan cambiado o estén obsoletas. Sin embargo, ¡muchos se olvidan de actualizar esta información en sus webs! Lo que acaba pasando es que el usuario se acaba encontrando información inútil que no se adapta a la realidad.
Lo mismo se aplica a los enlaces rotos. Siempre que añadas un enlace, verifica que vaya bien. Y si ves que no funciona, ¡cámbialo!
No hay imágenes de calidad
Una imagen vale más que mil palabras. No hay nada peor que encontrarse con una web que no cuida de su material visual. Eso incluye fotos borrosas, pixeladas o, simplemente, mal escogidas.
Las imágenes son demasiado pesadas
En la misma línea, al usar imágenes de calidad, ten en cuenta el peso final del archivo. Subir imágenes demasiado pesadas puede reducir la velocidad de carga de tu web, cosa desastrosa para cualquier usuario (¡nadie quiere esperar cinco minutos a que cargue una página!).
Además, Google también penalizará esta lentitud y te hará bajar posiciones.
Si quieres revisar buenas prácticas sobre enlazado y texto ancla, Google explica en su documentación oficial cómo crear enlaces descriptivos y rastreables.
En paralelo, si estás evaluando errores de contraste o jerarquía visual, merece la pena apoyarte en la guía oficial de WAI sobre contraste mínimo y en su tutorial sobre encabezados y estructura de página.
