Blog de E-Commerce

Cómo crear una combinación de colores para páginas web profesionales

Cómo crear una combinación de colores para páginas web profesionales

Elegir los colores que darán color a tu tienda online puede parecer fácil, pero hay que pensar que estos necesitan transmitir un impacto positivo al usuario. Los colores deben ayudar a comunicar el mensaje de tu empresa, de tus productos o de tus servicios, por lo que elegir entre unos colores u otros pueden influir de diferentes formas en los usuarios.

Muchos de nuestros clientes, cuando contratan el servicio de Diseño de plantilla personalizada o el servicio de Puesta en Marcha no tienen colores corporativos, por lo que el equipo de diseño hace un estudio de los productos que quiere vender, así como lo que transmiten y un análisis de la competencia y los colores que emplean. También tienen muy en cuenta las páginas de referencia que nos dan los clientes, ya que si a ellos les ha transmitido sensaciones, entendemos que es por algo.

Si quieres saber qué debes tener en cuenta y algunas de las herramientas que puedes emplear para crear tu paleta de colores corporativos, en este post te contamos todo lo que debes tener en cuenta.

¿Por qué es importante escoger una buena paleta de colores?

Tal y como hemos comentado antes, los colores son los que transmitirán una sensación al usuario, siendo positiva o peor, muy negativa. Un buen empleo de los colores facilita la conversión en tu tienda online (CTAs y botones principalmente) y ayudan a establecer la forma en que tus clientes se mueven por tu página ya que favorecen el énfasis.

Debes ser consciente de que un 80% del reconocimiento efectivo de tu marca tiene que ver con el color. Y como prueba, aquí va un ejemplo.

Si te digo empresas y marcas como Coca-Cola, Plátano de Canarias, Starbucks, Movistar… ¿Con qué colores los asocias?

Trucos, cosas a tener en cuenta al elegir los colores:

Antes de ponerte a elegir los colores para tu tienda online o tu página web, debes seguir una serie de puntos a tener en cuenta:

1. Si ya tienes colores corporativos porque ya tienes creado el logotipo o el manual de identidad de marca, debes ser consecuente y fiel con tus colores corporativos.

2. No por emplear colores muy brillantes y llamativos vas a llamar la atención del usuario. Las personas nos cansamos de ver muchos colores saturados, por lo que si empleas una paleta de ese tipo, puede hacer que el usuario se canse de tanto color y abandone tu tienda online o web en tiempo récord.

3. No tengas miedo a los espacios en blanco, son necesarios para dar aire a los diseños. Hay webs que están llenas de imagen, texto, banners con colores llamativos… eso produce sensación de agobio, debemos evitar esto, recuerda, menos es más.

4. Puedes crear una paleta básica. Es decir, de dos colores o tres colores que sean monocromáticos. De esta forma puede diseñar todo lo necesario en base a un color y sus diferentes tonalidades.

5. Debes tener muy presente qué quieres transmitir, no te guíes por tus colores favoritos.

Y para ayudarte en su elección, te describimos los aspectos positivos y negativos de los colores principales.

Amarillo:

  • Aspectos positivos: Representación del sol, optimismo, lealtad, seguridad, estabilidad, entusiasmo, confianza, autoestima, extroversión, originalidad, amigable, creatividad, sabiduría y lógica.
  • Aspectos negativos: Pensamientos críticos, miedo, fragilidad emocional, impulsividad, ansiedad, cobardía y falta de compasión.

Al ser un color tan brillante, es recomendable no utilizar tipografías con color amarillo sobre fondo blanco para permitir la correcta lectura del texto

Azul:

  • Aspectos positivos: Tranquilidad, soledad, autoridad.
  • Aspectos negativos: Demasiado conservador, predecible, frialdad y debilidad.

Blanco:

  • Aspectos positivos: Neutral, limpio, claridad, pureza, simplicidad e inocencia.
  • Aspectos negativos: Soledad, vacío e indeciso.

Naranja:

  • Aspectos positivos: Sociable, optimista, determinación, confianza en si mismo y extrovertido.
  • Aspectos negativos: Superficial, poco sincero, barato y pesimista.
Por ejemplo, el banco ING. Es un banco online que se caracteriza por no tener comisiones y que se asocia a su color naranja

Negro:

  • Aspectos positivos: Elegancia, poder, sofisticado, misterioso y formal.
  • Aspectos negativos: Melancolía, duelo, violencia, maldad, negatividad y egoísmo.
Si empleas en exceso este color conseguirás un efecto intimidatorio y distante. Por esto mismo te aconsejamos usar este color en pequeños detalles para conseguir transmitir paz y sencillez.

Rojo:

  • Aspectos positivos: Acción, energía, velocidad, atracción y poder.
  • Aspectos negativos: Agresivo, dominante, enfadado, miedo, intolerante.

Este color se utiliza mucho para llamar la atención del usuario en los sitios web, sobretodo en botones, ya que crea sensación de urgencia.

Verde:

  • Aspectos positivos: Vitalidad, renovación, confianza, naturaleza y esperanza.
  • Aspectos negativos: Posesivo, materialista, indiferente, sin experiencia y desorientado.

En esta imagen te mostramos pares de colores que presentan la mejor visibilidad cuando son apreciados a distancia. Algunas de estas combinaciones pueden sonarte ya que se emplean por ejemplo, en señales de tráfico.

combinaciones de colores web

Herramientas para crear tu paleta de colores

Existen multitud de herramientas online con las que puedes llegar a conseguir una paleta de colores adecuada para tu página web o tienda online.

A continuación os las detallamos para que puedas emplear la que más te facilite la elección de los colores.

Adobe Color

Con Adobe Color puedes crear gamas de colores interesantes. Para poder sacar el máximo partido a la herramienta, sería conveniente tener más o menos una gama de color definida.

Para buscar la gama de color se puede emplear unas reglas de color, es decir, unas reglas que aseguran un equilibrio armónico de colores basado en el color que hayas definido como color base. Estas reglas son: colores análogos, monocromáticos, tríada, complementarios, compuestos, tonos y uno totalmente personalizado, para que el usuario pueda elegir los colores libremente.

Además de esto, existe un apartado para poder ver las paletas de color que han creado otros usuarios.

combinaciones de colores web

Coolors

Coolors es una herramienta muy útil para crear paletas de hasta cinco colores. También te permite ver paletas creadas por otros usuarios desde la pestaña “Explore”.

Para empezar con la selección de colores deberás estar en la pestaña “Generete” y dando a la barra espaciadora del teclado verás que los colores irán cambiando. En el momento que te guste uno podrás bloquearlo, buscar alternativas de tono, realizar ajustes…

combinacion colores web

Paletton

Si es la primera vez que empleas este tipo de programas, Paletton es una herramienta que te puede resultar más complicada que el resto.

Se pueden ajustar los colores a emplear un único color, tres y cuatro colores con distintas configuraciones: monocromático, añadiendo colores complementarios, opción de personalización, etc.

Colormind

Colormind es la hermana gemela de Coolors. Puedes generar una paleta de colores haciendo clic en el botón “Generate”. Después puedes bloquear colores, ajustar niveles y moverlos de posición.

Como punto a favor y diferencial con otras herramientas, esta ofrece la posibilidad de subir una imagen para darte los valores de los cinco colores principales de dicha imagen.

como elegir colores para una pagina web

Conclusiones

Después de conocer porqué es importante elegir correctamente los colores corporativos de tu tienda online, no debes descuidar otros aspectos gráficos.

Con esto os queremos recordar que no debes abandonar la calidad de las imágenes. Cuando entras en una página web y las imágenes son demasiado pequeñas, están pixeladas, son oscuras… producen un gran rechazo al usuario.

También el no dotar de suficiente espacio entre los elementos que componen un diseño produce una sensación de agobio. Por esto mismo, deja espacios en blanco para que los diferentes elementos de tu sitio web puedan “respirar.

Una buena elección de la tipografía es importante. Si empleas dos o más tipografías, asegúrate que combinen de manera correcta.

Y recuerda, que los colores se ven de manera diferente en distintos monitores, es por ello que siempre debes intentar probar a visualizar tus diseños en diferentes dispositivos y monitores.

Ahora ya puedes ponerte manos a la obra y elegir la paleta de colores para tu sitio web, como sabes, tienes a tu disposición a nuestros diseñadores para ayudarte a conseguir un diseño más pulido y profesional adecuado a tus gustos.

DISEÑO PERSONALIZADO DE PLANTILLA

¿Quiéres mejorar tu negocio online?
x
Academia digital

Únete a nuestra Academia Digital y recibe los mejores trucos y consejos sobre Comercio Electrónico y Marketing Digital diréctamente en tu correo.

Recibirás un email para confirmar tu suscripción.

Deja un Comentario

Tu email no será publicado



©2019 Siokia SL | Palbin.com: Crea tu tienda en dos pasos, 1 y 2. Condiciones de uso y Política de privacidad

Agencia certificada de Google Partners
Certificado SSL Digicert
Usamos cookies de terceros para mejorar la experiencia de navegación, y obtener estadísticas anónimas. Si continúa navegando consideramos que acepta el uso de cookies. OK Más información