Cómo elegir los colores para tu diseño web

Pintar una habitación por lo general se trata de hacer un espacio relajante y hermoso, pero esos primeros momentos después de entrar a una tienda de pintura pueden ser terriblemente intimidantes. Un muro de muestras para elegir, cada tarjeta solo ligeramente diferente de sus vecinos.

La elección no es de ninguna manera permanente, pero el color debe ser algo de lo que estés orgulloso. Puedes optar por tonos más brillantes y vibrantes para hacer un toque, mientras que otros prefieren o esperan un tono un poco más silenciado. El color de su pared puede ser atrevido o sobrio: un riesgo que se amortiza o una apuesta que no funciona.

Lo mismo ocurre con los colores que elija para su sitio web. Las personas pueden distinguir aproximadamente 7 millones de colores diferentes, por lo que pueden parecer grandes probabilidades de encontrar el tono adecuado para su sitio.

Afortunadamente, el cambio de los esquemas de color en un sitio web generalmente se puede lograr con un pequeño clic en el botón, sin pases de última hora a la ferretería para la imprimación. Sin embargo, si busca un toque de color en sus paredes o para impulsar conversiones en línea, aquí hay algunas nociones probadas que vale la pena considerar.

Lo que los colores comunican a nuestros cerebros: la psicología del color

Desde que creamos arte y construimos civilizaciones, la humanidad asignó significados simbólicos a los colores y exploró las formas en que nuestros cerebros los perciben.

Los antiguos egipcios mezclaban pigmentos a base de minerales para infundir su arte con significados basados ​​en el color: el crecimiento simbolizado en verde, la abundancia y la vida futura; El rojo, el color de la sangre y el fuego, representaba la muerte y la energía destructiva, y el oro era el color de los dioses. El poeta y estadista alemán del siglo XIX, Goethe, realizó una exploración filosófica de la rueda de colores, abriendo la puerta a estudios científicos de color duraderos en el campo emergente de la psicología occidental.

Algunos estudios, tanto anecdóticos como científicos, sugieren que la vista de los girasoles de Van Gogh y los arcos dorados de McDonald’s probablemente inspirarán efectos similares en el cerebro, a saber, un aumento de la energía y sentimientos de alegría (este último para inspirar un anhelo alegre y vivaz de papatas fritas).

Investigaciones recientes indican que hasta el 90 por ciento de los consumidores de hoy en día compran productos basados ​​en el color. ¿Todavía no estás convencido? Olvídate de tu contenido y producto por un momento y considera esto: el 42 por ciento de los compradores en línea basan su opinión de un sitio web únicamente en el diseño.

La elección del color es muy importante, ya sea en las paredes de tu sala de estar, tu sarcófago o en la página de inicio de tu blog o negocio.

El género, la edad y la educación cultural pueden influir en nuestras percepciones

Sabemos que el color tiene un impacto en nuestros cerebros, pero la sección del mundo donde creciste, junto con tu edad y género, muy probablemente afecta la forma en que percibes el color.

Tomemos, por ejemplo, la forma en que se percibe el púrpura en los EE. UU., El Reino Unido, la India y Tailandia: donde la mayoría de las personas en los países occidentales asocian felizmente el púrpura con el lujo y la riqueza, el color representa el duelo y la tristeza en la India y Tailandia.

Del mismo modo, el amarillo en los arcos dorados de McDonald’s, que se encuentra en 120 países y territorios de todo el mundo, está asociado con la felicidad en casi todo el mundo. Sin embargo, dependiendo de la ubicación de sus más de 36,000 restaurantes, McDonald’s crea su esquema de colores para atraer las preferencias culturales de sus clientes.

No te vuelvas loco tratando de elegir si tu blog debe estar acentuado con verde azulado o lila, pero ten en cuenta cómo tu público objetivo puede percibir esas opciones. Por ejemplo, los hombres tienden a gravitar hacia colores fuertes y brillantes, mientras que las mujeres suelen preferir tonos más suaves. Los azules y verdes son opciones ampliamente aceptadas y bastante seguras, mientras que tú puedes querer mantenerse alejado de naranjas y marrones. Las personas más jóvenes tienden a preferir los colores más brillantes, pero las paletas preferidas de las personas tienden a silenciarse más con la edad.

Un espectro de temas para diferentes medios: elección de los colores del sitio web

Ya sea para tu casa o tu sitio web, siempre es una buena idea asegurarse de que la estructura esté bien antes de comenzar a poner pintura nueva en las paredes.

Tener un proveedor de alojamiento web sólido es como tener un equipo de contratistas y técnicos autorizados las 24 horas del día, los 7 días de la semana: tu proveedor asegura que las paredes y las juntas de su sitio sean fuertes y seguras, que las luces estén encendidas y que no se filtre nada. De esa manera, puede concentrarse en los detalles y el mobiliario que hacen que tus invitados (léase: clientes potenciales) se sientan cómodos y en casa.

¿Estresado por elegir un color para tu sitio web? Cierra los ojos e imagínate a ti mismo caminando en un estudio de masaje o en una relajante clase de yoga, o da una vuelta rápida en Google para buscar en estudios locales en los que puedas darte un capricho. ¿Qué ves?

Ahh, ahora que estamos en una mentalidad bañada, tal vez en azules tranquilos o grises verdosos musgosos, podemos relajarnos y recordarnos que nuestros cerebros saben lo que estamos haciendo. En realidad estamos cableados para esto.

Por lo general, puedes confiar en tu intuición sobre el color si tienes en cuenta una verdad universal: cada diseño cuenta una historia. Nuestras opciones de diseño web dictan las percepciones de nuestros visitantes sobre nosotros, por lo que lo más importante a considerar cuando se elige el esquema de color para ti es cómo deseas que se lea tu historia.

Las firmas legales y financieras, por ejemplo, a menudo quieren dominar la confianza de los clientes y subrayar su profesionalismo en grises majestuosos y en los azules de la confianza. Sin embargo, los blogueros de alimentos y las tiendas de comestibles, por lo general, evitan los azules y grises fríos que suprimen el apetito para obtener rojos, naranjas y verdes cálidos y vibrantes que estimulan el apetito.

En otras palabras, ¿buscas despedirte de un ambiente amigable con el mercado local de los agricultores con una gama de tonos cálidos, o algo más elegante y pulido, como un rascacielos en Wall Street? ¿Los colores audaces y disruptivos colocados estratégicamente en fondos blancos nítidos destacarán tu destreza como líder innovador en tecnología o como empresario innovador?

Sí, elegir el color puede parecer un asunto complicado, pero una de las opciones más importantes que puedes hacer es no pensar demasiado.

Esquema de color: te has asentado en un color dominante: ¿qué sigue?

Una vez que hayas elegido un color dominante que capture el carácter de tu sitio web, es hora de concentrarse en el color secundario para redondear tu esquema. Aquí están las opciones dispuestas en la rueda de color.

· Monocromático: los esquemas monocromáticos utilizan un solo color y exploran diferentes variantes de luz y saturación. Si bien los esquemas monocromáticos se consideran más fáciles a simple vista, corren el riesgo de ser insulsos. Una salpicadura bien colocada de amarillo complementario o un púrpura análogo puede lograr mucho, por ejemplo, en una página llena de tonos de azul.

· Análogo: Los colores análogos están uno junto al otro en la rueda de colores y, en general, crean combinaciones que son agradables a la vista. A diferencia de los esquemas monocromáticos, los colores análogos se codean con los colores adyacentes a ellos en la rueda (imagen de rojo, naranja y amarillo de las hojas de otoño entremezcladas en un árbol). Los esquemas de color análogos se encuentran a menudo en la naturaleza y típicamente tienen un efecto armonioso.

· Complementario: los colores complementarios aparecen uno frente al otro en la rueda de colores, creando un esquema de alto contraste, vibrante y que atrae la atención cuando se usan juntos. Utilízalos con moderación para enfatizar los detalles que deseas resaltar (botones de llamada a la acción).

· Tríada: los esquemas de color de la tríada utilizan colores que están espaciados uniformemente en una rueda de colores, como los puntos de un triángulo. Púrpura, verde y naranja es un ejemplo clásico de un esquema de tríada, que se aplica mejor cuando un color domina y los otros dos se usan como acentos.

La elección de un esquema de color puede resultar abrumadora, especialmente cuando se profundiza en combinaciones más complejas como los esquemas divididos complementarios y tetrádicos, por lo que quizás lo más fácil de tener en cuenta al comenzar es que algunos de los esquemas de color más agradables y efectivos visualmente lo hacen simple.

Considera los tonos y matices al elegir colores que complementen

Ahora que has elegido tu color primario y que tiene un concepto de esquema de color básico, es importante comprender y considerar otros factores. Afina tus combinaciones de colores jugando con tintes, tonos y sombras.


· Tintes
: los tonos se crean cuando se agrega blanco a cualquier tono en la rueda de color para aclarar, desaturar y disminuir la intensidad del color.

· Tonos: los tonos son el área gris, por así decirlo, entre los tonos y las sombras. Los tonos se crean agregando blanco y negro al tono original para oscurecerlo o aclararlo y para disminuir la saturación del tono original.

· Sombras: las sombras se crean agregando negro a un tono, lo que resulta en un color más rico, más oscuro y más intenso.

Ten en cuenta que las combinaciones de colores discordantes pueden tener un efecto agotador en los ojos. Considera un esquema con texto naranja brillante sobre un fondo azul brillante, por ejemplo: aunque los colores crean un alto contraste, son una apariencia literal. Sin embargo, los ajustes de tinte y tono igualan los valores de color, lo que resulta en un esquema de oro en la marina visualmente agradable y fácil de leer.

Haz que los colores se vean donde más importa para las conversiones

Dado que el 90 por ciento de las decisiones de compra de una fracción de segundo se reducen al color, no se puede subrayar lo suficiente el papel vital que desempeñan los tonos que tú eliges en la conversión del sitio web.

GUIONET.com sabe unas cuantas cosas sobre el diseño de landing pages que convierten. La difusión en redes sociales, el alojamiento web confiable y la optimización SEO juegan un papel en la canalización de los clientes a tu tienda o blog, pero algo tan simple como un botón de llamada a la acción vibrante que llame la atención o espacios en blanco bien colocados pueden hacer maravillas.

Las mejores páginas de destino no están abigarradas. Son simples, directas y están basadas ​​en buenos principios de diseño. Aplica tu nuevo conocimiento de la teoría del color al considerar estos factores y consejos de diseño de la página de destino:

· ¿Se destaca tu titular? Sé consciente de los colores de fondo y nunca dejes que tu combinación de colores oculte tu mensaje.

· ¿Es el cuerpo de tu texto legible? ¡No tengas miedo al negro básico sobre blanco! No solo es la combinación de color más fácil de leer, sino que también crea una sensación limpia y minimalista en casi todos los contextos.

· ¿Es tu llamada a la acción audaz y atractiva? Si tienes una llamada a la acción en la que se puede hacer clic, ella es la diva que exige atención. Aquí es donde querrás hacer resaltar tus colores contrastantes.

Desata a tu gurú del diseño con herramientas de diseño

Quizás a estas alturas, estás pensando que esta lección sobre historia del arte y teoría del color ha sido encantadora, pero ¿quién tiene el tiempo o la paciencia para pasar horas modificando el esquema de colores de un sitio web?

Afortunadamente, abundan las herramientas que ayudan a combinar y crear una paleta de colores para tus caprichos y deseos. Adobe Color es uno de nuestros favoritos, mientras que Color Code ofrece una experiencia basada en el cursor que permite a los usuarios volar a través de las opciones de color. Además, los códigos hexadecimales están fácilmente disponibles.

Para aquellos que desean un nuevo esquema de color extraordinariamente fácil de implementar, usar las plantillas de un CMS es una excelente manera de eliminar el estrés de diseñar y crear una página. Es ese amigo en el que puedes confiar para pintar tu sala de estar sin gotear pintura en los zócalos o dejar manchas accidentales en los bordes del techo.

También es la mejor manera de mantener las cosas simples. Imagina que tienes un buen hosting administrado (recuerda que ese es tu equipo de contratistas robustos que trabajan las 24 horas del día para garantizar que las paredes, las tuberías y el cableado eléctrico sean sólidos) junto con un creador de sitios web, como WordPress, Prestashop, etc…; éste será tu propio diseñador de interiores personal que está equipado con una herramienta útil, habilidades de carpintería, y todos los pinceles necesarios.

Con un nuestros CMS personalizables, nadie tiene que ser un experto en diseño gráfico o un genio de la codificación para crear sitios web hermosos. Incluso los más indecisos pueden comenzar con un tema creado por profesionales, y luego personalizar elementos como los colores y las fuentes para alinearlos con la historia que queremos contar.

Acerca de nosotros y este blog

Somos una agencia de marketing digital con más de 20 años de experiencia ofreciendo soluciones estratégicas efectivas para crear y promover tu negocio online. 

Solicita un informe gratuito

Ofrecemos servicios profesionales de diseño web, programación de aplicaciones móviles y marketing online que ayudan a los negocios online a aumentar drásticamente sus ingresos.

Suscríbete a nuestra newsletter!

Más de nuestro blog

Ver todos los posts