3 CLAVES DE DISEÑO WEB PARA ATRAER VISITAS

Si me preguntas qué es más importante en una web, si los textos o el diseño y, aunque soy diseñadora web, te diré que: los textos.

Pero por más que los considere primordiales, vale la pena recordar que todo entra por los ojos. Así que la función del diseño en la web es atraer y la de los textos, retener y convertir.

Por tanto, el contenido y el diseño van de la mano, se complementan porque el uno sin el otro carece de fuerza. Siendo que el tema de los textos los tienes controlados con mi querida Verónica, yo te hablaré en este artículo del diseño.

Primero me presento, soy Adriana Chaux y me dedico al diseño web para emprendedores y pequeños empresarios que quieren destacar en internet a través de una página web que proyecte una imagen profesional, atraiga clientes y aumente sus ventas.

Mi misión será decirte cuáles son las 3 Claves de Diseño Web para lograr atraer a tu cliente ideal.

Si quieres causar una buena impresión y atraer con un buen diseño web a tus clientes, lo primero que tienes que trabajar es en un estilo visual coherente y esto lo logras teniendo en cuenta 3 Claves:

3 Claves de Diseño Web

1-     Colores :

Los colores tienen el poder de comunicar y transmitir emociones. Por eso existe la psicología del color que nos enseña el significado de cada uno. Aquí te hago un breve repaso para que identifiques qué quieres transmitir con tu marca y que esto se refleje en tu web:

  • BLANCO
    • Transmite: Pureza, Inocencia, Frescura, Limpieza, Seriedad, Simplicidad.
  • ROJO
    • Transmite: Fortaleza, Pasión, Determinación, Deseo, Amor, Fuerza, Valor, Impulsividad.
      • Marcas: Coca Cola, Red Bull, CNN.
  • NARANJA
    •  Transmite: Calidez, Entusiasmo, Creatividad, Éxito, Optimismo, Dinamismo, Amigable.
      • Marcas: Nickelodeon, Fanta.
  • AMARILLO
    • Transmite: Energía, Felicidad, Diversión, Alegría, Espontaneidad, Innovación
      • Marcas: McDonald’s, National Geographic
  • VERDE
    • Transmite: Naturaleza, Esperanza, Equilibrio, Crecimiento, Estabilidad.
      • Marcas: Starbucks, Lacoste.
  • AZUL
    • Transmite: Seriedad, Confianza, Fidelidad, progreso, Lealtad, Libertad.
      • Marcas: Skype, Facebook.
  • VIOLETA
    • Transmite: Creatividad, Sabiduría, Imaginació, Lujo, Místico, Serenidad, Elegante, Ecléctico
      • Marcas:  Yahoo!, Syfy.
  • ROSA
    • Transmite: Dulzura, Delicadeza, Exquisitez, Amistad, Amabilidad
      • Marcas: Barbie, Dunkin’ Donuts
  • GRIS
    • Transmite: Solemnidad, Neutralidad, Calma, Paz
      • Marcas: Apple, Dell, Nissan
  • NEGRO:
    • Transmite: Elegancia, Formalidad, Sobriedad
      • Marcas: Mercedes Benz, Chanel, BBC

Ya sabiendo cuál es el significado de cada color y lo que cada uno transmite, busca una imagen que sientas que representa tu marca y que tenga esos colores que te gustaría usar.

Para determinar tu paleta de colores armoniosa, te mostraré dos herramientas. Te ayudarán a elegir una combinación de colores que esté acorde a lo que quieras transmitir y que también resulte agradable a la vista. En este vídeo te lo muestro de forma muy clara.

Como ves, la combinación de estos colores es agradable a la vista tal cual está.

Para mejorar el diseño de tu web, te recomiendo que elijas máximo 3 colores que van a estar siempre presentes en tu web: uno llamativo que usarás en las llamadas a la acción, otro color para los títulos y uno neutro para los fondos.

El negro, el blanco y el gris son colores comodines que siempre van a estar presentes en tu web.

La clave para lograr coherencia está en asignarle a cada color una tarea y siempre cumplirla.

2-     Tipografía:

Las tipografías también tienen la función de transmitir emociones y sensaciones. Ten presente que una mala combinación puede llegar a afectar negativamente a tu marca.

Las tipografías se dividen en dos: Las SERIF (con serifa) y las SANS SERIF (sin serifa)

claves de Diseño Web - tipografía con serifa y sin.

Las Sans Serif suelen verse más modernas, limpias, versátiles y elegantes.

Las Serif transmiten elegancia, son clásicas, formales y de lujo. Se usa mucho en revistas de moda, marcas de lujo, sector premium.

En tu web evita usar más de 3 fuentes tipográficas. Aunque lo ideal es usar solo 2, una para los títulos y la otra para los textos y lo más recomendable es usar tipografías que se puedan leer fácilmente para no afectar la lectura al usuario.

A continuación te mostraré un par de ejemplos de combinaciones ganadoras entre estos dos tipos de fuentes:

Combinación fuente Sans Serif ( título) – Serif (cuerpo del texto):

claves de Diseño Web - Combinacion tipografia Open sans con libre basketville

claves de Diseño Web - combinacion tipografia nunito y lora

 

Combinación fuente Serif ( título) – Sans Serif (cuerpo del texto):

claves de Diseño Web - Combinacion serif Alegreya con sans serif Open Sans

claves de Diseño Web - Combinacion serif Lora con sans serif Source Sans Pro

Estos ejemplos los tomé de la página web Fontpair donde encontrarás más ejemplos de combinaciones de fuentes tipográficas gratuitas como Google Fonts.

Para cerrar con el tema de las tipografías, te dejo 3 recomendaciones:

  1. Intenta usar solo 2 fuentes tipográficas.
  2. Usa fuentes gratuitas como Google Fonts. La mayoría de las plantillas web las llevan incorporadas de serie. Una vez elijas una, te dará sugerencias para combinarla con otra.
  3. Revisa y elige combinaciones del sitio web Fontpair y Google Fonts. Te ahorrarás mucho tiempo en la elección de tipografías que combinen.

3-     Fotografía :

Esta es la última de las 3 claves de Diseño Web: tener unas buenas imágenes son la diferencia entre el cielo y la tierra. Jamás uses imágenes extraídas de Google (recuerda los derechos de autor) ni de bancos de imágenes gratuitos. Tampoco es una buena opción usar fotografías tomadas desde el celular.

En el mejor de los casos, contrata a un profesional para que te haga una buena sesión de fotos. Pero si ahora no puedes contratar a un profesional, busca las imágenes en bancos de pago.

Si decides comprar las imágenes, busca coherencia visual en las fotos para que todas ellas se parezcan entre sí.

Evita esto:

claves de Diseño Web - cactus fondo blanco

claves de Diseño Web - cactus sobre madera

Puedes ver que ambas imágenes tienen un objeto en común, unas plantas, pero el fondo y lo que las rodea es diferente.

No puedes usar ambas imágenes en un mismo diseño web ya que lo que transmiten por sí mismas difiere entre sí.

Busca esto: imágenes relacionadas entre sí, mismos elementos desde un diferente ángulo.

claves de Diseño Web - gafas y libreta de anotaciones blanco y negro

Estos son los bancos de imágenes que te recomiendo.

Adobe StockShutterstockIstock

Conclusiones :

Todo entra por los ojos, así que tener un estilo visual definido y coherente es clave al momento de atraer potenciales clientes a tu web.

Tienes ahora las 3 Claves de Diseño Web. Tómate un tiempo para revisar tu web. Observa si los colores, las tipografías y las imágenes se ven armoniosos entre sí. O por el contrario,  se crispan y hacen que tu sitio sea poco atractivo.

Menos es más

Si estás dudando de algo en cuanto a colores o tipografías, vete por lo seguro.

En cuanto a colores escoge uno solo que resalte y que los demás sean neutros.

Para las tipografías, te recomiendo elegir una entre Roboto, Open Sans Pro o Montserrat. Usa sus diferentes grosores para diferenciar títulos y cuerpo del texto y seguro que no vas a desentonar.

Cuida mucho los espacios en blanco, deja que tu web respire y no la satures.

La simplicidad es la máxima sofisticación.

Por último, sé coherente en todo. Haz que todos los elementos de tu web sean los mismos siempre, como por ejemplo, que los botones tengan el mismo color y tipografía.

Otro ejemplo: si los títulos van en mayúsculas, revisa que esta norma se cumpla en todas las páginas de tu web.

Los pequeños detalles marcan la diferencia.

Cuéntame en los comentarios qué punto clave te pareció más importante y si lo vas a poner en práctica en tu web.

Y si estás iniciando el diseño de tu web, te regalo mi Guía de 5 Pasos para Planificar tu página web desde cero .


acerca de Adriana chaux

Soy Adriana Chaux y me dedico al diseño web para emprendedores y pequeños empresarios que quieren destacar en Internet a través de una página web que proyecte una imagen profesional, atraiga clientes y aumente sus ventas.

adriana Chaux

2 comentarios sobre “3 CLAVES DE DISEÑO WEB PARA ATRAER VISITAS

  1. ¡Hola, Adriana!

    Mi banco de imágenes de pago (aunque también tiene opción gratuita) es Freepik. Las imágenes para mis webs y las de mis clientes las saco siempre de la versión premium. Aunque para usar en redes sociales también he tirado de Pexels y Paxabay.

    Un saludo 🙂

Deja un comentario

Tratamiento de los Datos Personales que proporcionas:

Responsable: Verónica Fabra, fundadora de EscriboXti.

Finalidad: poder gestionar tu comentario.

Legitimación: a través de tu consentimiento expreso y es necesario para gestionar tu solicitud.

Almacenamiento: en los servidores de Raiola Networks mi proveedor de hosting, dentro de la UE. Ver política de privacidad de Raiola Networks.

Derechos: acceder, rectificar, limitar, portar o suprimir. Solo tienes que escribir a info@escriboxti. Más información en la Política de Privacidad.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.