La Psicología del Diseño Web

Tardas unos 7 segundos en juzgar a alguien que acabas de conocer. Esa primera impresión es muy importante, suele ser la que se queda, a menos que tengamos más oportunidades. Con el diseño web ocurre lo mismo, solo que el juicio es mucho más rápido y generalmente no damos más que una oportunidad.

Así es. Con las personas, a veces tenemos la oportunidad de coincidir más veces con ellas y cambiar nuestra primera impresión, tanto para bien como para mal. Pero con el mundo del diseño web, esa oportunidad puede que sea la única.

Por eso la psicología del diseño web es muy importante: esa primera impresión es clave para el impulso de tu negocio online.

El papel de la Psicología en el Diseño Web

El diseño web no solo requiere los conocimientos técnicos, sino también tener en cuenta ciertos aspectos de la psicología. No quiere decir que para ser un buen diseñador web tengamos que ser también psicólogos, pero sí tener claras algunas nociones y conceptos psicológicos con el fin de generar interés en el usuario de internet. La experiencia del usuario y la usabilidad son clave en el diseño web y también en el posicionamiento orgánico en Google, por ejemplo.

En otro post acerca de las creencias falsas sobre el diseño web explico que la apariencia visual de un sitio no es lo más importante a la hora de desarrollar una página. Nada más cierto. Pero también es verdad que el ser humano responde a los estímulos visuales.

Elementos tan sencillos como los colores, las fuentes (tipo de letra) y sus tamaños, la maquetación o las llamadas a la acción, pueden ser detonantes del éxito o del fracaso de un diseño. No solo responde a los estímulos visuales, sino que, además, el ser humano hace relaciones subconscientes basadas en ellos.  

Por ejemplo, imagina alguien en busca de un banco online y encuentra un sitio web con un tipo de letra infantil (la detestada Comic Sans, por ejemplo). Aunque su contenido textual sea excelente, el usuario seguramente no lo tomará en serio y se marchará.

En este post vamos a ver la Psicología del Diseño Web y como influye en el rendimiento y éxito o fracaso de los sitios.

Algo básico sobre la Psicología

Hoy hay pocos campos en los que no se aplique la psicología, de un modo u otro. Desde la política al diseño web, pasando por la música y el marketing.

La psicología es la ciencia que estudia la conducta, procesos mentales y experiencias del ser humano. Tiene su origen en la filosofía, ya que trata de responder a preguntas trascendentales, además de ayudar a mejorar la vida de las personas y predecir conductas.  

Con el fin de comprender nuestro comportamiento y así poder elaborar sus teorías, la psicología recopila y agrupa datos sobre conductas, percepción, experiencias subjetivas, emociones, etc. Con la información recogida en estas investigaciones la psicología es capaz incluso de realizar predicciones de comportamiento.

Hay distintas ramas de la psicología, pero no nos vamos a detener en mencionarlas siquiera, ya que no es necesario para la elaboración de este post.

La única que sí que tengo que mencionar es la psicología del consumidor y ese concepto que ha surgido en los últimos tiempos: el “neuromarketing”.

Seguro que te habrás fijado. Desde hace unos años, le añades a cualquier cosa el prefijo “neuro” y parece que queda patente su conexión con el estudio del cerebro. Pero no te fíes demasiado de estas cosas. Que yo use ciertos elementos de psicología y neurociencia para diseñar sitios web, no convierte lo que hago en psico-diseño web ni en neuro-diseño web.

La Psicología Del Consumo

Cuando se aplica la psicología a un grupo concreto de personas, en este caso, a los consumidores, se intenta descubrir cuáles son los procesos mentales y emocionales que sigue ese grupo de personas que consumen.

Dentro de esos procesos psicológicos se incluye uno muy importante: el proceso de toma de decisiones.

¿Por qué eligen un producto o servicio y no otro? ¿Qué factores influyen en la decisión? Esto es la psicología del consumo y su finalidad es conocer de antemano el comportamiento del consumidor tipo.

Solo para recordarte el típico ejemplo de psicología de consumo en nuestro entorno tradicional. En un súper, lo más básico suele estar al fondo. Tenemos que recorrer la mayoría de zonas de productos menos relevantes para llegar al pan o la leche. Colocan los productos que prefieren que compremos a la altura de los ojos, relegando a estanterías más altas y bajas los que interesan menos. En las cajas, para que piques mientras esperas en la cola, siempre ponen ofertas y cosas totalmente prescindibles y de pequeño tamaño.

El Neuromarketing

Es muy parecido a la psicología de consumo. De hecho, en gran parte, está basado en ella. Es el estudio de los procesos mentales que llevan a las decisiones de compra, desde los procesos mentales previos hasta los posteriores de la misma, y también su monitorización.

El neuromarketing es igual de legítimo que la psicología de consumo, pero cuidado con quienes se hacen llamar profesionales del neuromarketing, que tendrían que ser psicólogos y no lo son.

La Psicología de Consumo Aplicada Al Diseño Web

Antes he descrito en un ejemplo lo de las zonas y la colocación de los estantes en los supermercados. Estos mismos principios se pueden aplicar al diseño web.

¿Cómo se aplican principios de este tipo al entorno virtual del diseño de sitios web?

Recordemos que el diseñador debe ser capaz de desarrollar sitios en los que las páginas, primero, despierten el interés del usuario y, después, le seduzcan.

Esto no se logra solamente con colores, tipos y tamaños de letra, etc. Si nos basásemos solo en estos detalles, y pese a ser capaces de diseñar una web espectacular desde el punto de vista estético, podríamos caer en el error de crear sitios carentes de funcionalidad*. Es decir, un sitio visualmente impresionante, pero nada funcional para el objetivo de conversión, cualquiera que sea.

* La funcionalidad es lo que hace que una web logre su objetivo, que puede ser desde llenar un carrito de compra hasta descargar algo gratis o contactar con el propietario.

Primera impresión de una web

Los tiempos en el mundo virtual son muy diferentes de los del mundo real.

Velocidad de carga

Por ejemplo, para Google, que tu web no sea capaz de cargar en menos de 5 segundos es mala señal. De hecho, lo ideal sería que cargase en menos de UNO. Igualmente, para Google, que un usuario esté dentro de tu web durante un minuto, ya es todo un logro. La mayoría de gente no lo hace. Si no encuentran lo que buscan o algo que les llame la atención en unos 30 segundos, prefieren salirse y entrar en otro sitio. Queda patente entonces lo que decía: los tiempos en internet son muy distintos.

Permanencia del usuario en segundos

Según esa misma regla, y si consigues que el usuario (o incluso puede que cliente potencial) se quede en tu web más de 30 segundos, ese primer minuto es crucial. Es como la primera impresión que tienes al conocer a una persona, que mencionaba al principio de este artículo. Ese primer minuto, extensible a dos, son los que van a crear una imagen de marca en la mente del usuario. Y también lo que hará que empiece o no a confiar en ti y tu servicio o producto.

Los colores y fuentes (tipo de letra)

La información que registra el usuario, en un 90%, es subconsciente y depende de la afluencia e influencia de las emociones que transmita tu web.

Por eso los colores son clave, de vital importancia. No es que haya colores mejores que otros, todo depende de lo que tu web quiera transmitir (recuerda el ejemplo del asesor financiero de antes). Un sitio web satánico no usará colores de tonos rosáceos ni fuentes (tipos de letra) demasiado simples. Una web de productos para bebés, no usará negros y sus fuentes serán lo más simples posible, e incluso infantiles o desenfadadas.

También influyen el espaciado entre letras y párrafos, la extensión del texto, el uso de listas, encabezamientos, mayúsculas, negritas, etc.  El texto debe ser lo suficientemente corto como para no agobiar y lo suficientemente largo como para comunicar plenamente tu mensaje (y que Google lo comprenda). Igualmente, ha de transmitir al usuario equilibrio, agilidad, espacio, libertad, y no peso, densidad, constricción.

Las imágenes

Un diseñador web sabe que la parte de la pantalla que antes y con más intensidad se mira es la parte superior izquierda.

Por eso, generalmente, ponemos los logos casi siempre arriba a la izquierda o, como muy lejos, en el centro de la pantalla. Hay muchas otras cosas a tener en cuenta al respecto, que puedes leer con más detalle en un post sobre consejos para crear una buena página de inicio.

Aparte de que sean imágenes realmente atractivas y que reflejen tu mensaje, para mí lo más importante respecto a las imágenes es la homogeneidad.

Me topo a diario con diseños web que mezclan imágenes en blanco y negro y en color. Sitios que mezclan imágenes de personas y abstractas que no tienen coherencia. Webs que mezclan ilustraciones con imágenes de fotos reales. Páginas con fotos muy grandes y otras muy pequeñas…

No respetar una línea homogénea de imágenes es un error garrafal. El usuario tal vez no lo advierta conscientemente, pero ese caos se registra en su inconsciente de forma negativa.

Otros factores psicológicos menos estéticos

Un sitio web y sus aspectos psicológicos no se ven influidos solamente por elementos tan evidentes como los anteriores.

Otros aspectos menos notorios, pero igualmente importantes son la maquetación, la funcionalidad, la navegación, la usabilidad y la experiencia del usuario.

Algunos elementos importantes a tener en cuenta están listados debajo.

Las Llamadas a la Acción

Se consideran llamadas a la acción todos aquellos elementos que incitan al usuario a HACER algo.

Verás muchos artículos en los que te cuentan qué son las llamadas a la acción.

Esas explicaciones nunca tienen en cuenta las llamadas a la acción “poco evidentes”, que explico en el post que te indico.

A mi modo de ver, hay llamadas a la acción de dos tipos, unas que son manifiestas o explícitas y otras que son más sutiles. Hay que saber utilizar ambas, desde el punto de vista psicológico.

Lo que acabo de hacer arriba, poniéndote ese enlace a un post de mi antigua web, es también una llamada a la acción, solo que no es tan explícita como las típicas: “ponte en contacto”, “suscríbete aquí”, “comprar”, “reclama tu descuento”, “síguenos en las redes sociales” y cosas similares.

Ahora que ya conoces lo que son las llamadas a la acción, y los dos “tipos”, evita a toda costa agobiar al usuario con demasiadas. Aclárate tú primero y define cuál es el objetivo de la página concreta o la de la web en general (que el usuario te contacte, que se suscriba al blog, que se sume a tus seguidores en las redes, que pinche en los anuncios, etc.). Céntrate en una llamada a la acción estratégica porque, si hay más, el usuario puede agobiarse al recibir tantos mensajes imperativos, y terminar por irse. Piensa solamente en esas ocasiones en que entras a una tienda y no hacen más que agobiarte. Al final te vas de la tienda sin comprar nada.

El texto y la empatía

Estimular las emociones del usuario mencionando su problema, preocupación o necesidad (lo que yo llamo “el dolor del cliente potencial”) logra que la web empatice con él o ella. Simplemente esas menciones harán que conecte inconscientemente con la web y se sienta comprendido, el primer paso para sentir que ha encontrado la solución a su problema o necesidad.

Aquí ves la importancia que tiene CONOCER A TU PÚBLICO OBJETIVO, a tu nicho de mercado. Si piensas que tus productos o servicios “son para todo el mundo”, vuelve a pensar. Identificar el nicho de mercado para conocer sus necesidades es vital, ya que es la única forma que tienes para comunicarte con él: la empatía, esa conexión emocional. Lo que comunicas y cómo lo comunicas es trascendental para el éxito de tu negocio online. Y a esto se dedica la psicología del diseño web.

También es importante mencionar, en algún momento y en lugares estratégicos, los beneficios (racionales) que obtendrá si adquiere el producto o servicio.

Funcionalidad

Todo lo anterior (imágenes coherentes, textos sugerentes, llamadas a la acción, etc.) no servirá de nada si la funcionalidad y usabilidad del sitio web es un desastre. Asegúrate de que la web fluye como un caudal de agua, que el usuario vaya navegando de forma natural por los lugares estratégicos.

Asegúrate también, naturalmente, de que no hay errores técnicos. Imagina que no funcione el formulario de contacto, que tu teléfono esté mal puesto, o que un enlace a un artículo o a la cesta de la compra estén rotos.

Conclusión

Como has visto, la psicología del diseño web no se trata de que los que diseñamos tengamos que ser psicólogos. Sin embargo, sí es importante tener en cuenta algunos conceptos psicológicos, como el comportamiento del usuario. Conceptos que, por otro lado, son de cajón. Si lo piensas, son cosas bastante corrientes, aunque es verdad que poca gente cae en ellas.

¿Qué te ha parecido el artículo? ¿Te vas a diseñar tu propia web? ¿Cómo vas a aplicar algunos de estos consejos? ¡Comentarios siempre bienvenidos!

(¡Ejemplo de llamada a la acción explicita!)