Comunidad de diseño web y desarrollo en internet

20 consejos de usabilidad esenciales para proyectos web

Todos sabemos qué es la usabilidad, pero es increíble la cantidad de gente que, por entregar "ya", la ignora de frente. Es culpa de los clientes en ocasiones, pero la no-usabilidad es una falta clara de profesionalismo. Y no sólo eso, agregar un par de arreglos estúpidos, pero que ignoramos por error o por afán, hace una gran diferencia en las visitas a nuestros sitios web. Si además te dedicas a Internet como un negocio, seguir por lo menos la mitad de esta lista te asegurará, más que un éxito inicial, una comunidad.

Dolorosamente obvios


Estos son los consejos que pueden parecer idiotas, pero seguro los ignoramos en uno u otro proyecto. Es importante ser consciente de ellos.

Navegación visible todo el tiempo



Crea una unidad de diseño en navegación y mantenla todo el tiempo. Si tu header tiene una botonera horizontal, asegúrate que se vea en todas partes. Cualquier persona debe ser capaz de navegar desde cualquier parte a cualquier parte de tu sitio. Si no, lo más seguro es que lleves a tu usuario a creer que ha cambiado de página.

Navegación invisible



La navegación invisible es otro problema, originalmente generado por los flashers, pero llevado al mundo de CSS y AJAX. Tienes toda la navegación de tu web escondida bajo iconos y sólo sabes qué hace un botón cuando pasas el mouse por encima. Tu botonera no es la barra de herramientas de Word. Poner una descripción contextual y clara de la función de cada botón es clave. Un usuario debe poder tomar una decisión antes de mover el mouse a un elemento de la interfaz.

Intros en Flash



De esto hemos hablado mil veces en Cristalab y afortunadamente ya están muriendo. Pero por si quedan dudas. Los usuarios en internet tienen la capacidad de concentración de una gallina. No hagan que se distraigan.

No interrumpas el flujo de trabajo del usuario



Popups de Javascript, sonido de fondo, desactivar el click derecho. Toda esa mierda espanta a los usuarios y hace que recuerden un odio especial en contra de tu creación. Es simple, no lo hagas. Intenta ser tan amable y bueno con tu usuario, así te duela a ti. A él jamás le debe doler.

Crea links semanticamente descriptivos



No te atrevas a crear un enlace con "click aquí". Eso no le dice NADA al usuario antes de dar click. Es una mala practica para posicionarte en Google y en general va en contra de toda la filosofía de la web. Simplemente no lo hagas.

Toques profesionales


Implementar ciertos arreglos de usabilidad, simples en su concepción, pueden mejorar mucho la calidad de tu trabajo final y el profesionalismo que reflejas.

Has prototipos



Puede que suene como una de las "dolorosamente obvias", pero hacer prototipos en papel o en programas como Balsamiq Mockups realmente cambia la forma en la que ves las interfaces de tus futuros proyectos. Podrás identificar rápidamente las buenas ideas, las cosas terribles y aquello que puedes mejorar.

Esconde lo que el usuario no necesita saber




El iPod no debe su éxito a sus impactantes características técnicas, sino a lo mucho que no le dice a sus usuarios. El hecho que seas un geek que quiera saber la cantidad de milisegundos en la que cargan tus paginas no implica que eso le sirva de nada al usuario. Pueden haber secciones, enlaces, botones e información completamente irrelevante para tus usuarios. Protegelos de eso. Aprende a "podar" tu arquitectura de contenido y borrar lo que no sirva.

Usa lo que creas


Es increíble la cantidad de gente que crea cosas para otros y jamás las usa. Si no usas lo que creas, jamás crearás un producto para ser usado. Obligate a usar realmente las cosas que creas y verás un cambio en lo que haces.

Escucha tus estadísticas



Google Analytics es un software genial. Te permite, usando pageTracker._setVar, colocar variables de tu creación en las estadísticas. Así puedes ver cosas como las temáticas más visitadas, usuarios registrados vs. invitados, entre muchas otras que serían imposibles con las estadísticas tradicionales. Además tiene el Bounce Rate, un valor que indica el porcentaje de visitas que se van sin dar clicks a nada. A menor porcentaje, tienes un mejor y más envolvente interfaz.

Crea formularios decentes



Aunque tu cliente lo crea, tu no necesitas el cumpleaños de tus usuarios. Hay una gran cantidad de datos que realmente no necesitas al registrar un usuario. Lo mismo pasa con los forms de enviar comentarios en los blogs. A eso sumale los CAPTCHA inentendibles que es mejor desechar. Usa otras técnicas para frenar el spam, como las preguntas matemáticas, las técnicas bayesianas, akismet, javascript o acusalos con su mamá.

Consejos innovadores


No tienes que crear un nuevo elemento de interfaz para mejorar un producto. No tienes que ser Apple para innovar (aunque ayuda).

Autocompletado en los campos de texto



Google y Amazon ya lo implementaron. Un sistema sencillo de autocompletado de acuerdo a las consultas más frecuentes en el campo que uses puede mejorar radicalmente la experiencia de tus usuarios. Lo mejor es que es MUY fácil de implementar. Con jQuery UI sólo tienes que hacer esto. En jQuery:

Código :

$("#autocomplete").autocomplete({ 
    data: ["aero", "airplane", "book", "movie", "music", "sports", "skating", "swim"] 
});

Y en HTML:

Código :

<input id="autocomplete" type="text" />

Y ya está. En serio.

Motores de recomendación



Para Wordpress hay millones de plugins, o si el heroísmo corre por tus venas, puedes programarlo. Los motores de recomendación de productos, de artículos relacionados o lo que sea que enlace el contenido de lo que estás viendo con otros similares capturan a tus usuarios con gran efectividad. ¿O no sientes la necesidad de comprar eso que Amazon te recomendó?

Asesina todos los clicks que puedas



La web de las descargas de Apple tiene un componente Accordion con las descargas por categorías, al cual no necesitas dar click para cambiar de panel. Amazon tiene implementada la peligrosa función "Compra con un click" para eliminar todos los pasos innecesarios y dolorosos del e-commerce. A más clicks hagas desaparecer, mejor será la experiencia y fidelidad de tus usuarios.

Usa AJAX inteligentemente



AJAX es una tecnología que ha sido abusivamente violada por incontables "iniciados" del diseño web. Sin embargo, usarla en los casos correctos puede crear una diferencia. Youtube la usa para cargar las páginas de comentarios y enviarlos sin necesidad de cambiar de URL, así puedes mantenerte escuchando el video mientras lees los comentarios.

Has experimentos de usabilidad



Lo mejor de la web, comparado con otros mercados, es que hacer experimentos es gratis. Prueba, con estadisticas claras, distintas interfaces y arreglos posibles. Mira cual te genera más visitas, cual baja más el bounce rate, cual hace que más usuarios se registren. Los experimentos son la razón por la que Halo 3 es uno de los juegos más vendidos de la historia. No es porque sea el juego más innovador o con mejor historia, es porque es increíblemente usable.

Imagina interfaces nuevas alrededor del contenido existente



Gmail no sólo nos cambió la vida trayendo los correos de gigabytes y el AJAX que hace que no tarde en cargar tu correo. También introdujo un concepto muy obvio, pero que nadie había intentado antes: Conversaciones anidadas.

El hecho de crear una nueva interfaz para el correo electrónico cambió sin duda la forma en la que usamos nuestro email. No crearon una nueva interfaz, no insertaron multitouch o una ruedita al correo. Simplemente lo organizaron en un hilo como un foro.

¿Quieres compartir algún consejo tuyo?


La usabilidad en nuestros proyectos también la crea la experiencia en el medio. Si tienes más consejos o preguntar acerca de estos, déjanos tu comentario. Los que digan que no son 20, serán recibidos con una amable carta de agradecimiento a tu casa y dos puntos láser de snipers.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate