7 ajustes de diseño que elevan las conversiones por las nubes

7 ajustes de diseño que elevan las conversiones por las nubes

Hay muchos elementos para un negocio en línea. Existe el sitio web y un blog actualizado periódicamente. Hay un embudo de ventas, marketing, redes sociales, publicidad.

Tu dilo.

Pero todo esto es en vano si no consigues que la gente te compre.

Así que reúnes a tu equipo en Skype y comienzas a crear estrategias. Todos concluyen que es hora de aumentar sus ventas en un 30%.

La pregunta es ¿cómo lo haces? ¿Inviertes en publicidad? ¿O dedica más tiempo a fortalecer su relación con su audiencia a través de las redes sociales?

Irónicamente, probablemente puedas obtener un impulso significativo sin ninguno de estos.

Cuando se trata de optimizar su sitio web para las conversiones, los elementos visuales en su página juegan un papel muy importante. Por visual, me refiero al color, las imágenes, las señales y su ubicación en sus páginas de destino o de pago.

Aquí le mostramos cómo enviar sus tasas de conversión por las nubes con simples ajustes visuales.

1. Botón de llamada a la acción

Los botones de llamada a la acción son una de las cosas más simples que puede realizar una prueba dividida. De hecho, puede leer acerca de 6 variables para probar en sus botones aquí. Uno de los más importantes es el color de su botón.

Recientemente lanzamos una nueva página de destino para Vismeuna aplicación para crear presentaciones e infografías interactivas.

Visme ideas

En este caso, notará que el botón CTA se destaca del resto de la página. Si no está seguro de si un botón de CTA se destaca bien, simplemente entrecierre los ojos.

En serio. Si dejas que las cosas se vuelvan borrosas, tu CTA aún debería destacarse. Miremos la imagen de arriba, borrosa. Como puede ver, pasa la prueba del estrabismo fácilmente.

Visme fuera de foco

Otra cosa que podría intentar es aumentar el tamaño de su botón.

Por lo general, los espectadores tienen un patrón de ojos en «forma de F» que desea atender. En el caso de la página de Visme anterior, un espectador mirará primero el logotipo (esquina izquierda), luego el botón de inicio de sesión (extremo derecho) y volverá al botón CTA.

Lo cual es bueno para más registros.

Visme 3 puntos

Entonces mi punto? Coloque y diseñe sus CTA de una manera favorable que haga que sus visitantes tomen medidas.

2. Imagen de héroe o mascota

Si ha estado en el negocio en línea por un tiempo, ya conoce MailChimp.

No puedes simplemente ignorar a su mascota, el chimpancé. Usan colores relajantes y una mascota memorable para causar impacto, haciendo que la marca sea «memorable».

chimpancé de correo

Otro gran ejemplo es el cazador/explorador de Social Media Examiner. No puedes simplemente ignorarlo.

examinador de redes sociales

Las mascotas pueden ser una excelente manera de generar un impacto visual en sus clientes.

Pero incluso si no tienes una mascota, está bien. Siempre puede usar una imagen de héroe efectiva para impulsar la acción.

Su imagen de héroe es un elemento creativo principal de su página que trabaja para fortalecer su título y propuesta de valores.

Se relaciona estrechamente con sus beneficios e impulsa a las personas a hacer clic en ese botón o ingresar su correo electrónico.

Veamos un ejemplo de Zipongo.

zipongo

La imagen del héroe en la parte superior es fresca como un mercado de alimentos saludables. Inmediatamente me llama la atención.

Por otro lado, ¿puedes tener 100% claro lo que hace esta página? ¿Qué significa “Hacemos que comer bien sea fácil”?

¿Quieren decir que son una aplicación de seguimiento de la salud? No estoy seguro.

Aquí hay una instantánea de otra imagen del control deslizante.

ir alimentos

Este lo hace un poco más claro y la imagen del héroe sigue siendo fresca y atractiva. Go Foods le dirá qué alimentos son buenos para comprar.

Luego, voy a su página Acerca de, y ahora entiendo que esta es una aplicación de planificación de comidas personalizada que ofrece descuentos en comestibles.

¿La leccion? Tu imagen de héroe solo puede hacer mucho por sí sola. Tiene que funcionar con otros elementos, como el título y la propuesta de valores. Así que no ignores estos.

3. Psicología del color

Probablemente haya oído hablar de él: el naranja es para confianza, el azul/verde es para confiabilidad y bla, bla, bla.

Los colores no siempre funcionan de esa manera. Cuando estudies psicología del color, no olvides tomar la contexto en consideración.

Asegúrese de obtener la “sensación” correcta de los colores en su página. Un color que se convierte mejor para su competidor no necesariamente hará lo mismo para usted.

Debe tener en cuenta los colores de fondo y de primer plano, así como otros elementos clave en su página, como su copia.

Los colores dependen en gran medida de la elección personal de un visitante, la cultura, la educación y el contexto en el que se utilizan.

Esto hace que sea importante que realice pruebas A/B cada vez que pruebe un nuevo color de botón de CTA o un nuevo tema de color de fondo para su página.

Entonces, en resumen, el amarillo brillante no tener para significar «feliz». Sí, si se combina con una carita sonriente, denota felicidad. Pero si se usa como fondo de su sitio web, significa que necesita algunas clases básicas de interfaz de usuario.

La gente siempre está comprando un sentimiento deseado específico, no solo un producto. Si es un entusiasta de Harley Davidson, esencialmente está comprando la sentimiento de robustez, actitud despreocupada y libertad.

Si mañana comenzaran a fabricar bicicletas rosas, ¿las seguirías comprando? En realidad no, porque lo que estarían vendiendo no “coincidiría” con la personalidad de la marca. Su valor percibido sobre ellos cambiará por completo.

Es más, un estudiar muestra que preferimos algunos colores sobre otros simplemente basados ​​en el nombres. El moca, por ejemplo, ganará al marrón, aunque ambos son prácticamente iguales en el espectro de colores.

¿Línea de fondo? Realice muchas pruebas antes de decidirse por «el» color adecuado para su marca.

Consulte esta infografía de Webinpixels para obtener más información sobre los colores de la marca. La siguiente infografía de KISSmetrics también ayudará:

compras de color lrg kissmetrics

4. Contraste

He tocado este punto antes, pero vale la pena repetirlo. Sus elementos más importantes, como un botón CTA o un formulario de registro, deben destacarse como un pulgar dolorido en su página.

Puede averiguar fácilmente si pasa esta prueba desdibujando su página de destino y luego verificando si su elemento principal aún se destaca.

¿Por qué? Se trata de incorporar el contraste en su diseño.

En la página de inicio de Visme, vimos que el color verde se destacaba como un oasis en un desierto. Eso es lo que quieres.

Esto se basa en el principio psicológico conocido como «Efecto de aislamiento». Esencialmente, un artículo que se destaca más que otros será más reconocido y recordado.

Aquí hay un ejemplo de cómo Copyblogger usa este principio.

registrarse aquí

El botón «Crear cuenta» contrasta con el resto de la página, lo que atrae la atención del visitante hacia él.

5. Espacio en blanco

¡Lo último que desea es que un visitante esté listo para hacer clic en «Comprar ahora» pero no pueda encontrar ese botón!

Para evitar este tipo de problemas, asegúrese de utilizar la cantidad correcta de espacio en blanco alrededor de sus elementos.

Recuerde, los espacios en blanco no tienen que ser blancos o de color sólido. Es solo el espacio entre sus elementos, y es una forma efectiva de enfatizar su CTA y titulares.

Continuando con el ejemplo de Copyblogger, echa un vistazo a su diseño minimalista. Eso no daña la experiencia del usuario. Solo lo hace mejor. No tienen miedo de usar muchos espacios en blanco en su sitio web.

copyblogger

6. Fotos de archivo

Todavía hay muchos vendedores que usan fotos de archivo horribles. Las fotos de archivo estaban de moda hace quizás una década, pero lentamente, han ido muriendo gradualmente.

Aquí hay un ejemplo que encontré en una búsqueda rápida en la Web.

investigación polaris

Las malas fotos de archivo con hombres con traje y corbata y mujeres con ropa corporativa, con temas de color blanco y azul, siempre gritarán «falso».

No me malinterpreten, no todas las fotografías de archivo son tan malas. Todavía puedes comprar buenas fotos de stock. Obtenga emociones humanas reales en la imagen para hacerla más atractiva.

Este es mucho mejor que los hombres dándose la mano.

carro 3d

7. Señales direccionales

Un estudio realizado con el champú Sunsilk mostró que el seguimiento ocular es demasiado importante como para ignorarlo.

Considere las siguientes imágenes, por ejemplo:

champú sunsilk

Champú sunsilk mapa de calor

Cuando se probó la primera imagen usando un mapa de calor, solo unas pocas personas miraron el producto. Miraron de frente al titular.

Pero cuando se cambió la mirada de la mujer, los resultados fueron impactantes. Ahora estaba mirando el producto, proporcionando una indicación direccional a los usuarios, lo que hizo que la mayoría de los visitantes siguieran su mirada.

En resumen, miraron el producto ahora.

Las señales direccionales también pueden ser explícitas. Piensa en flechas y punteros.

Salesforce lo hace muy sutilmente en su página junto a la copia en el CTA. ¿Ve flechas pequeñas junto a Prueba gratuita, Ver demostración y Soluciones para pequeñas empresas?

aplicación de CRM número 1

¡Tu turno!

Una buena página de destino convierte, así de simple. No necesitas campanas y silbatos llamativos. Solo tenga en cuenta los consejos anteriores cuando diseñe su página.

Los humanos están conectados visualmente y nos encanta un placer visual. Organiza bien los elementos de tu página y notarás la diferencia.

¿Cuáles son tus pensamientos? ¿Yo me perdí algo? Cuéntamelo en los comentarios a continuación.