Spur: testea tu diseño web

Spur lleva a cabo un análisis del diseño de nuestra web para repasar que está funcionando y que no lo hace.

Tras indicar la URL de nuestro website, Spur nos ofrece hasta siete herramientas que nos permiten analizar la página para averiguar entre otras posibilidades aquellas zonas donde nuestros usuarios centran su atención, donde está situado el contenido web más relevante, si el contraste es el adecuado, señalar zonas desalineadas, además de aspectos como el balance o la proximidad de los elementos que componen el diseño.

Esta sencilla y original herramienta es ofrecida de forma totalmente gratuita y sin necesidad de registro para todo aquel diseñador/webmaster que desee hacerlo.

Spur además de analizar el diseño de una página web también permite realizar un análisis de imágenes.

Interesados pueden acceder a Spur desde www.spurapp.com.
fuente.desarrolloweb

Ways to Increase Conversions by Reducing Friction

The basic problem we face when selling online is getting our prospects all the way from our headline to our call to action.

We know our copy has to include all the important information prospects want…and nothing more. And we know it must be presented with the clarity of a well-polished shop-window. But attention-spans online are short, prospects are unforgiving, and competition is typically more aggressive than a bull elephant with a trunk-full of bees. That conspires to make our lives rather hard.

So to help ease your burden, here are 10 practical steps you can take to make the trip from headline to CTA slipperier than a jaunt down a well-buttered fireman’s pole. These apply regardless of whether you’re trying to get more signups from your homepage, more people clicking through to view a demo, or even if you’re selling a top-tier product from a landing page…

Reducing Friction with Words

1. Only include sentences that will move your prospect forward

Very often, a webpage will compound one irrelevant sentence on top of another. The first slows the prospect a little because it doesn’t say anything he’s interested in. He tries to relate it to his problem, but the connection isn’t there.

The second drags him down to a snail’s pace. And when the third is equally uninteresting he’s outta there. “So what?” he asks as he gives up. “I tried reading it, but I just didn’t care.”

Thinking about this kind of reaction can help you a great deal. Sit down and read your copy, and after every sentence simply ask: so what?

If you can’t give a good answer immediately, get rid of that sentence. It doesn’t belong there. Any sentence that doesn’t convey value, or imply that the next sentence will, is only hindering your prospect’s journey down the page. Remove them, and you’ll find that what is left are sentence that move your prospect forward. Those are the ones that matter.

2. The “You Rule”

Your prospect is not interested in you. He is interested in himself and his problem.

This means that you don’t start your homepage copy by talking all about yourself—a fiendishly common problem, especially for freelancers.

Every single piece of copy above the fold on this website is about its owner, rather than his prospects and their problems.

Reducing Friction with Design

There’s no use making your copy friction-free if the design of your page actively prevents prospects from getting to the call to action—or even reading the headline in the first place!

There are 4 main ways design can generate friction. The bad news is your site is almost certainly guilty of them in one way or another, because there’s nary a site on the web that ain’t. The good news is that fixing these issues is pretty straight-forward if you’re actually willing to give it a try…

3. Fonts are all shot to hell

There is a huge problem with fonts on the web, and it completely destroys the readability of your text. Needless to say, if your prospect has trouble reading your copy, it doesn’t make the slightest difference how good it is.

This problem is that body copy is too small. Usability expert Jakob Nielsen conducted a survey into difficulties people have browsing the web, and discovered that bad fonts got nearly twice as many votes as the next contender—with two-thirds of voters complaining about small font sizes.

Since readership = revenue, the simple solution is to make your text big enough for your visitors to read easily.

How big? 16?px text on a screen is about the same size as text printed in a book or magazine. Therefore, anything smaller than 16px is probably too small.

4. Colors make readers’ eyes bleed

The color of your page is just as important as the size of your text. A dark background with light text is, depending on who you ask, between 50% and 200% less readable than a light background with dark text.

5. Eyepath is all over the place

People read left to right, top to bottom.

When we first arrive on a webpage, we fixate very briefly near the center of the page—about where we expect the headline to be—and then we move up to look at the top left, so as to get our bearings. From there on, we read in an F-shaped pattern, taking in most of the first line of body copy, then scanning down the left margin, skimming the first few words of each line as we go.

Except when we can’t.

If this natural eyepath is interrupted, we generally don’t get to the call to action. And webpages do this in so many different ways, with so many different kinds of elements all competing for attention:

  • Images
  • Twitter feeds
  • Opt-in forms
  • Advertisements
  • Sidebars
  • Aside text
  • Navigation
  • And so on

Now, many of these elements may be necessary to the objectives of a page. But remember that the primary objective is the call to action—so elements which are actively distracting readers from that objective need to be carefully evaluated.

That said, the main culprit in nearly all cases is images. Most images on most websites achieve nothing except to distract readers and increase friction. If your images are not clearly conveying value, and are not clearly relevant to your content, then you should get rid of them.

This may surprise you, because it’s commonly accepted wisdom that images increase readership. In fact, they do not in most cases. Before and after shots do. Graphs and charts do. Product action shots do. Hero shots do. And captions on images definitely do. But random stock photos slapped onto the page to create “visual interest” do not—and neither do any other images which your reader can’t quickly figure out.

6. The left margin keeps disappearing

Another common problem, related to eyepath, is that the left margin is inconsistent. Remember I said we scan down the page along the left margin? Yes, well how do you do that when the margin changes position? Left-floated images break the margin and force readers to readjust. Sometimes there is more than one left margin, because someone saw fit to place columns of text next to each other. That’s like having two or three people speaking to your prospect at once.

Increasing Momentum

Decreasing friction is an excellent start, but why not finish on a high note? What can we do to actually increase momentum?

Well, assuming you’ve generated it nicely to begin with by using a strong headline and lede—which have got your prospect interested and hungry to know more—here are four elements you should be using. I haven’t included example images here, since you can just look at how I’ve laid out this article.

7. Regular subheads

Since most web readers scan rather than reading every sentence, it’s imperative to give them little chunks of text that stand out and help them move down the page at a pace which suits them. Subheads should convey the main value proposition of the section they’re attached to—resist the urge to use cute or mysterious copy here. Your prospect should be able to get the gist of your page just from reading the subheads.

8. Bullets

These get higher readership than average. People appreciate the briefness and simplicity of bullets—and since they stand out visually, they’re a great place to reiterate or itemize key value propositions like features, benefits and proofs.

9. Alternating paragraph lengths

Making your page visually interesting is surprisingly helpful for increasing momentum. A series of paragraphs which are all the same length makes for a monotonous reading experience. Using a varied pattern makes your text more engaging.

It’s especially helpful to set key sentences apart as one-line paragraphs (bold face is also useful here).

10. Images with captions

Remember, I never said images are bad. I said most images on most websites are bad, because they don’t convey value and their visual dominance creates friction by distracting readers. But images which convey value, and especially images which convey value which is then summarized in a caption, can catapult readers down your page. Captions are read at least twice as much as body copy.

Your New Site Checklist

I’ve covered a lot of ground in this article, so let me quickly summarize all the main points I’ve talked about into a checklist you can use right now:

  1. Only include sentences that will move your prospect forward;
  2. Make sure you’re talking about your prospect, not about you;
  3. Check your font size—less than 16px is too small;
  4. Don’t use reversed text: dark and light is much more readable;
  5. Get rid of elements that distract from the natural F-shaped eyepath—especially images;
  6. Don’t let any element physically interrupt the left margin;
  7. Use regular subheads that summarize the value proposition of their sections;
  8. Itemize major value points using bullets;
  9. Create visual interest with alternating paragraph lengths;
  10. Use captioned images to convey value clearly.

Head on over to your website, check out how well it performs, and let us know your score in the comments.

original source.http://blog.kissmetrics.com/reducing-friction/

 

Errores comunes en el Diseño Web

Para aquellos que empiezan con sus primeros diseños web y aquellos que busquen mejorar sus proyectos con el objetivo de hacerlos destacar sobre el resto, Naldz Graphics ha reunido una colección que resultara de especial interés para repasar y evitar cometer algunos de los considerados como errores más comunes.

Errores comunes en el diseño Web:

  • Mensaje poco claro: consigue que tus usuarios sean capaces de captar el mensaje y propósito de tu site con tan solo un vistazo.
  • Uso inadecuado de colores: una incorrectacombinación de colores puede ofrecer una imagen poco profesional capaz de ahuyentar a un buen número de usuarios.
  • Contenidos ilegibles: evita usar fuentes tipográficas que no sean de lectura fácil. El tamaño y el color de la fuente son dos elementos a tener en cuenta.
  • Respeto al usuario: incluye un resumen de tu política de privacidad para favorecer la suscripción de usuarios y crea un sistema que permita darse de baja.
  • Incluye un buscador: haz que el acceso a contenidos en tu site sea más fácil a través de un buscador visible dentro de la portada de tu web.
  • Evita una navegación complicada: trata de no confundir a tus usuarios, es recomendable crear apartados identificables y espaciados, enlaces fáciles de encontrar y diferenciados del texto con el típico subrayado y/o color azul, así como evitar un diseño sobrecargado con excesiva cantidad de texto.
  • Cuidado con las introducciones: evita usar una introducción flash excesivamente larga, sin que esta ofrezca un botón para saltársela
  • Cuidado con la música de fondo: en muchos casos la solución rápida que toma un usuario que no encuentra de su agrado la música implementada en cerrar el site y buscar en otro lugar. Si estas decidido a usar música incluye la posibilidad de detenerla o enmudecerla.
  • Correcto formato de imagen: JPEG, PNG y GIF son los formatos estándar que evitan la mayor parte de los problemas de carga de imágenes. El uso de un tamaño optimizado de imágenes evita además un excesivo tiempo de carga.
  • Publicidad acertada: evita la confusión de tus contenidos con la publicidad de tu site, elige un lugar visible para colocar tus anuncios pero diferenciado del resto de la página.
  • Compatibilidad navegadores: asegúrate que tu website es compatible con los principales navegadores web. Especial mención merece Internet Explorer 6, con diferencia el navegador que más dolores de cabeza produce a diseñadores y desarrolladores web pero que sin embargo sigue siendo usado por cerca del9% de usuarios en todo el mundo.

Esta selección está abierta a la participación de todos aquellos que quieran contribuir con aquel/aquellos errores que consideren suelen cometerse con mayor frecuencia y resultan especialmente lesivos de un mejor diseño web afectando tanto a la calidad como a la cantidad de tráfico en nuestro site.

fuente.desarrolloweb

Cómo diseñar una portada que cautive a sus visitantes

Por poco que os mováis en Internet en los sitios de marketing y comercio, veréis que los aspectos de promoción y publicidad de webs son profundamente tratados en todas partes. Sin embargo, no hay mucho sobre un tema que es clave para el éxito de todo sitio: las portadas. Aquí le contamos que debe tener en cuenta para diseñar una “home page” cautivadora.

Efectivamente, no sirve de nada invertir en promoción para atraer a muchos internautas a nuestras páginas si, en el momento en que se acerquen, pasan breves instantes ojeando la portada de nuestro sitio web y, seguidamente, se van hacia otros lugares.

¿Cómo los captamos? ¿Cómo los retenemos? ¿Cómo conseguimos que se queden el tiempo suficiente para conocer nuestra oferta y permitirnos iniciar con ellos una relación con visos de continuidad?

Antes, intentemos definir cuáles son los objetivos a cubrir por nuestro sitio web.

1. “Enganchar” los contactos que se acercan a visitarnos por primera vez
2. Conseguir que nos cedan su dirección de correo-e junto a la autorización para mandarles información periódicamente
3. Interesar permanentemente también a los visitantes “repetidores”

Estos deberían ser los objetivos prioritarios de nuestro sitio. Si los alcanzamos, ya dispondremos de la base para la continuación del proceso de la venta. Podremos entonces establecer relaciones permanentes con nuestros clientes, ganarnos su confianza, generar ventas y ventas repetitivas.

Pero ¿se ha planteado cómo alcanzar estos objetivos?

Será fundamental que nuestra página de portada cumpla una serie de requisitos. De ello se derivarán consecuencias también para la estructura del conjunto de nuestro sitio web.

Pero veamos ahora, qué va a necesitar nuestra portada para cumplir los objetivos: diseñar la portada pensando en el cliente. ¿Qué le gustaría encontrar a nuestro cliente? ¿Cómo podemos facilitarle la vida? ¿Cómo podemos servirle mejor?

El sitio web no es para nosotros ni para nuestra empresa ni para nuestro consejero delegado. El sitio web es para nuestros clientes.

Y lo mejor es pensar en lo que hacemos cada uno de nosotros al entrar a un sitio web que visitamos por primera vez. Lo que yo hago es sobrevolar con la vista el conjunto de la página a la caza de esa palabra o ese detalle que capta mi atención. Desde luego, en el primer vistazo no suelo dedicarme a leer grandes párrafos. Mi interés ha de ser captado de alguna otra forma, de una forma rápida, al vuelo.

El visitante debe encontrar en la portada los siguientes elementos:

1) Debe poder identificar qué es lo que proporciona el sitio web a sus visitantes. Es decir, “para qué le sirve a él ese sitio web”.

2) Los visitantes noveles deben encontrar “al vuelo” esos ganchos que les harán decidir adentrarse en el sitio.

3) Debe existir también una forma de acceso rápida y directa a las distintas secciones para el visitante habitual que ya sabe lo que va a buscar.

4) Debe disponer de alguna (o varias) forma de obtener la dirección de correo-e de cada visitante que entra. Para ello, la herramienta ideal es un boletín periódico. Les ofrecemos la suscripción gratuita. Para mandárselo, obviamente, necesitamos su dirección.

Otras opciones son el suministro de un informe concreto, el rellenar una encuesta, a cambio de lo cual, participarán en un sorteo o recibirán un determinado servicio durante 3 meses (de paso, les hacemos conocer el servicio y, si les gusta, ya se suscribirán al cabo de los tres meses)

5) Por último, la cantidad de información debe ser la justa. Ni poca, ni mucha. Ni tan poca que resulte insustancial, los clientes no harán el esfuerzo de entrar a otra página sin saber lo que van a encontrar. Ni tanta que la página resulte sobrecargada con múltiples textos de letra menuda. Esa sobrecarga de información tiene como principal efecto el enmascarar la información importante, ésa que es capaz de captar la atención del cliente.

¡Bien, pero basta ya de generalidades! ¡Vayamos al grano!

Qué tiene que hacer para diseñar una portada. Esta es una guía que os permitirá diseñar páginas completamente personalizadas para cada caso, que a la vez cumple con los requisitos exigidos para un buen marketing.

La página de portada, como hemos comentado, debe ser útil a visitantes noveles y repetidores. A los primeros, debe captarlos. A los segundos, llevarles lo más rápidamente posible a la sección a la que se dirigen. Pongamos, pues, dos formas distintas de salir de ella para penetrar en el sitio web por dos vías distintas.

La entrada de los repetidores……

Consiste en situar un menú de secciones y sub-secciones, probablemente en un lateral, para que cada uno pinche la sección que le interese para acceder a ella directamente. Muy bien. Claro y sencillo.

…..y la de los nuevos contactos

La otra forma de entrar hacia el sitio desde la portada es “poniendo un espejo que les devuelva su propia imagen”. ¡Eso es! Si el visitante se ve retratado en la página pensará “¡ése soy yo! Aquí hablan de mí y de lo que yo busco. Éste es el sitio que yo buscaba”.

¿Queréis un ejemplo? Imaginemos una tienda virtual de ciclismo. Podríamos identificar varios tipos de clientes potenciales: el profesional, el aficionado y el cicloturista, que sólo quiere una bicicleta de montaña para salir de vez en cuando con sus amigos.

Lo que yo propongo es presentar una llamada explícita a cada uno de ellos en nuestra portada. Para el tercer cliente pondríamos, por ejemplo, “¿Te gusta el cicloturismo? Haz click aquí y pasa a nuestro ciclomundo (o bien “encuentra todo lo que necesitas” o bien “Tenemos unas páginas que te encantarán”)”. Difícilmente, un visitante que responda a ese perfil dejará de entrar.

Bien, ya tenemos nuestra portada con la doble vía de salida. También disponemos de todas las páginas de contenidos (artículos, catálogo, página de pedidos, enlaces, foros, etc.) Bien, pero, como consecuencia de la portada que hemos creado, nos falta algo. Debemos crear un nuevo nivel de páginas.

En efecto, volviendo a nuestro ejemplo, una vez que el clicloturista ha pulsado el botón que le pedíamos debe entrar a una página íntegramente dedicada a él, a los cicloturistas.

En esa página debemos presentarle todas las opciones, productos y servicios que va a encontrar para él a continuación. Por ejemplo, un sitio como ese debería ofrecer el catálogo de bicicletas y accesorios, pero también información de rutas cicloturistas, un foro de contactos para intercambio de materiales usados, un tablero de anuncios para la organización de excursiones conjuntas, etc.

Por lo tanto, en esa página, que llamo de orientación, se trata de contarle a nuestro nuevo visitante cicloturista todas las secciones de que dispone en nuestro sitio y qué le ofrece cada una de ellas. Desde esa página, nuestro cicloturista podrá acceder directamente a cada una de las secciones que le ofrecemos.

Cuando ese mismo cicloturista regrese a visitarnos, probablemente ya accederá directamente a la sección que busque desde el menú de la portada. Claro, ahora ya es un visitante repetitivo.

La aplicación de este modelo os puede servir, no sólo para mejorar sustancialmente los resultados de vuestro sitio web, sino que tendrá el efecto de cambiar la forma que teníais de concebirlo. El sólo hecho de intentar aplicar este modelo, os obligará a pensar en los tipos de clientes que tenéis, o queréis tener, en los contenidos que podéis ofrecer a cada uno de ellos y, en definitiva, os ayudará a replantear desde una óptica más adecuada al medio Internet, toda vuestra presencia en la red.

Teoria del Color en la Web, significado de los colores

ignificado de los colores Web Contenido:

  1. Introducción
  2. El significado de los colores
    1. Blanco
    2. Amarillo
    3. Naranja
    4. Rojo
    5. Púrpura
    6. Azul
    7. Verde
    8. Negro
  3. Tabla de propiedades de los colores
  4. Tabla de sensaciones
  1. Introducción:Círculo Estándar de Color El color es una parte del espectro lumínico, y, al fin, es energía vibratoria.

    Esta energía afecta de diferente forma al ser humano, dependiendo de su longitud de onda (del color en concreto) produciendo diferentes sensaciones de las que normalmente no somos conscientes.

    Pero la gente que trabaja en agencias de marketing y publicidad, los asesores de imagen de empresa, los diseñadores industriales y de moda, etc., son bien conscientes de ello, y utilizan los colores para asociarlos coherentemente al tipo de producto que quieren hacer llegar.

    La cosa, como no podría ser de otra forma, funciona. Desde hace años se han hecho todo tipo de pruebas para analizar las sensaciones que sugieren los colores y hay bastante bibliografía al respecto.

    ¿Y qué es un sitio web si no un escaparate personal, de empresa, de comunidad, etc.? Además de muchas otras funciones que cada sitio pueda tener, ante todo intenta comunicar y lo hace con palabras, con imágenes y, en primera instancia, con colores.

    Cuando un sitio web está diseñado por profesionales con sólidos conocimientos de diseño gráfico, normalmente las pautas seguidas con los colores no son aleatorias.

    Vamos a mostrar a continuación las propiedades de los colores básicos generalmente aceptadas. Puede haber discrepancias según autores, pero en lo fundamental, prácticamente todos están de acuerdo.

  2. El significado de los colores:

    Blanco:
    • El blanco se asocia a la luz, la bondad, la inocencia, la pureza y la virginidad. Se le considera el color de la perfección.
    • El blanco significa seguridad, pureza y limpieza. A diferencia del negro, el blanco por lo general tiene una connotación positiva. Puede representar un inicio afortunado.
    • En heráldica, el blanco representa fe y pureza.
    • En publicidad, al blanco se le asocia con la frescura y la limpieza porque es el color de nieve. En la promoción de productos de alta tecnología, el blanco puede utilizarse para comunicar simplicidad.
    • Es un color apropiado para organizaciones caritativas. Por asociación indirecta, a los ángeles se les suele representar como imágenes vestidas con ropas blancas.
    • El blanco se le asocia con hospitales, médicos y esterilidad. Puede usarse por tanto para sugerir para anunciar productos médicos o que estén directamente relacionados con la salud.
    • A menudo se asocia a con la pérdida de peso, productos bajos en calorías y los productos lácteos.
    Amarillo:
    • El amarillo simboliza la luz del sol. Representa la alegría, la felicidad, la inteligencia y la energía.
    • El amarillo sugiere el efecto de entrar en calor, provoca alegría, estimula la actividad mental y genera energía muscular. Con frecuencia se le asocia a la comida.
    • El amarillo puro y brillante es un reclamo de atención, por lo que es frecuente que los taxis sean de este color en algunas ciudades. En exceso, puede tener un efecto perturbador, inquietante. Es conocido que los bebés lloran más en habitaciones amarillas.
    • Cuando se sitúan varios colores en contraposición al negro, el amarillo es en el que primero se fija la atención. Por eso, la combinación amarillo y negro es usada para resaltar avisos o reclamos de atención.
    • En heráldica el amarillo representa honor y lealtad.
    • En los últimos tiempos al amarillo también se le asocia con la cobardía.
    • Es recomendable utilizar amarillo para provocar sensaciones agradables, alegres. Es muy adecuado para promocionar productos para los niños y para el ocio.
    • Por su eficacia para atraer la atención, es muy útil para destacar los aspectos más importantes de una página web.
    • Los hombres normalmente encuentran el amarillo como muy desenfadado, por lo que no es muy recomendable para promocionar productos caros, prestigiosos o específicos para hombres. Ningún hombre de negocios compraría un reloj caro con correa amarilla.
    • El amarillo es un color espontáneo, variable, por lo que no es adecuado para sugerir seguridad o estabilidad.
    • El amarillo claro tiende a diluirse en el blanco, por lo que suele ser conveniente utilizar algún borde o motivo oscuro para resaltarlo. Sin embargo, no es recomendable utilizar una sombra porque lo hacen poco atrayente, pierden la alegría y lo convierten en sórdido.
    • El amarillo pálido es lúgubre y representa precaución, deterioro, enfermedad y envidia o celos.
    • EL amarillo claro representa inteligencia, originalidad y alegría.
    Naranja:
    • El naranja combina la energía del rojo con la felicidad del amarillo. Se le asocia a la alegría, el sol brillante y el trópico.
    • Representa el entusiasmo, la felicidad, la atracción, la creatividad, la determinación, el éxito, el ánimo y el estímulo.
    • Es un color muy caliente, por lo que produce sensación de calor. Sin embargo, el naranja no es un color agresivo como el rojo.
    • La visión del color naranja produce la sensación de mayor aporte de oxígeno al cerebro, produciendo un efecto vigorizante y de estimulación de la actividad mental.
    • Es un color que encaja muy bien con la gente joven, por lo que es muy recomendable para comunicar con ellos.
    • Color cítrico, se asocia a la alimentación sana y al estímulo del apetito. Es muy adecuado para promocionar productos alimenticios y juguetes
    • Es el color de la caída de la hoja y de la cosecha.
    • En heráldica el naranja representa la fortaleza y la resistencia.
    • El color naranja tiene una visibilidad muy alta, por lo que es muy útil para captar atención y subrayar los aspectos más destacables de una página web.
    • El naranja combina la energía del rojo con la felicidad del amarillo. Se le asocia a la alegría, el sol brillante y el trópico.
    • El naranja oscuro puede sugerir engaño y desconfianza.
    • El naranja rojizo evoca deseo, pasión sexual , placer, dominio, deseo de acción y agresividad
    • El dorado produce sensación de prestigio. El dorado significa sabiduría, claridad de ideas, y riqueza. Con frecuencia el dorado representa alta calidad.
    Rojo:
    • El color rojo es el del fuego y el de la sangre, por lo que se le asocia al peligro, la guerra, la energía, la fortaleza, la determinación, así como a la pasión, al deseo y al amor.
    • Es un color muy intenso a nivel emocional. Mejora el metabolismo humano, aumenta el ritmo respiratorio y eleva la presión sanguínea.
    • Tiene una visibilidad muy alta, por lo que se suele utilizar en avisos importantes, prohibiciones y llamadas de precaución.
    • Trae el texto o las imágenes con este color a primer plano resaltándolas sobre el resto de colores. Es muy recomendable para encaminar a las personas a tomar decisiones rápidas durante su estancia en un sitio web.
    • En publicidad se utiliza el rojo para provocar sentimientos eróticos. Símbolos como labios o uñas rojos, zapatos, vestidos, etc., son arquetipos en la comunicación visual sugerente.
    • El rojo es el color para indicar peligro por antonomasia.
    • Como está muy relacionado con la energía, es muy adecuado para anunciar coches motos, bebidas energéticas, juegos, deportes y actividades de riesgo.
    • En heráldica el rojo simboliza valor y coraje. Es un color muy utilizado en las banderas de muchos países.
    • El rojo claro simboliza alegría, sensualidad, pasión, amor y sensibilidad.
    • El rosa evoca romance, amor y amistad. Representa cualidades femeninas y pasividad.
    • El rojo oscuro evoca energía, vigor, furia, fuerza de voluntad, cólera, ira, malicia, valor, capacidad de liderazgo. En otro sentido, también representa añoranza.
    • El marrón evoca estabilidad y representa cualidades masculinas.
    • El marrón rojizo se asocia a la caída de la hoja y a la cosecha.
    Púrpura:
    • El púrpura aporta la estabilidad del azul y la energía del rojo.
    • Se asocia a la realeza y simboliza poder, nobleza, lujo y ambición. Sugiere riqueza y extravagancia.
    • El color púrpura también está asociado con la sabiduría, la creatividad, la independencia, la dignidad.
    • Hay encuestas que indican que es el color preferido del 75% de los niños antes de la adolescencia. El púrpura representa la magia y el misterio.
    • Debido a que es un color muy poco frecuente en la naturaleza, hay quien opina que es un color artificial.
    • El púrpura brillante es un color ideal para diseños drigidos a la mujer. También es muy adecuado para promocionar artículos dirigidos a los niños.
    • El púrpura claro produce sentimientos nostálgicos y románticos.
    • El púrpura oscuro evoca melancolía y tristeza. Puede producir sensación de frustración.
    Azul:
    • El azul es el color del cielo y del mar, por lo que se suele asociar con la estabilidad y la profundidad.
    • Representa la lealtad, la confianza, la sabiduría, la inteligencia, la fe, la verdad y el cielo eterno.
    • Se le considera un color beneficioso tanto para el cuerpo como para la mente. Retarda el metabolismo y produce un efecto relajante. Es un color fuertemente ligado a la tranquilidad y la calma.
    • En heráldica el azul simboliza la sinceridad y la piedad.
    • Es muy adecuado para presentar productos relacionados con la limpieza (personal, hogar o industrial), y todo aquello relacionado directamente con:
      • El cielo (líneas aéreas, aeropuertos)
      • El aire (acondicionadores paracaidismo)
      • El mar (cruceros, vacaciones y deportes marítimos)
      • El agua (agua mineral, parques acuáticos, balnearios)
    • Es adecuado para promocionar productos de alta tecnología o de alta precisión.
    • Al contrario de los colores emocionalmente calientes como rojo, naranja y amarillo, el azul es un color frío ligado a la inteligencia y la conciencia.
    • El azul es un color típicamente masculino, muy bien aceptado por los hombres, por lo que en general será un buen color para asociar a productos para estos.
    • Sin embargo se debe evitar para productos alimenticios y relacionados con la cocina en general, porque es un supresor del apetito.
    • Cuando se usa junto a colores cálidos (amarillo, naranja), la mezcla suele ser llamativa. Puede ser recomendable para producir impacto, alteración.
    • El azul claro se asocia a la salud, la curación, el entendimiento, la suavidad y la tranquilidad.
    • El azul oscuro representa el conocimiento, la integridad, la seriedad y el poder.
    Verde:
    • El verde es el color de la naturaleza por excelencia. Representa armonía, crecimiento, exuberancia, fertilidad y frescura.
    • Tiene una fuerte relación a nivel emocional con la seguridad. Por eso en contraposición al rojo (connotación de peligro), se utiliza en el sentido de “vía libre” en señalización.
    • El verde oscuro tiene también una correspondencia social con el dinero.
    • El color verde tiene un gran poder de curación. Es el color más relajante para el ojo humano y puede ayudar a mejorar la vista.
    • El verde sugiere estabilidad y resistencia.
    • En ocasiones se asocia también a la falta de experiencia: “está muy verde” para describir a un novato, se utiliza en varios idiomas, no sólo en español.
    • En heráldica el verde representa el crecimiento y la esperanza.
    • Es recomendable utilizar el verde asociado a productos médicos o medicinas.
    • Por su asociación a la naturaleza es ideal para promocionar productos de jardinería, turismo rural, actividades al aire libre o productos ecológicos.
    • El verde apagado y oscuro, por su asociación al dinero, es ideal para promocionar productos financieros, banca y economía.
    • El verde “Agua” se asocia con la protección y la curación emocional.
    • El verde amarillento se asocia con la enfermedad, la discordia, la cobardía y la envidia.
    • El verde oscuro se relaciona con la ambición, la codicia, la avaricia y la envidia.
    • El verde oliva es el color de la paz.
    Negro:
    • El negro representa el poder, la elegancia, la formalidad, la muerte y el misterio.
    • Es el color más enigmático y se asocia al miedo y a lo desconocido (“el futuro se presenta muy negro”, “agujeros negros”…).
    • El negro representa también autoridad, fortaleza, intransigencia. También se asocia al prestigio y la seriedad.
    • En heráldica el negro representa el dolor y la pena.
    • En una página web puede dar imagen de elegancia, y aumenta la sensación de profundidad y perspectiva. Sin embargo, no es recomendable utilizarlo como fondo ya que disminuye la legibilidad.
    • Es conocido el efecto de hacer más delgado a las personas cuando visten ropa negra. Por la misma razón puede ayudar a disminuir el efecto de abigarramiento de áreas de contenido, utilizado debidamente como fondo.
    • Es típico su uso en museos, galerías o colecciones de fotos on-line, debido a que hace resaltar mucho el resto de colores. Contrasta muy bien con colores brillantes.
    • Combinado con colores vivos y poderosos como el naranja o el rojo, produce un efecto agresivo y vigoroso.
  3. Tabla de propiedades de los colores: En la siguiente tabla vamos a resumir, para los principales colores, qué simbolizan, así como su efecto psicológico o acción terapéutica, tanto en positivo, como en negativo:
    Color Significado Su uso aporta El exceso produce
    BLANCO Pureza, inocencia, optimismo Purifica la mente a los más altos niveles
    LAVANDA Equilibrio Ayuda a la curación espiritual Cansado y desorientado
    PLATA Paz, tenacidad Quita dolencias y enfermedades
    GRIS Estabilidad Inspira la creatividad
    Simboliza el éxito
    AMARILLO Inteligencia, alentador, tibieza, precaución, innovación Ayuda a la estimulación mental
    Aclara una mente confusa
    Produce agotamiento
    Genera demasiada actividad mental
    ORO Fortaleza Fortalece el cuerpo y el espíritu Demasiado fuerte para muchas personas
    NARANJA Energía Tiene un agradable efecto de tibieza
    Aumenta la inmunidad y la potencia
    Aumenta la ansiedad
    ROJO Energía, vitalidad, poder, fuerza, apasionamiento, valor, agresividad, impulsivo Usado para intensificar el metabolismo del cuerpo con efervescencia y apasionamiento
    Ayuda a superar la depresión
    Ansiedad de aumentos, agitación, tensión
    PÚRPURA Serenidad Útil para problemas mentales y nerviosos Pensamientos negativos
    AZUL Verdad, serenidad, armonía, fidelidad, sinceridad, responsabilidad Tranquiliza la mente
    Disipa temores
    Depresión, aflicción, pesadumbre
    AÑIL Verdad Ayuda a despejar el camino a la conciencia del yo espiritual Dolor de cabeza
    VERDE Ecuanimidad inexperta, acaudalado, celos, moderado, equilibrado, tradicional Útil para el agotamiento nervioso
    Equilibra emociones
    Revitaliza el espíritu
    Estimula a sentir compasión
    Crea energía negativa
    NEGRO Silencio, elegancia, poder Paz. Silencio Distante, intimidatorio
  4. Tabla de sensaciones: Ahora vamos a plantear el ejercicio inverso: supongamos que estamos diseñando un nuevo sitio web. Y supongamos que en determinadas situaciones queremos sugerir, promover determinados sentimientos entre nuestros visitantes. En la siguiente tabla esquematizamos como:
    Sensación Colores Muestras
    Calidez, tibieza Colores tibios asociados al fuego: Marrón, Rojo, Naranja, Amarillo
    Fascinación, emoción El amarillo dorado deja una sensación perdurable, brillante, fuerte.
    Sorpresa El granate, sorprende por poco usado.
    Feminidad La variedad de tonos alrededor del rosa y lavanda
    Dramatismo Verde oscuro, poderoso.
    Naturalidad Sutiles tonos de gris y verde
    Masculinidad Marrones, piel curtida y azules
    Juvenil Colores saturados, brillantes, extremos, con el máximo contraste
    Serenidad Sombras frescas, del violeta al verde
    Frescura Tonos neutros de azul violeta y gris