viernes, 23 de septiembre de 2016

Top 10 errores de diseño web


Jakob Nielsen ha recopilado a lo largo de los años los errores más comunes que se realizan en el diseño web. A continuación, el top 10 de ellos (Enlace original):

1. Buscadores internos malos (Bad Search)

Los motores de búsqueda excesivamente estrictos reducen su usabilidad ya que no están preparados para manejar los errores tipográficos, plurales, guiones y otras variantes posibles de los términos que se están buscando. Esto dificulta su uso para todos los usuarios, especialmente para los usuarios de mayor edad.

Un problema relacionado con estos motores de búsqueda es cuando priorizan los resultados en base a la cantidad de entradas que tienen bajo el término buscado en vez de priorizar por la importancia de cada documento. Lo ideal sería que el motor de búsqueda mostrara primero una serie de "Mejores opciones" al inicio de la lista de resultados (especialmente a la hora de búsquedas importantes, como podría ser la búsqueda del nombre de los productos de la empresa).




2. Archivos PDF para lectura online
Los usuarios odian el hecho de tener que tratar con archivos PDF cuando están navegando ya que rompen sus esquemas. Cualquier simple acción como podría ser imprimir o guardar un documento se dificulta mucho ya que los comandos estandarizados en los navegadores no funcionan.

El usuario también se enfrenta a otros problemas al tratar con archivos PDF:
  • El diseño de un archivo PDF , a menudo, está optimizado para ser usado en una hoja de papel, lo cual raramente coincide con el tamaño del navegador del usuario. 
  • El contenido del archivo suele estar organizado de forma que la navegación por él no es tan fluída como debería ser.
  • Las fuentes son demasiado pequeñas.
Los archivos PDF son geniales para su impresión y para la distribución de manuales y otros grandes documentos que necesitan ser impresos. Usadlos solo para ese propósito y convertid cualquier información que tenga que estar en la web o que tenga que ser leída en una pantalla en páginas web reales.


3. No cambiar el color de los links visitados
Una buena comprensión de la navegación pasada ayuda a entender nuestra ubicación actual, ya que es la culminación de su viaje. Conocer las localizaciones pasadas y presentes hace que sea más fácil decidir a dónde ir. Los enlaces son un factor clave en este proceso de navegación. Los usuarios podrían ignorar enlaces que no fueron útiles en visitas anteriores o, por el contrario, podrían volver a enlaces que les fueron útiles en el pasado.

Más importante aún: Saber en qué páginas han estado ya libera a los usuarios de volver a visitar involuntariamente las mismas páginas una y otra vez.

Estos beneficios solo pueden ser obtenidos bajo una única premisa: Que el usuario puedan ver la diferencia entre los enlaces visitados y no visitados porque el sitio web los muestra de colores diferentes. Cuando un enlace visitado no cambia de color el usuario es expuesto a una navegación más desorientada y suele volver a visitar las mismas páginas repetidas veces.


4. Texto difícilmente analizable (Non-Scannable text)
Un "muro de texto" es un gran obstáculo para una experiencia interactiva. Intimida. Es aburrido. Doloroso de leer.

Hay que escribir para ser leído online, no para imprimir. Para sumergir a los usuarios en el texto ayudarles a profundizar en ellos hay que usar trucos de buena documentación:
Subtítulos.
Listas con iconos.
Palabras clave resaltadas.
Párrafos cortos.
La pirámide invertida.
Estilo simple de escritura.


5. Tamaño de fuentes fijo
Las hojas de estilo CSS, desafortunadamente, dan a los sitios web el poder de desactivar en los navegadores el botón de cambiar el tamaño de las fuentes y especificar un tamaño de fuente fijo. Casi siempre este tamaño de fuente fijado es pequeño, reduciendo la capacidad de lectura significantemente para las personas de mayor edad.

Respeta las preferencias de tus usuarios y déjales cambiar el tamaño del texto según sus necesidades. También, especificar el tamaño de las fuentes en términos relativos, no con números absolutos de píxeles. (Grande, mediano, pequeño > 20, 18, 16).


6. Títulos de página con poca visibilidad en motores de búsqueda
Las búsquedas son la forma más importante en la que los usuarios descubren sitios web. Las búsquedas son también una de las formas más importantes en las que los usuarios encuentran su camino en un sitio web. El título de la página es tu principal herramienta para atraer nuevos visitantes de las listas de búsquedas y para ayudar a tus usuarios existentes a localizar páginas específicas que ellos necesitan.

El título de la página está contenido en la etiqueta HTML <title> y se utiliza también casi siempre como la cabeza clickeable para listarse en las páginas de resultados de los motores de búsqueda. Los motores de búsqueda normalmente muestran los primeros 66 caracteres del título, por lo que es realmente un micro-contenido.

Los títulos de las páginas son también utilizados como la entrada por defecto a la hora de marcar como favorito un sitio web. Para tu página de inicio, comienza con el nombre de la empresa, seguido de una breve descripción del sitio. En caso de tener la página en inglés, evita comenzar con "The" o "Welcome to", a menos que quieras que tu página sea archivada en la letra T o W (últimas letras del abecedario, al final de las listas, mala elección).

Para otras páginas aparte de la página inicial, empiece el título con algunas palabras que lleven una gran carga informativa que describa los detalles de lo que los usuarios encontrarán en esa página. Dado que el título de la página se usa como título de la ventana en el navegador y también se usa como etiqueta de la ventana en la barra de tareas en Windows, los usuarios avanzados se moverán entre varias ventanas bajo la guía de la primera o dos primeras palabras de cada título de página. Si todos los títulos de su página empiezan por las mismas palabras, se reduce drásticamente la facilidad de uso para estos usuarios.


7. Cualquier cosa que parezca un anuncio
La atención selectiva es muy poderosa y los usuarios web han aprendido a dejar de prestar atención a cualquier publicidad que se interponga en su navegación.

Desafortunadamente, los usuarios también ignorarán cualquier elemento legítimo de la página que parezca un anuncio. Después de todo, cuando ignoras algo no estudias en detalle qué era exactamente.

Por lo tanto, lo mejor es evitar cualquier diseño que parezca un anuncio. Algunos consejos para ello:

  • Ceguera a los banners significa que los usuarios nunca van a prestar atención a nada que parezca un banner publicitario ya sea por su posición o por su forma.
  • Esquivando animaciones los usuarios ignorarán aquellas zonas de la web con texto parpadeando o cualquier otra animación agresiva.
  • Purga de pop-ups significa que los usuarios cerrarán cualquier ventana de pop-up antes de que esta llegue a cargar entera.

8. Violación de los convenios de diseño
La consistencia es uno de los más poderosos principios de usabilidad. Cuando las cosas siempre son más o menos igual los usuarios no se preocuparán de lo que va a suceder. Por otro lado, ellos saben lo que pasará basándose en experiencias anteriores. Cada vez que dejas caer una manzana sobre Sir Isaac Newton esta golpeará su cabeza. Eso está bien.

Mientras más expectaciones del usuario ocurran satisfactoriamente, más sentirán la sensación de estar en control del sistema y más les gustará. Y mientras más veces el sistema rompa las expectativas del usuario, más inseguro se sentirá. 

La ley de Jakob sobre la Experiencia del Usuario Web dice que "los usuarios gastan la mayoría de su tiempo en otros sitios web".

Esto significa que los usuarios forman sus expectaciones para tu sitio web basándose en lo que comúnmente se hace en la mayoría de otros sitios. Si te desvías, tu sitio será más difícil de utilizar y los usuarios acabarán dejándolo.


9. Apertura de nuevas ventanas de navegador
La apertura de nuevas ventanas del navegador es como ese vendedor de aspiradoras que lo primero que hace es vaciar un cenicero en la alfombra del cliente. No contamines mi pantalla con más ventanas, gracias.

Los diseñadores suelen crear nuevas ventanas creyendo que esto hará que los usuarios permanezcan en su sitio web pero esto es contraproducente ya que esto desactiva el botón de "volver", que es la forma común que los usuarios utilizan para volver a páginas anteriores. Los usuarios a menudo no se dan cuenta de que se ha abierto una ventana nueva, especialmente si están usando monitores pequeños en los que las ventanas están maximizadas para llenar la pantalla. De esta forma, un usuario que quiere volver a una página anterior se confundirá al encontrarse con un botón de volver desactivado.

Los enlaces que no actúan como se esperaba disminuyen el entendimiento que tiene el usuario sobre nuestro propio sistema. Un enlace debería ser una simple referencia de hipertexto que reemplaza la página actual con nuevo contenido. Los usuarios odian las ventanas emergentes no deseadas. Si un usuario quiere obtener nuevo contenido en una ventana nueva puede hacerlo con la opción "abrir en nueva ventana" del navegador.


10. No responder a las preguntas de los usuarios
Los usuarios visitan sitios web porque hay algo que ellos quieren conseguir. Puede, incluso, que quieran comprar tu producto. El mayor fracaso que puede tener un sitio web es fallar al proveer a los usuarios la información que están buscando.

Algunas veces la respuesta simplemente no está ahí y pierdes la venta porque los usuarios asumen que tu producto o servicio no se ajusta a sus necesidades si no les dices las especificaciones. Otras veces, los detalles están ocultos bajo una gruesa capa de información innecesaria. Ya que los usuarios no tienen tiempo para leerlo todo, esta información oculta es igual que si no estuviera allí.

El peor ejemplo de no responder las preguntas de los usuarios es evitar la lista de precios de tus productos y servicios. Ningún sitio web orientado al comercio electrónico cometería este error.



Y hasta aquí el top 10 de los errores de diseño web. ¿Qué errores de diseño web incluiríais vosotros en el top 10?

¡Hasta la siguiente entrada!

No hay comentarios:

Publicar un comentario