por Omar Benyakhlef | Usabilidad
Al diseñar una página web, a menudo nos encontraremos con que tenemos que diseñar un formulario, en unos casos tendremos que diseñar formularios pequeños como los de registro, pero en otros podemos llegar a encontrarnos con formularios muy largos, que por algún motivo de programación no pueden dividirse en otros más pequeños.
A continuación os explico algunas de las condiciones que debemos de tener en cuenta a la hora de diseñar estos formularios.
En los tres casos de la figura, podemos ver la diferencia que hay a la hora de colocar los textos descriptivos de cada caja.
En el caso 1 conseguimos una buena legibilidad entre los textos y sus correspondientes cajas, en el caso 2 identificamos bien los distintos textos de caja, pero por otro lado contamos con el inconveniente de que cuando un texto es mucho más corto que otro, la distancia entre el texto corto y su caja dificulta mucho la identificación. Este problema se ve solucionado en el caso 3, pero por contra perdemos la legibilidad en vertical.
En cuanto al espacio, vemos que en las figuras 2 y 3 se reduce considerablemente el espacio vertical del formulario, ya que en el caso 1 nos obliga a meter dos lineas por casilla.
En definitiva, habrá que valorar el tipo de formulario al que nos enfrentamos y usar la opción 1 si disponemos de espacio y la opción 2 acompañada de un background que vaya identificando lineas y que facilite la conexión entre descripción y caja.
En cuanto a los botones, el botón del formulario siempre debe de estar al final del formulario y alineado a la derecha. En caso de que haya varios botones, uno primario (guardar, enviar,…) y otro secundario (atrás, borrar,…), deberemos seguir el siguiente criterio:
- El botón primario debe de tener un mayor peso visual, para que el usuario vea con claridad el final del formulario.
- Siempre alineado más a la derecha que los demás secundarios.
por Omar Benyakhlef | Usabilidad
Encontré un muy interesante artículo sobre errores más frecuentes a la hora de diseñar una web. El titular del artículo es Jakob Nielsen, y aquí os dejo un resumen traducido.
- Mala programación del buscador
a la hora de diseñar un buscador, hay que tener en cuenta los errores tipográficos que pueda cometer el usuario, permitir plurales, guiones y otras variantes de los términos de búsqueda. Además el resultado de búsqueda suele ser en función de la cantidad de veces que aparece el término, en lugar de la importancia del documento que lo contiene.
El usuario prefiere usar el buscador a la hora de encontrar un contenido, y mucho más, si la usabilidad del sitio es mala.
- Los documentos PDF
nada peor que encontrar en la navegación un PDF, ya que rompe todo el flujo. Además de ralentizar, la mayoría de las veces el documento no coincide con el tamaño del navegador del usuario. Dejemos pues este tipo de archivo para aquellos casos en los que el usuario tenga que descargarse un archivo y leerlo más tarde.
- Cambiar el color de los enlaces visitados
este punto a mi modo de ver es muy discutible. Jakob Nielsen alega con toda la razón que el no cambiar el color del enlace visitado perjudica la usabilidad y dificulta la navegabilidad al usuario, ya que es fácil equivocarse y volver sobre páginas ya visitadas al haber pulsado por error de nuevo el mismo enlace.
Estoy de acuerdo con esta apreciación, si bien la dejaría sólo para aquellas ocasiones en las que se trata de un listado enorme de hipervínculos, pero para un enlace perdido o un par de opciones en una página no creo que sea necesario.
- Los muros de texto
un bloque de texto interminable, sin el interlineado adecuado, sin puntos y aparte, provoca un rechazo hacia el usuario. La apariencia es de algo muy denso que va a ser difícil de digerir. Hay que usar títulos, subtítulos, separar las ideas por párrafos, hacer en general que sea apetecible para el usuario. Yo añadiría más, sería inlcuso aconsejable, que pudiésemos leer desordenadamente el documento. Y esto se consigue separando las ideas y con títulos y subtítulos muy descriptivos.
- Tamaño de fuente
es importantísimo que el usuario se sienta agusto al leer un texto. Una fuente demasiado pequeña o demasiado grande perjudica la lectura. Lo ideal, que se pueda modificar a gusto del consumidor, con css y valores relativos en lugar de absolutos.
- Títulos de página con baja visibilidad
el título de una página es muy importante, ya que en el resultado de búsqueda de cualquier buscador va a ser este título el que aparezca en el listado, y es muy importante que sea lo suficientemente descriptivo y atractivo para que el usuario lo elija frente a otros.
Los títulos también se usan como entrada en los favoritos de los navegadores, por lo que es muy importante que sean descriptivos del contenido de la página a la que representan.
Para la home se recomienda empezar con el nombre de la empresa seguido de la descripción, no usar artículos al principio o frases como «bienvenido a….».
También sirve el título de la página, para nombrar la ventana del navegador que tenemos abierta, por lo que un usuario con varias ventanas abiertas, agradecerá poder reconocer nuestra página con un solo vistazo, por lo que también es importante meter el máximo de información en las primeras palabras.
- Atención selectiva
cualquier cosa que parezca un anuncio es rechazada en el camino de búsqueda de información que realiza un usuario. Yo no estoy de acuerdo en que no se pueda diseñar algo que parezca un anuncio, lo que hay que hacer es que ese diseño esté lo suficientemente integrado en la hoja de estilo de nuestra web, para que el usuario lo reconozca como información propia de la web y no como producto externo.
He tenido que diseñar muchas creatividades de muchoviaje.com en otros portales como Terra, msn, wanadoo…. y os puedo asegurar, que los mejores resultados los dieron las creatividades que se adaptaban al estilo de la web que los albergaba, pero con mucha diferencia.
- Coherencia
este es uno de los errores más frecuentes hoy en día. Cuando la navegabilidad es coherente y «plana», es decir, sin sobresaltos, cualquier diseño que salga de esa linea, llamará poderosamente la atención del usuario. Una navegación coherente y sin sobresaltos provoca que el usuario se sienta agusto y confiado, en todo momento sabe como afrontar una nueva página porque viene de otra de igual arquitectura. La inseguridad en la navegación provoca la salida del usuario de la web, y por supuesto acaba con la fidelización.
- Ventanas emergentes
una ventana emergente hace que el usuario se quede sin uno de sus principales medios de navegación, el botón atrás. Un hipervínculo es el paso de una página a otra, y eso es lo que esperamos cuando lo pulsamos. El usuario tiene rechazo hacia los pop-ups, por lo que se aconseja el indicar que ese hipervínculo se abrirá en una nueva ventana, para así evitar sorpresas.
- No dar al usuario lo que anda buscando
otro error frecuente es intentar engañar al usuario. Hay que asumir que si un producto no interesa a un usuario no tiene por qué venderse a cualquier precio. En numerosas ocasiones se esconde el precio, o te dan un desde que luego no tiene nada que ver con el desembolso final, por no hablar de cuando entramos en una página que hemos encontrado en un resultado de búsqueda y cuando llegamos lo único que encontramos relacionado con nuestro interés, son las mismas palabras clave introducidas en el buscador y otro contenido totalmente diferente.
por Omar Benyakhlef | Diseño de páginas web, Usabilidad
Creo en la simplicidad, por supuesto que no todos los sitios web pueden ser igual de sencillos, pero si deberían ser todos capaces de en pocos rasgos dar a conocer lo que el usuario está esperando de ese site.
Toda web tiene un objetivo y todo usuario tiene una atención finita.
El diseñador ha de ser capaz de llevar la atención del usuario hacia lo que quiere y no quiere buscar, pero de un modo fácil y sencillo, sin banners estridentes ni demás recursos tan usados en muchas web.
El usuario ha de diferenciar en todo momento lo realmente importante de una información, es muy importante saber elegir un titular o saber cuándo tenemos que poner en negrita una frase. En mi relación laboral como diseñador de www.muchoviaje.com pude comprobar como cuando hacía publicidad online para otros sitios (orange, msn, yahoo,….) el resultado de click through era mucho mayor cuando las creatividades estaban disimuladas con el aspecto del site que las contenía. Esto es, el usuario veía esas creatividades como parte de la información del site y no como publicidad externa.
Tenemos que permitir la comunicación, y también tenemos que reducir al mínimo el ruido.
No podemos seguir engañando al usuario con contenidos falsos. Que un usuario no encuentre el contenido de la información que ha solicitado bien por mala arquitectura y usabilidad del sitio o bien por haber sido «engañado» no genera visitas válidas, porque ese usuario no volverá nunca a consultar en nuestra web.
