Gama cromática para diseñar sitios web

Gama cromática para diseñar sitios web

Siempre que en nuestra agencia de diseño y publicidad recibimos un briefing para realizar un diseño Web site hay muchos aspectos a considerar y la gama cromática es uno de los más relevantes. El color es una parte esencial de la experiencia del usuario UX y puede conducir a ambos – el éxito o el fracaso. Entonces como diseñador web, ¿Cómo elegir los colores de un sitio web y qué dice sobre tu empresa, productos y servicios?

 

Fondo vs color de texto
La primera decisión que hay que tomar está relacionada con un color de fondo. Esta opción afectará el resto del estilo, incluido el color del texto. Hay una regla simple: crear un fuerte contraste entre el fondo y el color del texto. Si se adhiere a un fondo claro, asegúrate de que su texto es oscuro. Debe ser legible para todos sus visitantes, incluyendo a personas con discapacidades.

La imagen de fondo es otra cosa a tener en cuenta – asegúrate de que su contenido es visible en la imagen de su elección. Recuerda elegir una imagen que pueda generar un gran contraste con la tipografía.

 

Paletas de color y teoría del color
¿Cuántos colores debo usar en mi sitio web? Depende. Sobre el estado de ánimo, el estilo y las preferencias de su público objetivo. Se recomiendan buenas prácticas de 3 a 5 colores. Esto es completamente suficiente para hacer hincapié en las partes importantes y evitar “efecto arco iris” que puede distraer a los visitantes.

Sin embargo, la cuestión sigue siendo cómo descubrir y combinar los colores correctos, ¿verdad? La teoría del color ofrece varios métodos que le ayudarán a elegir los colores que encajan. A continuación encontrará algunos de los métodos más populares para elegir:

 

Análogo

Un método simple que indica que debes elegir los colores que están cerca de uno otro (rosa, rojo, Borgoña). Esto ayudará a mantener el mismo estado de ánimo en todo el sitio web.

 

Monocromática

Elige un color y utilice el efecto de atenuación / oscurecimiento para crear su paleta de colores. Igual que el método análogo esto ayudará a entregar humor del Web site en una manera directa.

 

Tríada

Sen enfoca en 3 colores situados en las 3 partes opuestas del círculo de color. La tríada es un buen método para elegir si quieres tener un sitio web colorido o quieres crear una página de destino. Además, ayudará a evitar el “efecto arco iris” que mencionamos anteriormente.

 

Complementaria

Basada en Monocromática, Complementaria 2 colores opuestos de círculo de color y manipular con aclarar / oscurecer para construir la paleta de colores. Un buen método a considerar para las herramientas en línea, sitios web de comercio electrónico y plataformas.

Si bien todos estos métodos parecen diferentes, hay una cosa esencial. Todos ellos se basan en nuestras observaciones de la naturaleza. Una fuente poderosa de la inspiración en cómo combinar diversos colores y patrones. Sea cual sea el método que elijas, asegúrate de buscar en los colores naturales como se perciben mejor.

 

Asociación de Color
Tendemos a asociar colores con diferentes sentimientos. Los momentos de nuestra experiencia de vida, el entorno

 

Rojo: energía, pasión, excitación, poder; También implica agresión, peligro.
Azul: frialdad, espiritualidad, libertad, paciencia, lealtad, paz, confiabilidad; También puede implicar tristeza, depresión.
Amarillo: luz, optimismo, felicidad, brillo, alegría.
Verde: vida, naturalidad, reposo, salud, riqueza, prosperidad; En ciertos contextos, puede implicar decaimiento, toxicidad.
Naranja: simpatía, calidez, facilidad de acercamiento, energía, juguetón, coraje.
Violeta: sabiduría, sofisticación, celebración.
Blanco: pureza, limpieza, juventud, frescura, paz.
Negro: poder, elegancia, secreto, misterio.
Gris: seguridad, madurez, fiabilidad.
Rosa: romance un color femenino.
Marrón: comodidad, fuerza, estabilidad, credibilidad.
Página de aterrizaje vs plataformas
Con los colores sobre la mesa, es el momento de decidir si desea utilizar baja o alta saturación. Si no sabes lo que es saturación – es colorido o intensidad de color específico.

 

Los colores de alta saturación atraerán la atención y empujarán hacia la acción. Botones, ‘Call to Action’, Banners y otros elementos impulsados ​​por la acción probablemente usarán colores altamente saturados. La desventaja de la alta saturación es la distracción que puede causar por lo que asegúrese de comprobar una serie de elementos con alta saturación. Utilizamos colores altamente saturados para uno o dos elementos de la misma página para empujar al visitante hacia nuestras metas de página.

Los colores de alta saturación son buenos para elementos accionados en su sitio web, colores de baja saturación … HAGA CLIC A TWEET. Hay casos en los que es necesario evitar los colores altamente saturados, sin embargo. Herramientas en línea y SaaS es algo que usted quiere que su cliente pase la mayor parte del tiempo. Por lo tanto, asegúrese de que él / ella es cómodo y no distraído por la saturación innecesaria, sería una mejor opción elegir la saturación de baja para su interfaz de usuario. Esto no significa que usted debe saltar los colores de alta saturación, tal vez desee señalar alguna característica muy importante, que está bien. Sólo asegúrese de usarlos inteligentes.

 

 

Recursos de color
Incluso si conoces la teoría del color hay algunas herramientas que podrían hacer tu vida más fácil o servir como una inspiración para tu próximo sitio web.

Adobe Kuler – es uno de los sitios web de paleta de colores más populares para configurar su propia paleta de colores basada en los métodos de la teoría del color. Además, tiene una gran base de datos de usuario creado y clasificado paletas de colores que puede elegir. Las etiquetas y la estructura de contenido permiten encontrar sorprendentes paletas de color por nombre de color o incluso por estado de ánimo, como “relax” o “eco”.

Color Hailpixer – pequeño, pero muy fuente de inspiración que permitirá encontrar un color con un drag simplemente. Mueva el cursor del ratón alrededor de la ventana del navegador y vea diferentes colores sin ninguna interferencia desde el exterior. Además, verás un código de color para una referencia rápida.

Design Inspiration – un acercamiento interesante para encontrar no sólo colores del Web site pero también el humor. Asociar sus colores con el gráfico y ver cómo encajan juntos. Inspiración de diseño le ofrecerá hasta 6 colores basados ​​en su elección de imágenes.

 

 

Este sitio web utiliza Cookies para recopilar información estadística sobre su navegación. Si continuas utilizando este sitio aceptas el uso de nuestra política de cookies

Los ajustes de cookies de esta web están configurados para "permitir cookies" y así ofrecerte la mejor experiencia de navegación posible. Si sigues utilizando esta web sin cambiar tus ajustes de cookies o haces clic en "Aceptar" estarás dando tu consentimiento a esto.

Cerrar