¿Cuáles son el Top 10 de los errores en diseño web de 2021? Lo cuenta Nielsen Norman Group.

No es la primera vez que hacen esta recopilación: empezaron en 1996, después en 2002, 2005, 2011 y 2016, y ya nos hicimos eco de la recopilación de errores en 2005. Y ahora vuelven con una nueva edición. 

Actualmente los errores más comunes no son tan graves como al principio, pero todavía hay algunos de ellos que se siguen manteniendo a día de hoy.

Para Jakob Nielsen, un mal diseño web es aquel que es: 

  • Malvado: cuando el diseño de un sitio tiene un propósito consciente de ser malo para las personas usuarias.
  • Estúpido: cuando los errores en diseño se dan porque no se ha sabido hacer de una mejor forma.  
  • Perezoso: en este caso las persona que diseñan saben que el diseño está mal, pero no lo arreglan. 

Además, para considerar un error en el top 10, Jacob Nielsen dice que el problema tiene que cumplir con otros dos “requisitos”: ser muy molesto para las personas usuarias, y, además, repetirse en muchísimos sitios web diferentes.

10 de errores en diseño web en 2021

Top 10 errores en diseño web en 2021

#10. Diseño móvil en pantallas grandes 

Este error se da cuando se diseña para un medio diferente al que utiliza la persona usuaria. Ocurre cuando se diseña para móvil, pero, sin embargo, en una pantalla de escritorio el diseño no funciona correctamente. Hace años el error era justamente el contrario: únicamente se diseñaba para escritorio, y se producía el error de que no se adaptaba correctamente a las pantallas de móvil.

Tenemos que diseñar para que los productos digitales sean funcionales tanto en escritorio como en móvil, sin dejar de lado ninguna de las dos modalidades. 

#9. Utilizar una imagen hero muy grande en la parte visible (above the fold) 

Above the fold es la expresión que define la parte del sitio web que las personas usuarias ven primero, sin necesidad de desplazarse con el ratón. Utilizar una imagen muy grande allí perjudica la usabilidad, ya que si lo único que puedes ver es una gran imagen que ocupa toda la pantalla es más difícil que encuentres las acciones que puedes realizar de un primer vistazo. Tenemos que mostrar a los usuarios qué es lo que pueden hacer con una buena comunicación.

#8. Cambio de diseño al cargar la página 

Es un error técnico, que ocurre cuando los elementos de la página se mueven porque tienen que hacer espacio para otros nuevos que se están cargando. Esto es un gran problema de usabilidad porque las personas usuarias son muy impacientes, y tener que esperar y ver cómo se cargan los elementos es un inconveniente.

#7. Iconos sin etiquetas 

Para crear una experiencia perfecta necesitamos ambos elementos. Si reutilizamos iconos sin etiquetas, estos pueden significar diferentes cosas en diferentes lugares y pueden llevar a error. Además, si el icono representa una acción complicada y no tiene etiqueta, las personas usuarias pueden tener miedo aplicar sobre el icono sin saber qué va a ocurrir.

Iconos y etiquetas
Ejemplo de iconos sin y con etiquetas

#6. No permitir copiar y pegar 

Este es un error de código (normalmente de javascript), que impide seleccionar elementos como texto o imágenes para copiar y pegar en otro lugar. Este error supone un gran inconveniente porque elimina la posibilidad de que las personas usuarias copien una información y la trasladen al lugar que deseen, con un comando estándar que todos conocemos: ctrl c + ctrl v.

#5. Campos para rellenar poco flexibles 

Por ejemplo, si tenemos que rellenar un número de tarjeta, un número de identificación personal, el código postal, un número de teléfono o cualquier otro tipo de información similar, normalmente el sitio web lo querrá sin espacios. Sin embargo, uno de los principios de la psicología dice que los humanos estamos acostumbrados a agrupar la información para recordarla mejor, por lo que si intentamos escribirla con un formato que no es aceptado, puede perjudicar la usabilidad y producir frustraciones. 

#4. Bajo contraste y textos demasiado pequeños 

Este es un gran problema de accesibilidad que nos podemos encontrar a día de hoy. Además, es uno de los problemas que llevan las listas desde hace muchos años, y tenemos que trabajar para que este punto deje de estar en el top 10.

Siempre tenemos que diseñar teniendo en mente la accesibilidad para construir productos más inclusivos

#3. Enlaces que provocan confusión y no cumplen con las expectativas 

Un enlace es una promesa de que si clicas ahí te va a llevar al sitio deseado. Si creamos enlaces que no cumplen con la acción deseada y esperada, la experiencia de las personas usuarias se ve claramente afectada.

#2. Tiempo de respuesta muy lento 

Hace años este problema se daba porque la conexión a Internet de las personas usuarias era muy lenta. Sin embargo, actualmente eso ya no es un problema generalizado. Ahora las páginas son lentas por la cantidad de elementos que tienen que cargar. Pero la regla de usabilidad no ha cambiado: el objetivo es que cargue en un segundo o menos. 

#1. Popups y overlays

En términos de usabilidad los popups no son lo más adecuado. Además, el problema viene cuando hay muchos en la misma página, como uno con una oferta especial, otro para suscribirte a la newsletter y otro, por ejemplo, para aceptar las cookies. Esto conlleva que hay que cerrar todas estas pestañas antes de poder hacer lo que querías en esa página. 

El consejo que da Jakob Nielsen es directamente que no cometamos estos errores. Como personas expertas en UX tenemos que tener en cuenta todos y cada uno de los aspectos que pueden perjudicar la experiencia de las personas usuarias.

Sigamos trabajando para ofrecer las mejores experiencias posibles y reducir el top 10 del 2022.   

Si quieres conocer otros errores que se comenten habitualmente en sitios web no te pierdas estos artículos: 

Asienta las bases teóricas y las prácticas clave de UX para mejorar el proceso de diseño de productos digitales.

Entiende el enfoque del diseño centrado en el usuario y aplícalo en tus proyectos con la certificación internacional UX-PM Nivel 1: Adoptar UX.

¿Quieres más información? Visita UX Learn para conocer las fechas de las próximas convocatorias.


En Torresburriel Estudio trabajamos los procesos de diseño de producto digital para lograr los objetivos definidos junto con nuestros clientes.