Principios sobre la Usabilidad de un sitio Web

Transcripción

1 Principios sobre la Usabilidad de un sitio Web

2 Índice de contenidos Principios sobre la Usabilidad de un sitio Web... 1 Primero Qué es la Usabilidad?... 2 Principios básicos de la Usabilidad en Diseño Web... 2 Cómo Piensa el Usuario? No hagas pensar a tus usuarios No pongas a prueba la paciencia de tus usuarios Centra la atención de los usuarios Enfócate en la claridad Utiliza un lenguaje efectivo Mientras más Simple, mejor No le temas al espacio en blanco Comunícate con un Lenguaje Visible Utiliza bien las convenciones Realiza pruebas de rendimiento Conclusión: Índice de Ilustraciones Ilustración 1 Los usuarios no leen, solo escanean Ilustración 2 flujo de lectura en la Web Ilustración 3 Beyondis.co.uk... 5 Ilustración 4 ExpressionEngine... 6 Ilustración 5 Stikkit... 7 Ilustración 6 Mite... 8 Ilustración 7 Humanized.com... 9 Ilustración 8 Hovie.com Ilustración 9 Eleven2.com Ilustración 10 Crcbus Ilustración 11 Finch Ilustración 12 Cameron.io Ilustración 13 Convenciones, Amazon.com en idioma Ruso

3 Principios sobre la Usabilidad de un sitio Web Dado que el visitante de la página es la única persona que hace clic en el ratón y, por tanto, lo decide todo, el diseño centrado en el usuario se ha convertido en un método estándar para el éxito y el diseño web con fines de lucro. Por lo tanto el nivel de Usabilidad (facilidad de uso) es uno de los indicadores más importantes en el éxito o fracaso de un sitio web. No vamos a discutir los detalles de la implementación; de hecho nos centraremos en los principales principios y enfoques para el diseño de páginas web eficaces enfoques que, utilizados correctamente, pueden dar lugar a decisiones de diseño más sofisticadas y simplificar el proceso de percibir la información presentada. Trataré, pues, los principios fundamentales sobre Usabilidad: Qué es, cómo se mide, cómo se mejora, qué tan importante es y demás consideraciones que nos ayudarán a aumentar las conversiones de nuestro Sitio Web. Primero Qué es la Usabilidad? Jackob Nielsen (el aclamado Gurú de la Usabilidad) define la Usabilidad como el atributo de calidad que mide lo fáciles que son de usar las interfaces Web s. La usabilidad se refiere a la claridad y la elegancia con que se diseña la interacción con un programa de ordenador o un sitio web. Principios básicos de la Usabilidad en Diseño Web Para empezar a analizar estos principios adecuadamente primero tenemos que entender cómo interactúan los usuarios con los Sitios Web, cómo piensan y cuáles son los parámetros más importantes de su comportamiento. Cómo Piensa el Usuario? Básicamente, los visitantes de una web no poseen hábitos muy distintos a los que posee en una tienda real. Visitan algunas páginas de la web, escanean algunos textos, y hacen clic en el primer enlace que les llame la atención o que vagamente se parezca a lo que están buscando. De hecho, hay grandes partes de la página que ni siquiera miran. La gran mayoría buscan algo interesante (o funcional) para hacer click; de un simple vistazo crean mentalmente los candidatos que reúnan estas condiciones, y rápidamente cliquean su mejor opción. Si esta nueva página no cumple con sus expectativas, cliquean el botón ATRÁS del navegador y continúan su búsqueda. Los usuarios aprecian la calidad y la credibilidad Si una página web ofrece a sus usuarios contenidos de alta calidad, los usuarios se comprometerán con este, independientemente de los espacios publicitarios y el diseño del 2

4 sitio. Esta es la razón por la que sitios webs mal diseñados con contenidos de mucha calidad, obtienen muchísimo tráfico a través de los años. Para los usuarios el contenido es más importante que el diseño visual que lo soporta. Los usuarios no leen, solo escanean Analizando una página web, los usuarios, inconscientemente, buscan algunos puntos claves que los guíen a través del contenido de la página. Mira cómo las áreas calientes se enfrían a la mitad de las sentencias. Típico del proceso de escaneo. 1 Ilustración 1 Los usuarios no leen, solo escanean. Los usuarios Web son impacientes e insisten en gratificaciones instantáneas Un principio muy simple: Si un sitio web no es capaz de satisfacer las expectativas de sus usuarios, los diseñadores no lograron su cometido y la empresa está perdiendo dinero. Mientras más complicada es la comunicación y menos intuitiva la navegación, los usuarios estarán más propensos a abandonar el sitio web y buscar otras alternativas a este. Los usuarios no toman decisiones óptimas Los usuarios no van a buscar la forma más rápida para encontrar la información que están buscando. Tampoco van a escanear la página de una forma lineal o formal, yendo secuencialmente de una sección a otra. En su lugar, optan por tomar su primera opción más razonable. Tan rápido como encuentren un enlace que parece que podría conducir a la meta, hay una muy buena probabilidad de que se hagan clic inmediatamente. La optimización es difícil, y se necesita mucho tiempo, pero la satisfacción es más eficiente 1 Estos gráficos de calor son tomados con herramientas como esta: video siguiendo el foco del ojo a un determinado grupo de personas. 3

5 Las dos imágenes muestran cómo el flujo de lectura normal no funciona en la Web. La imagen de la derecha describe la parte escaneada de esa página. Ilustración 2 flujo de lectura en la Web. Los usuarios siguen su intuición En la mayoría de los casos el usuario nunca se detendrá a entender el ordenamiento del contenido del sitio web. Según Steve Krug, la razón de esto es que al usuario no le importa. Si encontramos algo que funciona, lo seguimos usando. No nos importa cómo es que funciona, mientras que nos siga dando resultados 4

6 Los usuarios quieren tener el control Los usuarios quieren tener el control total de su navegación y mantener la información importante del sitio web. Por ejemplo, un usuario nunca va a querer nuevas ventanas que se abren inesperadamente sin que ellos cliquen, y quieren poder siempre volver a la página anterior con el botón ATRÁS del navegador. 1. No hagas pensar a tus usuarios Según la primer ley de Krug s first sobre usabilidad, toda La página web debe ser obvia y debe explicarse por sí misma. Al crear un sitio, el trabajo del desarrollador web consiste en deshacerse de los signos de interrogación los usuarios necesitan tomar decisiones de manera consciente, teniendo en cuenta los pros, los contras y alternativas. Si la navegación y la arquitectura no son intuitivas, crecerá el número de dudas de los usuarios acerca de cómo funciona el sistema y cómo llegar del punto A al punto B. Una estructura clara con buenos indicadores visuales y enlaces fácilmente reconocibles pueden ayudar a los usuarios a navegar cómodamente en el sitio web y encontrar su camino hacia su objetivo. Ilustración 3 Beyondis.co.uk Beyondis.co.uk dice estar beyond channels, beyond products, beyond distribution (más allá de los canales, de los productos, de la distribución). Y eso qué significa? Los visitantes deben continuar explorando el sitio para darle un sentido a esa frase, y se le crea la primera incomodidad de la entrada. Si bien el diseño es simple e intuitivo, el visitante necesita continuar buscando su respuesta por la página web. Esa es una duda innecesaria que se le plantea al visitante, un tema bastante delicado en sitios web corporativos. 5

7 Ilustración 4 ExpressionEngine ExpressionEngine, en cambio, utiliza la misma estructura que Beyondis, pero evita dudas innecesarias. Incluso el eslogan es funcional ya que presenta el servicio explicándolo. Reduciendo la carga cognitiva se hace más simple a los usuarios captar la idea detrás del sistema. Una vez que se logra esto, ya se puede comunicar por qué el sistema es útil y cómo el usuario se beneficiará de él. Nadie usará tu Web si no se enteran rápidamente qué ventajas obtendrán por el hecho de usarla. 2. No pongas a prueba la paciencia de tus usuarios En cualquier parte de tu sitio web donde requieras información de tus visitantes, mantén siempre los requisitos al mínimo. Mientras menos pasos les pidas que hagan, más propensos estarán a darlos. Más aún, si necesitas brindar algún tipo de servicio online, permíteles a tus visitantes que exploren y descubran tu servicio sin forzarlos a darte información privada (no es muy razonable obligar a tus usuarios a darte ni siquiera su dirección de para probar tu servicio). Los usuarios serán mucho más propensos a darte su si se lo pides luego, una vez que estén conformes con tu servicio, y tengan una idea de lo que recibirán a cambio. 6

8 Ilustración 5 Stikkit Stikkit es un perfecto ejemplo sobre formularios user-friendly (Diseño centrado en el usuario), pidiéndole prácticamente nada a sus usuarios. 7

9 Ilustración 6 Mite Aparentemente, Mite requiere más datos. Sin embargo el registro se puede hacer en menos de 30 segundos, e incluso como el formulario es horizontal, el visitante ni siquiera debe bajar la página. Lo ideal es no poner barreras de ningún tipo. Tampoco le pidas el registro de tus usuarios al principio. El formulario de registro por sí solo ya es motivo suficiente para que tus visitantes abandonen tu Web al solo verla. 3. Centra la atención de los usuarios En todo Sitio Web hay contenido estático y contenido dinámico y, a su vez, hay cosas que llaman más la atención que otras. Obviamente, las imágenes son más llamativas que el texto, así como el texto en negrita es más atractivo que el texto plano. El ojo humano no sigue patrones lineales. Instantáneamente reconoce formas, patrones, movimientos es por ello por lo que los anuncios basados en video son muy molestos y distraen, aunque desde el punto de vista del marketing cumplen su función a la perfección al capturar la atención de los usuarios. 8

10 Ilustración 7 Humanized.com Humanized.com utiliza a la perfección este principio atención. El único elemento que es verdaderamente visible es la palabra gratis (free) la cual es atractiva y atrayente, y aun así es puramente informativa. Más abajo se incluye la información necesaria para saber más acerca de este producto gratis. Un uso adecuado del foco de atención de los usuarios ayudará a guiarlos a través de los contenidos de tu sitio, permitiendo una comunicación efectiva. Mientras menos elementos visuales existan, mejor orientado estará el usuario y mejor será la perspectiva que tendrá acerca de la compañía. 4. Enfócate en la claridad Independientemente del Concepto de Diseño, la claridad de la estructura visual y de la información siempre deben ser prioritarios durante el proceso de diseño. Si surge alguna posibilidad de malas interpretaciones, el diseño se debe replantear. Para conseguir esta meta nuestro diseño no necesariamente debe poseer una estructura estándar, ya que incluso las estructuras menos comunes pueden ser las ideales para organizar nuestros contenidos. Mientas más organizada estén tus categorías, más simple de encontrar serán los contenidos de tu Web. 9

11 Ilustración 8 Hovie.com Hovie.com muestra una estructura muy poco común, pero con una muy clara solución organizativa. Este Sitio Web consiste en 5 columnas;, la primera columna contiene el menú principal, la segunda columna contiene el sub-menú relativo a la categoría principal, la tercera columna es el área de contenidos, la cuarta ofrece datos relativos y la quinta es estética. El resultado es súper innovador, y aun así es simple, claro y efectivo. Normalmente se acusa y critica al diseño web moderno por sus estructuras del tipo paso 1, paso 2, paso 3, sus grandes botones, sus descripciones, guías visuales, etc. Pero estas características no son para nada contraproducentes. Por el contrario. Estas guías visuales son extremadamente efectivas, ya que guían al usuario de la forma más simple, clara y rápida posible. Permite que el usuario se entere rápidamente qué funciones están disponibles, principio fundamental en todo diseño de interfaces. No importa cómo se logre, lo que importa es que el contenido se entienda bien y los usuarios se sientan cómodos en la forma en la que interactúan con el sistema. 10

12 5. Utiliza un lenguaje efectivo Ya que el Diseño Web es diferente al Diseño Impreso, es necesario ajustar el estilo de escritura al público adecuado. La escritura promocional por principio se ignorará y pocos la leerán. Lo mismo pasará con los textos largos sin imágenes. A su vez el lenguaje exagerado es muy propenso a ser ignorado. Es esencial la elección del estilo de redacción adecuado. Este artículo trata sobre Usabilidad. Cuando se habla de lenguaje efectivo en términos de Usabilidad, se hace referencia (básicamente) a que nuestro público lo entienda. Muy distinto es el lenguaje persuasivo, así también el estilo de escritura o comunicación que tratan los principios de la Conexión Emocional. Ilustración 9 Eleven2.com Eleven2.com va directo al objetivo. No solo es una buena estrategia de marketing, sino que emiten su mensaje rápida y claramente. Una buena solución en muchos casos podría ser: Usar frases cortas y concisas (ir al objetivo lo más rápidamente posible) Usar estructuras escaneables (categorizar el contenido, usar encabezados con distintas jerarquías, elementos visuales y listas que rompan el flujo de los bloques de textos) Una buena opción es utilizar textos objetivos (una promoción no necesariamente debe sonar como una promoción. Intenta comunicarte con tus usuarios de una forma objetiva porqué deben usar tu servicio o permanecer en tu web) 11

13 6. Mientras más Simple, mejor El principio KIS mantenlo simple estupido debe ser el objetivo principal en el diseño web. Los usuarios rara vez disfrutan del diseño; además, en la mayoría de los casos están buscando la información a pesar de su diseño. Luchar por la simplicidad en lugar de la complejidad. Desde el punto de vista de los visitantes, el mejor diseño del sitio es un texto puro, sin ningún tipo de anuncios u otros bloques de contenido que coincidan exactamente con las consultas de otros visitantes, o los contenidos que han estado buscando. Esta es una de las razones por las que es esencial una versión impresa de la página web para una buena experiencia de usuario. Esta es una de las reglas primarias del Diseño. Las mejores respuestas siempre son las más simples, si crees que algo tendría que ser más simple, entonces le falta optimización. Ilustración 10 Crcbus Crcbus ayuda al visitante con un diseño claro y simple. Quizás no sepamos de qué trata este sitio (ya que es italiano), pero aun así se distingue claramente su navegación, la cabecera, el área de contenido y el pie de página. De un simple vistazo el visitante sabe cómo funciona el sistema. Desde el punto de vista del visitante, el mejor diseño es en el que las cosas están donde el creería que tienen que estar, y nada más. La información prevista debe ser la que él considere necesaria, ni más ni menos, y no hay nada que lo moleste o lo confunda. 12

14 Ilustración 11 Finch Finch presenta claramente la información del sitio y otorga al visitante algunas opciones sin abrumarlo con contenidos innecesarios. 7. No le temas al espacio en blanco El espacio en blanco es una de las herramientas más infravaloradas de la actualidad. No solo ayuda a reducir el tiempo de carga cognitiva del visitante, sino que también simplifica la información presentada. Lo primero que hace un usuario al entrar a una web es escanear el contenido y subdividir mentalmente este en distintas áreas e ir centrándose paso a paso en las que le interesan. Las estructuras complejas son difíciles de leer, escanear, analizar y trabajar con ellas. Por el contrario las estructuras jerárquicas reducen la complejidad visual, haciendo el contenido más simple de percibir. 13

15 Ilustración 12 Cameron.io Cameron.io utiliza el espacio en blanco como herramienta primaria de diseño. El resultado es una estructura muy escaneable que destaca la presentación del contenido. 8. Comunícate con un Lenguaje Visible En sus trabajos sobre la comunicación visual efectiva, Aaron Marcus señala tres principios fundamentales involucrados en el uso de la llamada lenguaje visible o el contenido que los usuarios ven en la pantalla. Organiza: Proporciona al usuario una estructura conceptual clara y consistente. Consistencia, estructura visual, relaciones y navegabilidad son conceptos importantes de la Organización. Las mismas convenciones y reglas deben ser aplicadas en el sistema. Economizar: Hacer lo máximo posible con la menor cantidad de elementos visuales. Para ello hay cuatro puntos importantes a tener en cuenta: sencillez, claridad, distinción, y el énfasis. o Simplicidad o sencillez: incluye sólo los elementos que son más importantes para la comunicación. o Claridad: Todos los componentes deben distinguirse claramente y su significado no debe ser ambiguo. o Carácter distintivo: Las partes de la página con funciones distintas deben ser percibidas de forma diferente. 14

16 o Énfasis: Los elementos más importantes se deben percibir claramente como tales. Comunicación: Cuando hablamos de Comunicación en Usabilidad, se trata de una comunicación objetiva (los conceptos de comunicación persuasiva no se abordan en la Usabilidad). Me estoy refiriendo a, por ejemplo, la interface de un software. Toda interface debe poseer un buen equilibrio de legibilidad, redacción, tipografía, simbolismo, jerarquías, y color / textura para comunicar de manera efectiva. 9. Utiliza bien las convenciones Las convenciones son las Normas o prácticas admitidas tácitamente, que responden a precedentes o a la costumbre. Por ejemplo, si la gente ve una importante lista de enlaces, inmediatamente va a reconocerla como el menú de navegación principal del sitio web, simplemente porque este es el caso de la mayoría de los sitios que ya ha visitado. Las convenciones son extremadamente útiles para reducir la carga cognitiva del usuario. Nuestros visitantes se darán cuenta más rápidamente de cómo funcionan las cosas en nuestra web. Ilustración 13 Convenciones, Amazon.com en idioma Ruso. Un típico ejemplo para probar la Usabilidad de un Sitio Web, es realizar un testeo cambiando el idioma de tu sitio a otro idioma extraño (por ejemplo con el traductor de google) y pedirles a tus usuarios de prueba que encuentren una determinada cosa, o realicen una determinada tarea. Si todas las convenciones están bien aplicadas, estos usuarios de prueba podrán lograrlo, aun cuando no puedan entender ni una sola palabra. Steve Krug sugiere que es mejor innovar solamente cuando se está seguro que se tiene una mejor idea, pero se debe seguir las convenciones de no ser así. 15

17 10. Realiza pruebas de rendimiento Las pruebas de Usabilidad son las pruebas más sencillas de realizar, y también las más importantes, ya que nos ofrecen insignias cruciales sobre los problemas fundamentales de nuestro sitio web. Lamentablemente muy pocas PyMEs conocen los beneficios generados a través de unas pruebas de rendimiento acordes. Una de las grandes ventajas de las interfaces digitales es que son medibles, cuantificables, fáciles de analizar y de optimizar. Cómo llevar a cabo un buen test de rendimiento y optimización no es un tema simple de tratar. Algunos puntos claves a considerar: Testar un usuario es 100% mejor que no testar ninguno, y testear un solo usuario al inicio del proyecto es mejor que testar 50 usuarios al final. Esto se debe a que los errores son más frecuentes durante la etapa conceptual, que durante la etapa de desarrollo, y lógicamente mientras más tarde son detectados más complicados son de resolver. Según Jackob Nielsen, los problemas de Usabilidad más importantes de nuestro Sitio Web son detectados al ser analizado por los primeros 5 usuarios. Testar es un proceso interactivo. Esto significa que al diseñar algo, esto debe ser testado, optimizado, y luego ser testeado de nuevo. Es importante destacar que después de la primera optimización pueden surgir problemas que antes estaban bloqueados por otros problemas anteriores. Los test de Usabilidad siempre producen resultados utilizables. Según la ley de Weinberg, un desarrollador / programador nunca debería testear su propio trabajo (este podría crear el test, pero nunca testearlo él mismo). Lógicamente lo mismo se aplica a un diseñador. Esto se debe a que después de trabajar en un sitio web, ya se conoce como es su estructura, su navegación y demás, y se sabe exactamente cómo funciona el sistema. Conclusión: El nivel de Usabilidad es uno de los tantos factores que indicarán el éxito o fracaso de todo sitio web, y es uno de los más simples de cuidar. Si te has dado cuenta que tu web no cumple con algunos de estos 10 principios, es muy probable que estés perdiendo dinero (directa o indirectamente) ya que gran parte de tus usuarios están teniendo problemas en tu web, aumentando su frustración y/o incomodidad y percibiendo tu empresa de una forma indeseada. 16