Cinco elementos que debes cuidar para conseguir un buen diseño web

La importancia del aspecto visual

autor: Begoña Ayerdi, 

Según algunas investigaciones, el modo de presentar un texto en la web influye en el comportamiento de los usuarios. Los elementos visuales no son meramente estéticos, ya que tienen que ver tanto con el contenido elegido para leer como con el hecho de continuar o no con su lectura. Según los expertos (Nielsen, Pernice, 2009), los lectores prefieren diseños que permitan “escanear” la información; esto es, diseños directos, breves y organizados con claridad.

En efecto, pocas veces leemos un texto web palabra por palabra; acostumbramos a “escanearlo”, sobre todo si se trata de un texto largo. Los estudios demuestran que, para conseguir el acceso rápido a un contenido, damos prioridad a ciertos elementos:

  • Nuestra mirada se dirige hacia las partes destacadas tipográficamente: en especial a las de tamaño grande o escritas en negrita, o a los elementos con color u organizados en listas.
  • Leemos en primer lugar determinadas zonas de la página web: analizamos el contenido en la dirección centro-izquierda-derecha (no izquierda-derecha, como en el papel). El modo en que agrupamos los contenidos también incide en el patrón de lectura.
  • Los elementos intermitentes y móviles no se consideran importantes, porque son mecanismos demasiado explícitos para atraer la atención. Conviene tener en cuenta que, en estos casos, la visibilidad y la credibilidad no suelen ir de la mano.

Por lo tanto, el diseño de los textos y de la página web ha de reunir las siguientes características:

  • Resultar agradables y tener en cuenta los elementos que priorizamos en la lectura: conseguiremos atraer la mirada de los lectores.
  • Ser comprensibles: ayudaremos a los usuarios tanto a buscar la información requerida como a entenderla del modo más eficaz.

Para lograr ese objetivo, conviene cuidar estos cinco elementos:

1. Espacios en blanco

Los espacios en blanco sirven para destacar elementos y asociar componentes análogos. Nos ayudan a jerarquizar los textos y a estructurarlos correctamente, para que podamos captar visualmente la relación entre sus elementos.

En este ejemplo, la organización del texto se refleja de un modo más claro en la segunda columna que en la primera columna:

espacios en blanco

2. Márgenes

Los márgenes confieren atractivo al sitio web y refuerzan el contraste visual entre el espacio positivo (texto y gráficos) y el espacio negativo (espacio en blanco). Del mismo modo, definen la zona de lectura al diferenciar los elementos de navegación de los elementos gráficos de la interfaz.

Conviene utilizar los márgenes de modo sistemático en todo el sitio web, puesto que le confiere un cierto aspecto de unidad. Al pasar de una a otra página en la web, el usuario debe tener la impresión de encontrarse todo el tiempo en la misma página.

Además de los márgenes, se pueden utilizar con esa misma finalidad los elementos comunes a todas las páginas del sitio: logotipos, rótulos, símbolos o colores, por ejemplo.

márgenes2

3. Imágenes y elementos multimedia

irudiak

Los usuarios prestan mayor atención a las publicaciones que contienen imágenes y elementos multimedia que a las que se limitan a ofrecer solo texto. Las imágenes les permiten captar la información en un vistazo rápido, así como establecer una relación emocional con el contenido. Utilizadas en su precisa medida, pueden convertirse en un “cebo” eficaz para llegar a los lectores. Al contrario, su uso frecuente provoca cansancio y desvía la atención del contenido esencial.

 4. Tipo y tamaño de letra

A pesar de la eficacia de los elementos citados hasta ahora, la información más importante se encuentra en el propio texto. Por esa razón, resulta imprescindible elegir un tipo y tamaño de letra adecuados.

En cuanto al tamaño de letra, podemos decir que, en general, la más apropiada es la fuente de 12 puntos. No obstante, en ocasiones resulta necesario adecuar el tamaño de letra a las necesidades específicas del lector al que pretendemos enviar el contenido.

5. Alineación

Conviene alinear los textos web a la izquierda. Justificarlos, por ejemplo, crea huecos entre las palabras, lo que dificulta la lectura.

Puedes comprobar la diferencia resultante entre estos dos tipos de alineación aplicados a un mismo texto:

alineación 

En resumen:

Algunos elementos de diseño utilizados en las páginas y en los textos web son sencillos: espacios en blanco, márgenes, imágenes y elementos multimedia, tipos y tamaños de letra o la alineación, por ejemplo.

Sin embargo, el uso adecuado de esos elementos:

  • Puede atraer lectores a nuestros textos web.
  • Posibilita que, una vez hayan elegido una información, continúen leyéndola.
  • Ayuda a que los contenidos sean fácilmente comprensibles.