Al fin has logrado montar tu web después de mucho tiempo invertido.
Ya publicas posts, instalas tus propios plugins y en general te manejas bien con WordPress.
Ha llegado el momento de personalizar tu plantilla.
O quizá ya lo hiciste. Elegiste un color que a tí te gustaba. Tal vez un verde, o quizá un azul. Te parecía que se veía bien, pero después de volverle a echar un vistazo no quedas convencido. ¿Será mejor el azul o el verde?
Incluso puede que haya pasado el tiempo y que lo hayas cambiado un par de veces más. Ya no lo haces porque has quedado confundido e indeciso, pero aún te queda la espinilla sobre qué color elegir.
Mi respuesta: Depende. Pero no del color que más te guste a tí, sino del que mejor proyecte lo que eres como negocio y cómo quieres que te perciban tus clientes.
Sé que esto puede sonarte muy abstacto, por eso vamos a verlo a detalle.
Antes de elegir colores, ten en cuenta…
Pero antes quiero explicarte algo que es imporante que conozcas.
Y es que es escencial que tú como profesional autónomo conozcas qué es lo que ofreces como negocio:
- ¿Qué productos y/o servicios ofreces?
- ¿Cuál es el sector o nicho en el que estás inmerso?
- ¿Cuáles son los valores de tu negocio?
- ¿A qué audiencia están dirigidos tus productos/servicios?
- ¿Qué emociones quieres transmitir?
Te estarás preguntando ¿y esto qué tiene que ver con los colores que quiero elegir para mi web?
Todo. Para ser más clara te pondré un ejemplo.
Imagina que eres un psicólogo especializado que ayuda a otras personas a mejorar su autoestima.
A tí te puede parecer que el azul es un color que va para un psicólogo, pero ¿realmente estás atrayendo a tu público a través de este color?
Ya que el azul es un color frío y una de sus simbologías se relaciona con la serenidad y tranquilidad, quizá no sea la mejor elección ya que lo que tú buscas es motivar.
Un color de la gama de colores cálidos cumpliría mejor este propósito.
Lo mismo sucede con el nicho en el que te mueves. Un psicólogo infantil no usaría los mismos colores que un psicólogo que realiza terapias de pareja. Son públicos distintos.
Primero, elige un color de base
Ya tienes claro lo que ofreces, a quién va dirigido y lo que quieres transmitir como marca. Vale, ¿cuál es el siguiente paso?
Es importante que conozcas de antemano esta información porque una vez que tienes claro tus servicios, sector, audiencia y valores, lo que sigue es elegir el color principal de acuerdo al significado del color que mejor transmita tu marca.
A esto se le llama psicología del color. Seguramente lo habrás escuchado. Pero ¿qué es la psicología del color?
Los colores evocan emociones. Si queremos proyectar una imagen de marca adecuada es necesario conocer qué sentimientos provoca qué color.
Por eso te dejo un listado con la emoción que está asociada a cada color.
Quiero aclararte que el uso del color puede tener distintos significados dependiendo del contexto.
El azul por ejemplo puede evocar tanto tranquilidad como sensación de limpieza. Es por ello que tanto una marca de un odontólogo como la de un banco pueden utilizar azul. Lo que los va a diferenciar es el tono que usen, pero eso ya será tema de otro post.
Sin más preámbulo te presento la lista de las emociones que transmite cada color para que puedas elegir mejor tu color principal.
Rojo
Se asocia con la pasión, energía, peligro, agresión, calor, lo erótico. Muchas cadenas de comida rápida usan este color para despertar estímulos de apetito.
Azul
El azul es uno de los colores que más se asocia con colores corporativos porque representa profesionalismo, seguridad, tranquilidad, autoridad. El azul también s muy usar en productos de limpieza.
Amarillo
El uso del amarillo requiere cautela, ya que usado en exceso puede parecer excesivo. Este color es asociado con el sol, y por lo mismo, con la alegría y felicidad, energía. Puede quedar bien su uso para una audiencia infantil.
Verde
Las asociaciones que tenemos con el color verde tienen que ver con lo natural, ecológico, orgánico, fresco, vegetariano. Dependiendo del tono, también se usa para promocionar productos financieros.
Naranja
El naranja es utilizado como un color representativo de la juventud, vitalidad, diversión. Se asocia también con la alimentación sana de frutas con este color.
Blanco
El blanco tiene una fuerte asociación con la pureza, la limpieza, simpleza, el minimalismo, la luz. Es importante tomar en cuenta el blanco y su combinación con otro para resaltar el uso de otros colores cuando se tenga un fondo de color y se empleé el blanco.
Negro
El negro representa la elegancia, el poder, sofisticación y la formalidad. Pero también representa el duelo por una pérdida, la muerte. Es muy usado para marcas personales.
Morado
Este color es muy usado para representar el misterio y la magia, pero también es muy usado para diseños que tienen que ver con lo femenino. Sin embargo, también ha sido usado como sinónimo de lujo a lo largo de la historia por el uso que le daban a este color la iglesia.
Rosa
En la actualidad es muy asociado con lo femenino.
Café
Es un color asociado con la vida rural y exteriores.
Si te quedó alguna duda te recomiendo que leas este artículo de Entrepreneur sobre La piscología de los colores para darte una idea de los múltiples significados que evoca un mismo color.
Llegó el momento de combinar colores
Ahora que ya sabes lo que quieres transmitir como marca e incluso ya has elegido qué color te representa mejor, es momento de combinarlo con otros colores. ¿Por qué? En el mundo del diseño web hay que ser intencional para dirigir a tus usuarios a los mensajes más importantes.
Mi recomendación personal es que elijas 3-5 colores:
- Un color principal, que es el que representará a tu marca y con el que las personas te van a reconocer y recordar
- Un color secundario que contraste para llamadas a la acción y mensajes importantes
- 2 o 3 colores neutrales o pasteles para remarcar tus mensajes principales en fondos o formas pero sin quitar atención de los colores principales.
Con esta información ya puedes elegir qué armonías de color usar, así que aquí va un poco de teoría del diseño.
Teoría del color aplicado al diseño web
La teoría de la armonía del color que nos sirve para combinar colores pero manteniendo una relación con los colores elegidos aunque sean distintos.
Las principales armonías son:
- Monocromáticos
- Complementarios
- Triádica
- Tetrádica
- Análoga
Colores monocromáticos
Esta combinación utiliza un mismo color pero el resto de colores a combinar tienen un grado mayor o menor de saturación obteniendo así diferentes tonalidades.
Esta combinación es útil cuando quieres destacar un solo color y combinar el resto de colores con diferentes tonos del mismo.
Combinación análoga
Esta combinación utiliza dos o más colores que están uno al lado del otro en el círculo cromático.
Combinación complementaria
Esta combinación utiliza colores opuestos. Es llamado complementario porque si observamos el círculo cromático, los colores complementarios son los que se encuentran exactamente al lado opuesto del color que hayamos elegido.
Esta combinación resulta útil para crear contraste entre el color principal de tu marca y las llamadas a la acción en botones, ya que cumplen su función de llamar la atención.
Por ejemplo:
Combinación triádica
Esta combinación, como su palabra lo indica, utiliza tres colores diferentes.
Combinación tetrádica
Esta combinación utiliza 4 colores: dos pares de colores complementarios.
Su uso es más complejo, pero usado de forma adecuada puede traer grandes beneficios.
Elementos web en los que considerar la elección de colores
Eligir un color que refleje tu marca ya conociendo el significado de los colores y aplicándolo a tu plantilla está bien, pero no es suficiente.
Eso sólo es para que tu audiencia se acuerde de tí a través de ese color que te representa, pero en el mundo del diseño web, necesitas aprender a combinarlos para resaltar los mensajes importantes, las llamadas a la acción, los elementos secundarios, etc.
Para definir la paleta de color principal de tu web necesitarás 4 a 5 colores: Los 2 o 3 principales para tu logo y que también utilizarás para resaltar texto en bold o formas, el color secundario para las llamadas a la acción y un color terciario para ornamentos o decoraciones.
Botón de llamada a la acción
Uno de los elementos más importantes en el diseño web estratégico es el botón de la llamada a la acción, o en inglés “Call to Action”.
Este elemento es el botón clave que guiará tu estrategia. En cada web, lo primero que tienes que ver es un call to action que te invite a realizar una sola acción.
Sí, sólo una. ¿Por qué? Porque si tuvieras más de una, puedes crear en el usuario una confusión que no quieres.
Parte de tu estrategia debe ser tener definido un sólo objetivo para la primera sección que verá tu usuario y encaminarlo a ello.
Un objetivo básico en toda página web que sea un negocio online es invitar a sus usuarios a susbribirse. Esta acción debe quedar clara desde el inicio y la manera de encaminar a tu usuario es mediante los colores.
Un botón de un color que contraste con el color principal de tu marca funcionará bien y garantizará las conversiones.
Debido a la importancia que tiene esta llamada a la acción, estos botones pueden encontrarse en varios lugares de tu sitio web. En todos los casos es recomendable utilizar el mismo color para estos botones.
Algunos lugares comunes donde colocar esa Llamada a la acción son:
- Home
- Pop-up
- Antes de finalizar el footer
- Sidebar
- Al finalizar o en medio de un post o página
Color de links
Los links son otro de los elementos importantes en una web y que además añaden ese toque de personalización que ayuda a resaltar la marca.
Una manera de resaltarlos es hacer que los links de tu web sean del mismo color que tu marca principal o subrayándolos.
Elementos de diseño en imágenes
Para añadir un toque mayor de personalización, es común ya encontrar muchas webs y blogs con imágenes personalizadas que llevan algún elemento decorativo de la marca.
En este caso es recomendable que estos elementos de marca sean o del mismo color que tu logotipo para que tus usuarios relacionen ese color con tu marca o un color complementario para la estética general de la web.
Ejemplo de caso de éxito
A modo de inspiración quiero compartir contigo la página web de Cristina Viartola, psicóloga especializada en temas de autoestima y salud emocional.
¿Te das cuenta del papel que juegan los colores? En el mundo online, aunque no tenemos un lugar físico, tu página web es como el consultorio que visita tu usuario y en donde pasa tiempo leyendo tus contenidos, es por ello que debes transmitirle confianza al reflejar lo que eres como negocio.
Un comentario
El tema
Está muy interesante y nos ayuda a comprender mejor lo que queremos de nuestro negocio muchas gracias