UX design, diseño web pensado para el usuario

accesibilidad-usabilidad

Que es UX Design

¿Cuántas veces te ha pasado que llegas a un sitio donde debería estar cierta información pero no la puedes encontrar?
Realmente es una situación bastante molesta y tiene que ver con la usabilidad, y a veces a la accesibilidad, te cuento un ejemplo que lo describe perfectamente:

Hace poco estaba intentando bajar la factura de servicios públicos desde el sitio web del municipio donde vivo. Una web repleta de información oficial, pero no encontraba el enlace que me llevara al formulario para obtener esa factura, que además es una consulta muy común por parte de los contribuyentes.

Entonces se me ocurrió buscar en Google y eureka !! me llevó directamente a la página que necesitaba.

Me pregunté entonces ¿Es normal que un usuario necesite de Google para navegar internamente un sitio web ?

La usabilidad tiene que ver directamente con la experiencia de usuario, y eso es precisamente UX design.

Según las Normas ISO 9241 (ex ISO 13407), los Estándares de usabilidad se concentran en 3 conceptos:

    • Efectividad
    • Eficiencia
    • Satisfacción

Para evitar extenderme en cada una de ellas, sólo voy a resumir los puntos más importantes que hacen a la usabilidad en el diseño web, o UX design.

Estructura

Ya vimos que las taxonomías son una gran ayuda para la organización de la información, tanto para el usuario como para los robot, pero también forman parte de la URL de la página.

Una estructura simple es lo más recomendado, evita anidar demasiados subdirectorios (taxonomias) en la URL, ejemplo:

www.tusitio.com/noticias/internet/trabajo-en-linea/empresas/articulo-determinado/

Si bien esta dirección puede tener cierta ventaja para la web semántica al integrar varias palabras en la URL, sin un menú de navegación desplegable en el encabezado, el usuario debería hacer clic 5 veces para llegar desde la página principal, hasta el articulo-determinado

Pero un menú desplegable, ¿facilita o complica la navegación?

Un menú que despliegue toda la estructura del sitio en largas listas de enlaces, puede verse bien en una PC de escritorio, pero en dispositivos como tablets o smartphones, puede añadir mas confusión que navegabilidad.

La estructura de un sitio web no debe ser un laberinto. Por regla general, la información de interés no debe estar a más de 2 clics del Home.

Pero eso no siempre es fácil de lograr cuando la cantidad de páginas y taxonomías es muy grande. Para eso hay varios recursos que se pueden utilizar para facilitar la navegación:

Mapa del sitio

mapa-de-sitio-2Una página con todos los enlaces del sitio Ordenadas por jerarquía, no sólo ayuda al visitante a ubicarse dentro de la estructura cuando está es complicada, sino que agiliza el rastreo de los robot de Google facilitando la correcta indexación de todos los contenidos.

Bread crums o migas de pan

bread-crums
Son útiles particularmente en sitios donde hay 2, 3, o más niveles de navegación, indican al usuario en qué sector de la estructura del sitio está ubicado, y eso le permite volver fácilmente sobre sus pasos al nivel anterior, o al índice de la categoría mediante el enlace de las migas de pan en la parte superior del documento.

Buscador interno

Es otro recurso indispensable para explorar la información en sitios en las mismas condiciones que comentábamos en las migas de pan.

La mayoria de las plantillas en uso en la principales plataformas, tiene su propio buscador interno, aunque cada es cada vez mas frecuente remplazarlo por un Motor de búsqueda personalizado con soporte de Google

Aspecto del contenido

A menudo se quiere dar un aspecto impactante al diseño con tipos de letras originales, color del texto y de fondo en una gama similar y lo que se obtiene es un aspecto visual impactante, pero usabilidad deficiente… el efecto contrario al objetivo que se quiere lograr.

Un diseño web poco amigable puede echar por tierra una buena estrategia de marketing Clic para tuitear

Siempre hay que tener en mente que lo importante es lo que se quiere transmitir con el contenido y para esto la comprensión debe ser clara.

Se debe mantener un contraste entre el color de fuente y el fondo de pantalla. El Consorcio World Wide Web (W3C) Que rige las normas básicas de Internet, establece un contraste mínimo entre el texto y el fondo en las Directrices de Accesibilidad de Contenido Web.

Cuál es el tamaño de fuente adecuado para facilitar la lectura

Se Suele utilizar la unidad Pixel (px) como el tamaño de fuente, pero esta es una unidad absoluta lo que significa que si definimos 11 px como fuente predeterminada en nuestras páginas, todos los usuarios la verán de ese tamaño sin importar el dispositivo que estén usando.

En cambio sí utilizamos la unidad em, esta es una unidad relativa qué toma como referente el tamaño de letra por defecto que el usuario tiene ajustado en su navegador.

Por ejemplo, si definimos el tamaño de fuente del contenido en 1em, y el tamaño de fuente predeterminado en el navegador del usuario es de 12px, entonces 1em = 12x.
Es recomendable jugar entre 1.1em y 1.2 em…. para el tamaño mínimo legible en cualquier dispositivo y cualquier resolución de pantalla

Redacción y diagramación de textos

Dejando de lado la calidad de los contenidos hay una diferencia entre la redacción en papel como un libro, por dar un ejemplo, y la redacción en Internet.

La falta de un interlineado adecuado mala puntuación convierte en un buen texto en un bloque monótono que no invita a leer.

Saltos de linea entre párrafos, las negritas y subrayados, un enlace en algun término, crean puntos de referencia para avanzar en la lectura.

Las imágenes incrustadas, aun cuando son genéricas y decorativas, crean una pausa en la lectura y hacen más ameno e interesante un texto.

Conclusión para el webmaster

No desarrolles un sitio web, ya sea comercial o institucional, basándote únicamente tus en gustos personales. UX design se basa en los gustos y costumbres del usuario promedio de Internet.

Un diseño web poco amigable puede echar por tierra una buena estrategia de marketing, peor aun cuando hay una campaña Adwords de por medio y llegan las visitas pero no hay conversiones. La tasa de rebote en Analytics trepa al 100% lo mismo que el costo en dinero.

A veces es necesario cambiar los parámetros del diseño varias veces hasta dar con el indicado, y eso redunda en aumento de las visitas, baja en los costos de campaña y éxito en el objetivo del sitio web

Compartir

2 comentarios en “UX design, diseño web pensado para el usuario”

  1. Hola Carlos:
    Un artículo claro, conciso, didáctico y muy completo. Me gusta.
    Creo que la elección de diseños impactantes y estructuras novedosas son adecuadas para sitios web de tipo creativo o experimental pero para un cliente que quiere tener una web de comercio electrónico u ofrecer servicios profesionales le convienen sitios con alto grado de UX si quiere rentabilizar sus esfuerzos de marketing. Esto a veces supone un problema de cara a mi relación con ellos ya que todos quieren un sitio web exclusivo y novedoso. Como bien explicas, probando varios diseños al final, por el peso de la evidencia, acaban decantándose por los diseños más usables y amigables para sus usuarios. Es curioso. Si uno va a un profesional del derecho o la salud se deja aconsejar sin mayores problemas pero a la hora de crear sus sitios web muchos empresarios se vuelven diseñadores web.
    Eso les suele salir más caro.

    Un abrazo: Huberto

    1. Gracias Huberto, me gustó tu comparación con los profesionales del derecho o la salud, y es verdad, pero es la poca valoración que se le da al desarrollo de un sitio web.
      A propósito, si andas por Madrid en Septiembre, estaré por alli desde el 6 al 10, tal vez podamos encontrarnos 😉

Deja un comentario

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