Diseño web y colores: De lo hortera a lo sublime

Enfrentarse al diseño de una página web desde un lienzo en blanco no es una tarea sencilla ni popular hay muchos factores que influyen en la calidad y resultado final en un diseño web. Reconozcámoslo, aunque tampoco es algo reservado solo para seres de luz o gente tocada por los dioses, la importante tarea artístico-técnica de elegir bien los colores y combinarlos adecuadamente para presentarlos en una pantalla generando la interfaz de una página web de calidad, hoy en día es un arte que no está al alcance de cualquiera. Hay que trabajar a fondo la sensibilidad y el gusto estético, pero también la técnica, psicología y comunicación visual.

En diseño web, la fase de elegir colores es primordial y muy influyente en el resultado final.

Mucha gente de dudoso gusto usa los colores a tutiplén sin ningún criterio objetivo ni estético, o de forma obtusa usan los colores que les gustan a ellos, rascando la barriga de su ego más estúpido.

En la actualidad, las modernas herramientas técnicas en informática y web han posibilitado la utilización fiel de una gama cromática increíble, pero aún siguen viéndose chapuzas de diseño web y ensaladas de colores que hacen un daño irreparable a la vista. No se trata solo de elegir los colores, o copiarselos a otros, es el uso que se les da una parte importante en la belleza de un diseñar una página web.

Ahí van algunos consejos sobre el color aplicado al diseño web, para evitar que vuestra creación web no sea una cutrez de planta de reciclaje.

 

Errores de bulto

1. Escoger los colores al buen tuntún siguiendo manías personales o recomendaciones del cuñado de turno.
2. Usar miles de colores en un batiburrillo sin orden ni concierto. Con tres ya iríamos bien servidos.
3. Combinar colores con los ojos cerrados no ateniéndose a ninguna regla o excepción.

 

Modos de color 

Los modos de colores son estándares de cobertura internacional. Si los conoces te servirá para elegir bien tus colores y saber qué tipo de color tienes que elegir. Ten siempre en cuenta que no es lo mismo un color de luz emitida que un color de luz reflejada, piénsalo.

• CMYK. Para usar con tintas en reveladoras de fotos, impresoras y linotipias. Se compone de cuatro colores básicos: cyan, magenta, marillo negro. El blanco sería la suma de todos los colores. Las mezclas resultantes se consiguen mediante la suma en porcentaje de los colores puros.
• RGB (RGBA). Para usar con luz en móviles, monitores de televisión, pantallas de ordenador, cámaras de vídeo y proyectores de cine. Sus colores básicos son el azul, el rojo y el verde. El color negro es la ausencia total de luz. La intensidad lumínica se mide en valores que van del 0 al 225. Sustrayendo valor de la cantidad máxima de cada color básico se obtiene el resto de la gama RGB.
• HEX o hexadecimal. Es una variante del sistema RGB y su código identificador de colores se registra mediante números y letras. Es el modo más utilizado en el diseño de páginas web.
• Otros modos alternativos: LAB y HSB.

Temperatura de color

• Gama cálida. Desde el magenta al amarillo tirando a verde. Llaman la atención del espectador. No te pases en exceso con ellos.
• Gama fría. Del azul al morado. Son colores sobrios, serios, respetables, abrumadores, definitivos. También pueden transmitir tranquilidad, serenidad y sosiego.

 

Círculo cromático y web

El círculo cromático es muy importante, no solo para colores impresión, sino para la web, ya que es basico. Muestra gráficamente cómo se llevan entre sí los diferentes colores, que pueden clasificarse de la siguiente manera:

• Primarios. Amarillo, azul y rojo.
• Secundarios. Morado, naranja y verde. Se llega a ellos por combinación de los primarios a partes iguales.
• Terciarios. Son el resultado de la mezcla de primarios y secundarios en porciones idénticas.
• Complementarios. Ocupan posiciones opuestas en la rueda o círculo cromático.
• Análogos. Son amigos y están colocados correlativamente en la rueda de colores.

 

Los colores tiene mucha vida interior

En efecto, los colores provocan sensaciones psicológicas de mucha complejidad. Exacerban emociones, acunan sentimientos, nos llevan a estados de ánimo muy diversos, están implícitos en nuestras opiniones, nos obligan sutilmente a tomar decisiones, emergen ocultos en el interior de actitudes ante la vida y nos llevan a la acción de mil maneras sibilinas. Cada color tiene su propia psicología, tanto en su vertiente positiva como en sus implicaciones negativas.

• Amarillo. Se asocia con conceptos tales como optimismo, felicidad o vulgaridad. Pronto satura la vista, pero sirve muy bien para dar toques de atención efectivos.
• Azul. Transmite ideas de calidad, fuerza, seguridad y eficacia. Puede funcionar en webs de servicios públicos, multinacionales, empresa tecnológicas y ciencia en general.
• Blanco. Se asocia con la paz, la pureza, lo saludable y la limpieza. Es un color comodín que viene bien para casi todo.
• Marrón. Nos traslada ideas de naturaleza y confianza. Peca de cierta sosería. Es un color apropiado para webs de alimentos naturales o ecológicos.
• Morado. Se asocia a creatividad, autoridad, poder, misterio y feminismo. Un tanto triste o aburrido. Sería adecuado para websites de belleza y terapias alternativas.
• Naranja. Color muy versátil y flexible que nos transmite ideas-fuerza de éxito, diversión y entusiasmo ilimitado.
• Negro. Puede vincularse a elegancia, estilo, formalidad, clasicismo, lo prohibido y la muerte. Mejor recurrir a él de vez en cuando y con mucha cautela y moderación.
• Rojo. Nos remite a conceptos extremadamente fuertes y robustos, de una pieza: amor, pasión, peligro y violencia. Es una llamada a la guerra. Conecta bien con gimnasios y negocios de comida rápida y muy mal con los sectores de la ecología y de la salud.
• Rosa. Es el color ideal de la inocencia y el romanticismo. Indicado para webs de eventos, bodas, bautizos y productos infantiles.
• Verde. El color preferido del medio ambiente. Hace buenas migas con la paz, el dinero, la espontaneidad y el bienestar. Tiene efectos relajantes. Liga de lujo con negocios sanitarios y productos del sector salud. Evitarlo en sitios web que vendan servicios o productos de lujo.

 

Consejos finales de diseño web y colores

• Recuerda siempre que una página web de empresa debe supeditar sus colores al logotipo de la empresa, esos son los colores máximos a respetar en tu diseño web, es el logotipo el que impone el branding no la página web.
• Herramientas que te pueden ayudar una barbaridad: Adobe Color CC, Photoshop, Acrobat, Illustrator, Htmlcolorcodes, Colourco.de, Colorhunt y Design-seeds.
• Inspírate en la paleta de colores de las grandes obras pictóricas de todos los tiempos o en fotografías de gran calidad. Un truco muy habitual es buscar fotografías de la temática y ver cuál es el color dominante en un producto o sector, de esa forma podrás decidir si entrar en ellos o alejarte de los colores estándares aburridos de un sector para resaltar tu marca.
• Busca la armonía: que los colores hagan amistad natural entre ellos. Si dos colores se enfrentan tienes un problema, a no ser que sea algo dirigido artísticamente para comunicar confrontación disgregación, pero eso son técnicas más complicadas que no deberías explorar sin conocimientos.
• Selecciona tres colores, uno primario, otro secundario y el tercero para llamar la atención en tu web sobre algo muy importante y concreto, los olores no solo embellecen, también comunican.
• Responde con sinceridad a esta sencilla pregunta: ¿qué deseas transmitir con tu web? La respuesta “te dirá” los colores a elegir.
• Intenta no ser «políticamente aburrido», un poco de riesgo a veces es bueno, pero riesgo medido, no podemos tirar una campaña o una imagen de marca por poner un color totalmente contraproducente, recuerda siempre que la barrera entre algo con un color estéticamente agradable y algo cutre es muy sutil.
• «Soy un negado», si lo has intentado y no puedes, como siempre en todo esto, recuerda, ganarás mucho más dinero si delegas en gente profesional, el tiempo que gastarás para conseguir un resultado patético te cuesta dinero y te hace perder la oportunidad de haber invertido ese tiempo en otras cosas que te retornen la inversión, si no eres capaz delega en profesionales, no dudes ni un segundo, tu salud, vida y tiempo agradecerán que sepas y decidas delegar lo imposible o hipercomplejo para ti.

 

Ya hemos alcanzado la meta que nos habíamos propuesto al iniciar el presente texto sobre colores en diseño web. ¿Has visto la enorme importancia de elegir bien los colores de tu web?

¿Aún tienes preguntas que necesitan una rápida solución profesional?. Ponte en contacto con ideaWeb somos diseñadores web desde hace 20 años y seguro que podemos darte ayuda profesional con tu proyecto. Contáctanos y te contestamos siempre.