La importancia de la usabilidad, teoría y trucos básicos | DiazSecurity.com – Blog de Miguel Díaz
10 abril, 2011 a las 10:08

Algo con lo que me encuentro a menudo son con programas poco usables, algunos mas cuidados en su diseño, otros menos, pero en general complicados y poco intuitivos.

Un error en la mayoría de programadores y diseñadores pensar que el usuario es alguien experimentado, que ha trabajado antes con nuestro software, que sabe como funciona o que va a leerse la documentación.

La importancia de la usabilidad

En Internet no existen distancias, la diferencia entre ganar un cliente y perderle puede ser simplemente hacerle pensar durante mas de cinco segundos. Hay estudios que demuestran que los usuarios no esperan mas de 10 segundos desde que ven una Web hasta que tratan de hacer clic en algo.

El usuario no quiere pensar y cada vez que hace algo que no quería o le cuesta buscar un apartado se siente frustrado.

En el mundo real buscar una alternativa quizás sea algo complicado y le haga perder a alguien un día entre un establecimiento u otro, en Internet solo está a una nueva búsqueda en el navegador, por tanto haga las cosas realmente fáciles e intuitivas para el usuario si no quiere perderle.

Haz notar donde se puede hacer clic y el para que sirve

Un error básico del software general y páginas Web es el poco contraste entre los lugares activos (Vínculos, botones, etc) e inactivos (texto, imagenes…). Estoy seguro que muchos habéis entrado en alguna página Web y habéis hecho un par de clics a ciegas en sitios que no realizaban ninguna acción o habéis estado buscando un vinculo que no habéis descubierto hasta que no habéis pasado el cursor por encima.


El error mas común es cuidar el diseño de forma enfermiza, a muchos diseñadores les horroriza tener muchos contrastes en sus textos, el poner el típico color azul en un vínculo es algo que se escapa de sus cabezas y prefieren simplemente subrayar el texto o dejarlo como está esperando que alguien lea el “haz clic aquí”. Nunca hagas pensar a tus usuarios. Haz las cosas visibles y fáciles, sabes que cuando alguien imagina un vínculo lo imagina azul y subrayado y no tiene por que saber como se te ha ocurrido a ti decorarlo así que tienes una herramienta potencial  para atraer la atención del usuario hacia ese punto.

Otras formas de hacer un elemento activo visible es darle aspecto de botón, con un fondo de un color distinto y un borde no queda duda de que no es algo común y siempre haz que el cursor cambie al ponerlo encima. Algo como la imagen que encabeza este apartado nadie dudaría que es un botón

Haz que el usuario sepa siempre donde está

Es muy importante que el usuario sepa en que parte de tu programa o Web se encuentra, así si en el futuro necesita volver sabrá donde ir, hay dos métodos básicos y muy eficientes:

  • Navegación por pestañas: Es la usada por sitios como tuenti.com o cssmania.com y simula las pestañas usadas de toda la vida en un archivador. Está indicada especialmente para páginas con pocas secciones y es muy importante remarcar siempre la sección actual en un color distinto al resto. Es increíblemente potente puesto que aunque no hayas visto un ordenador en tu vida sabes como funciona puesto que es algo heredado de los medios fisicos (archivadores, agendas, etc)
  • Navegación por semillas: Usada por sitios donde hay muchas secciones y subsecciones y la navegación entre ellas es algo habitual. Su estructura básica es algo como un texto en la parte superior donde dice Inicio>Subseccion>Contenido. Para indicar la posición donde nos encontramos, es importante que cada semilla esté vinculada a su sección y la parte donde estemos remarcada de alguna forma.

Evita las coletillas y el texto innecesario.

El usuario no quiere leer, cuando alguien usa Internet para obtener información busca rapidez e ir directo al grano, hay algo cierto en el 100% de las páginas Web (incluída esta) y es que se podría eliminar el 60% del texto sin dejarse ningún detalle, revisa tus documentos varias veces y elimina todas aquellas palabras y frases innecesarias.

Haz las cosas simples, si por ejemplo estás ofreciendo la descarga de un archivo no pongas “Para descargar haz clic aquí” donde “haz clic aquí” sea el vinculo. Simplemente haz un vinculo que diga “Descargar” y dale el aspecto adecuado.

Pon un buscador en tu Web

Es algo que hoy en día incorporan la mayoría de sitios e incluso la mayoría de sistemas operativos lo integran para buscar entre sus programas opciones y archivos, pero es algo básico y muchas veces no nos damos cuenta al crear un sitio. Hay dos tipos de usuarios, el que le gusta navegar por las secciones para encontrar algo o el que prefiere ir al buscador y hacer una búsqueda relacionada, nuestra intención es hacerlo fácil, así que siempre añade la opción de buscar en tu sitio Web.

Usa los puntos de atención de forma adecuada

Cambios de color en el texto, fuentes en negrita, subrayadas, etc. Son excelentes metodos de llamar la atención del usuario hacia aquello que puede interesarle, pero el exceso de este puede marearle e incluso desorientarle mas que si no tuviera ningún punto de atención. Intenta restringir estos puntos solo a lo necesario como vínculos, secciones y opciones comunes.

Acerca de Miguel Díaz

Informático, enamorado de la programación, diseño Web y el deporte.
Categorías: Diseño Web, Internet, Programación, Usabilidad. Etiquetas: , , , , , .

Deja un comentario

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