5 Consejos para Mejorar la Usabilidad de tu Diseño Web ¡Fácil!

como mejorar la usabilidad diseño web

Mejora la Usabilidad de tu Diseño Web sin complicaciones

Mejorar la usabilidad de un diseño web puede parecer irrelevante pero es uno de los factores más importantes a la hora de posicionar tu página.

Uno de los factores más importantes para que Google te quiera mucho es el factor usabilidad dentro del diseño web. La usabilidad, muy simplemente explicada, es la facilidad que das a tus usuarios para encontrar lo que buscan. No olvides pasar por el post Cómo Mejorar la Usabilidad Web para Impulsar tu Negocio Online y Cómo Conseguir más Clientes Online.

Cuando diseñamos una web, lo hacemos desde nuestra perspectiva, según nuestras reglas y nuestros gustos y la información que tenemos ya en nuestra cabecita. Es muy posible (y habitual) que pensemos que todo está clarísimo, bien estructurado y fácil de encontrar, pero a menudo no es así. Damos por sentadas muchas cosas que nuestros usuarios no tienen por qué saber.

Es un error frecuente pensar que nuestro diseño web es lo suficientemente usable y que está bien estructurado. También es un error habitual ni siquiera planteárselo. Diseñamos nuestra web y hala, ya vendrán miles de visitas diarias.

La verdad es que la mayoría de sitios web que veo a diario tienen una usabilidad muy deficiente en su diseño y planteamiento. El objetivo es ponérselo a huevo al lector / usuario, de lo contrario se piran. El tiempo es muy valioso y quieren encontrar en cero coma la información que buscan. Si no es así en tu web, le darán al botón de “atrás” y pincharán en otra web de la página de resultados de Google (SERP).

Por supuesto, eso tiene consecuencias. No solamente has perdido la oportunidad de gustarle a un usuario (o a 100) sino que en la escala de Google, estarás perdiendo posiciones. Google sabe cuántas visitas recibes, el tiempo que cada una pasa en tus páginas, cuántas páginas han visto, si se salen inmediatamente… Todos esos datos que Google recoge acerca de tu web, son analizados y tomados en cuenta para tu posicionamiento. Si Google te pone en la posición número 1 para una palabra clave “equis” y reúne malos datos sobre las visitas que recibes, te irá bajando sin piedad.

A menos que le pongas remedio.

Todos esos datos recogidos por Google (tasa de rebote, número de páginas vistas, tiempo en las páginas…) pueden verse mejorados si pones un poquito de cuidado en la usabilidad de tu diseño web. No es nada difícil. Solamente se trata de implementar una serie de cambios simples. Esos cambios pueden ayudarte a mejorar tu posicionamiento.

Esta lista no es exhaustiva ni mucho menos. Simplemente son unos cuantos consejos e ideas que, con toda seguridad, mejorarán la experiencia de tus usuarios y tu diseño web. Consejos que puedes implementar de inmediato y sin demasiado esfuerzo.

Los objetivos generales de un diseño web usable

Un diseño web usable tiene la finalidad última de solucionar los problemas o las consultas de los usuarios. Para ello los objetivos que necesita alcanzar son:

En cuanto a la lectura:

  • Que sea legible
  • Que sea comprensible
  • Que sea sencillo y placentero o agradable
  • Que sea “escaneable” (significa que tenga elementos que hagan rápida la lectura, como listas, titulares, etc)

En cuanto a la navegabilidad y estructura:

  • Que sea claro y bien estructurado
  • Que sea “superficial”, es decir, que no contenga demasiados niveles de profundidad
  • Que contenga sutiles llamadas a la acción
  • Que invite a seguir navegando

¿Qué simples pasos podemos realizar para conseguir lo anterior?

usabilidad diseño web

Tipo y tamaño de letra legibles

Aunque parezca una obviedad, ni te imaginas la cantidad de webs que utilizan una fuente y tamaños de letra inapropiados para lectura en internet. Hay fuentes que sí, son chulísimas, bellísimas, preciosas, pero dificultan la lectura.

Qué puedes hacer:

  1. Para el cuerpo del texto utiliza un tamaño fuente no menor a 14px.
  2. Utiliza fuentes “sans”. Estas son las que no llevan el “rabito”. Por ejemplo, Arial, Calibri son sans, a diferencia de Times New Roman.
  3. De entre las sans, emplea fuentes que sean lo más legibles posible.

Contenido conciso

Está claro que si estamos escribiendo un post que es un manual, seguramente, breve no será. Sin embargo sí podemos hacer un contenido conciso, que no se vaya por las ramas (¡aquí yo me lo tengo que trabajar!).

Pero si hablamos de la usabilidad de un diseño web, vamos a empezar por referirnos a las páginas estáticas, al contenido que explica en la web lo que hacemos. Aquí sí es mejor ser breve y ser conciso.

Nuestros hábitos de lectura en internet difieren de los de la lectura de un libro. En internet, es raro que un usuario se lea todo el contenido de una página, mucho menos de la web entera. Por ello debemos tratar de ser lo más concisos posible.

Qué puedes hacer:

  1. Usa frases cortas y descriptivas
  2. Evita palabras rimbombantes
  3. Ve al grano tan pronto como puedas
  4. Elimina toda la información que sea innecesaria
  5. Evita párrafos largos
  6. Usa técnicas para hacer la lectura más rápida, como escribir números en dígitos en lugar de palabras, negritas de vez en cuando, etc.

División de contenido en párrafos y encabezados

Además de beneficiar el posicionamiento si incluyes en ellos (encabezados H1, H2, H3,…) alguna versión de tu palabra o palabras clave, los encabezados ayudan a hacer la lectura más rápida y fácil. Los usuarios de internet inspeccionan las páginas no en su conjunto, sino en bloques y secciones.

Qué puedes hacer:

Podemos usar varias técnicas para que el diseño web de nuestra página sea más usable en este sentido:

  1. Dividir la “masa” del contenido de una misma página en más párrafos de lo que sería correcto. Las normas gramaticales que hacen referencia a los puntos y aparte, mejor no aplicarlas en internet. Aunque no corresponda un punto y aparte, a veces es mejor dividir un párrafo en varios, solamente para que no dé la impresión de ser interminable. Esto facilita la lectura en internet. En este mismo post tienes varios ejemplos de ello. He hecho punto y aparte en muchos lugares en los que no correspondería.
  2. Dividir en secciones mediante encabezados. El usuario se verá atraído por los titulares y si, una vez escaneados todos de forma rápida, ve que son interesantes, volverá arriba para leer más en profundidad.
  3. Antes de escribir el contenido de una página o post, detente un rato a pensar cómo puedes seccionarlo.

Utiliza listas y formateo de texto (sin abusar)

Las listas, tanto de numeración como de puntos, son una forma captar la atención de los usuarios. Está comprobado que los lectores se fijan y centran más tiempo su atención en ellas que en textos más heterogéneos. Son más fáciles de leer.

Lo mismo ocurre al usar diferentes formatos de texto como la negrita o algún color. Hay que tener, no obstante, muchísimo cuidado con esto. Si nos excedemos en el uso de la negrita, las comillas, la cursiva, las mayúsculas, o ponemos más de dos colores en un texto, puede resultar confuso. Al final podemos estar consiguiendo lo contrario de lo que pretendemos.

Qué puedes hacer:

  1. Mira a ver si puedes convertir algún texto en una lista.
  2. Enfatiza lo más importante, en los párrafos, con negritas o algún color. Cuidado si usas subrayado, se puede confundir con un enlace.
  3. Evita poner palabras o frases en color azul (típico color de los enlaces).

usabilidad y estructura en el diseño web

Ayuda a los usuarios a escanear la web

Los puntos anteriores se refieren más al contenido de tu web, página por página. En este caso, nos referimos al contenido de la web al completo.

Si el usuario entra en una página “equis” de tu web, y no mira ninguna más, esto contará como un rebote, aunque esté tres o cuatro minutos leyendo. Cuando tu web tiene una tasa de rebote alta, Google empieza a mosquearse.

Por eso hay que intentar que el usuario vea al menos una página más.

Esto tiene que ver con la estructura, tanto la interna como la visible.

Cuando hablo de estructura visible o externa, suelo referirme a los menús de navegación, visibles (habitualmente) desde cualquier sitio para el usuario. Si el menú es lo suficientemente atractivo (para lo que tiene que ser claro, irremediablemente), es posible que el usuario pinche en alguna de las páginas o “pestañas” del mismo.

Piensa, si no supieses nada del tema sobre el que trata tu web y entrases un día, ¿qué harías, qué pensarías? ¿Te enterarías de algo solamente con mirar el menú? ¿Tienen las páginas un título que describa exactamente lo que se puede encontrar dentro de cada una? Echando un simple vistazo al menú de navegación, ¿sería cualquiera capaz de determinar exactamente lo que haces, de qué va la web? ¿Seguro?

Respecto a la estructura interna, los enlaces HTML dentro de las páginas, el usuario debe ser instado a que curiosee. Si no hay enlaces internos y pasa del menú, ¿cómo lo va a hacer? No hay forma. Los enlaces internos son sutiles llamadas a la acción para que pasen de un lugar a otro. No solamente mejora la usabilidad y la estructura, sino que además baja la tasa de rebote drásticamente. Si los pones bien, claro.

Por otro lado, los enlaces internos facilitan a Google su labor de indexación de páginas. Si llega a una página (normalmente la página de Inicio) y no hay enlaces internos hacia otras páginas, aunque sepa que hay un menú, pasa de él, pasa de todo. Se pira. No rastrea nada más. Tu posicionamiento se ve afectado también por esto.

El diseño web va precisamente de lo anterior, la estructura, para hacer una web usable. En el Tutorial de diseño web te explico los 4 factores base del diseño, usabilidad, estructura, funcionalidad y apariencia.

Una buena estructura puede mejorar en un 47% la usabilidad del diseño web

(según el mayor experto en UX, experiencia de usuario y usabilidad, Jakob Nielsen).

Qué puedes hacer:

  1. Piénsate bien el menú de navegación. No vayas poniendo páginas según se te ocurran. Piensa en este menú como un índice de un libro. Este índice ha de dejar claro al lector lo que puede encontrar en el sitio web.
  2. No pongas más de 8 o 9 páginas en el menú principal, incluyendo la página de Inicio, la de contacto y el blog.
  3. No uses títulos para el menú principal que contengan más de 3 palabras. Estas palabras, al menos en 4 o 5 de las páginas, deberían incluir alguna de tus palabras clave.
  4. Asegúrate de que estás poniendo en el menú principal, LO PRINCIPAL. Lo más importante. Debajo, en el o los submenús, pondrás información adicional o de soporte y finalmente información relacionada.
  5. Asegúrate de que el o los menús están bien visibles. Aunque ahora se lleva lo del menú minimalista como el de esta imagen… no te dejes llevar por las modas. Este tipo de menús no beneficia la usabilidad de tu diseño web ni a tu posicionamiento.
  6. En la home, siempre pon enlaces a las principales páginas. Los temas de WordPress actuales llevan, casi todos, un diseño que posibilita hacerlo de forma estética y práctica. Mira el post sobre cómo diseñar una buena página de Inicio.
  7. En el resto de páginas, intenta también añadir enlaces internos que fomenten la permanencia del usuario en el web y, a su vez, que la araña de Google siga rastreando.

¡Eso no es todo, amigos!

Ciertamente, la usabilidad de un diseño web no termina ahí. La usabilidad es más compleja que escribir el contenido de una forma determinada o que tener una buena estructura. Como te decía al principio, estos son unos pocos consejos que son muy fáciles de implementar y que seguro mejorarán la usabilidad de tu web.

Si quieres seguir aprendiendo sobre diseño web, usabilidad y posicionamiento, tienes cientos de posts en este blog que espero te sean útiles.

Créditos Imágenes: Freepik

6 comentarios en “5 Consejos para Mejorar la Usabilidad de tu Diseño Web ¡Fácil!”

  1. Me gusta mucho tu post. Enhorabuena!! Lo encontré buscando dónde demonios estaba el botón de justificación de texto. Soy una adicta a la perfección, la organización y como no podía ser de otra manera, a los textos justificados. Aunque ahora después de leer que Google lo ha descartado por motivos de usabilidad, me planteo «desjustificar» todo mi contenido. Si un día necesitas de mis servicios, aquí estoy!!!

    1. Hola Lorena
      Ciertamente, aunque parece un poco incomprensible, WordPress eliminó el botón de justificar hace ya tiempo. Pero no, no quites la justificación de tus textos, tampoco es para tanto. De hecho, yo a mis clientes a veces les sigo justificando el texto en las páginas estáticas porque son como nosotras, de los de justificar de toda la vida. Pero no hace falta deshacer lo ya hecho. Simplemente tendremos que acostumbrarnos a ver y escribir sin justificar.
      Gracias por comentar y feliz año
      Esther

  2. Consejos de usabilidad y diseño web

    Enhorabuena por este articulo! Totalmente importante la estructura web de tu sitio web!! Siempre puedes optara una vez tengas realizada la web hacer un Test Thinking Aloud para ver la experiencia del usuario mientras navega en tu sitio web y de esta manera aplicar posibles mejoras!

    1. Gracias a ti Laia, por comentar.
      Quería también avisarte que he eliminado el backlink que habías puesto hacia otro sitio, aunque fuese nofollow. No me parecía procedente, ya que iba a un post que explica básicamente lo mismo que el mío. Si hubiese ampliado y mejorado la información de este post, no habría tenido inconveniente en dejarlo. Te lo digo por si alguna otra vez quieres dejar alguno, lo puedes hacer, siempre y cuando, como digo, amplie y mejore la información del post original.
      Saludos y feliz jueves!
      Esther

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

13 + 20 =

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.