Diseño Web & UX

Fundamentos de diseño en landing pages para atraer leads y ventas

    Por MadridNYC Studio (Autor invitado), publicado en 23 agosto 2019

    Tener una landing page bien diseñada te facilitará la tarea de conseguir tus objetivos propuestos, que no son otros que captar y atraer leads, y/o aumentar tus conversiones. En otras palabras, crear una página de aterrizaje efectiva será tu vía más rápida para convertir visitantes en leads o, mejor aún, en clientes fieles. 

    Para ello, elementos como el formulario o la llamada a la acción son clave para registrar datos y comenzar una relación con aquellos usuarios que aterrizan en tu página.

    Si, además, tu landing page persigue el objetivo específico de generar ventas de un producto o servicio determinado, estaríamos hablando de lo que se conoce como sales page (o página de ventas).

    En cualquier caso, sea cual sea tu objetivo, dominar los fundamentos principales en diseño de landing pages, te permitirá ofrecer una experiencia al usuario única y excepcional. ¡Vamos a verlo!

    Fundamentos-de-diseno-en-landing-pages-para-atraer-leads-y-ventas

     

    7 Fundamentos clave de diseño de landing pages

    Sin duda, antes de ponerte manos a la obra, y crear la estructura y copy de una landing page verdaderamente efectiva, debes estudiar su diseño y comprobar que cumple con los fundamentos básicos responsables de atraer y persuadir hacia la conversión.

    Piensa que si una página no es estética ni está bien organizada, no generará confianza entre los usuarios y los alejará aún más de tu objetivo; lo que les llevará a abandonar la página antes incluso de leer ningún texto. 

    Así que, para evitar el abandono y mejorar tus métricas de conversión, te recomendamos tener siempre a mano la estructura y herramientas de diseño para landing pages, así como los fundamentos que vamos a ver a continuación:

     

    1# Fotos y vídeos impactantes

    Muchos usuarios tienen como formato preferido el vídeo o la imagen para que les cuente una historia o les explique cómo funciona algo. 

    Por eso, si se trata de una sales page y tu intención es vender un producto, debes intentar mostrar una foto de máxima calidad (y desde diferentes ángulos) del producto en cuestión, que muestre sus beneficios.  

    Por ejemplo: Hemos visto incluso landing pages exitosas que llevan un vídeo emotivo, que ocupa casi toda la sección Above The Fold (sin hacer scroll), y que genera tal impacto que no llevan ni siquiera un titular o descripción (aunque nunca están de más). 

     

    2# Formularios sencillos

    Muchas marcas que diseñan landing pages para la captación de leads, creen que cuanta más información soliciten en sus formularios, mejor. Pero, salvo que se trate de un formulario pre-filtro muy específico, estos deben ser concisos para evitar el abandono a mitad de camino. 

    Así que, nuestra recomendación es que solicites los datos más relevantes en un primer contacto, utilizando colores que vayan en sintonía con la página y utilizando un color llamativo para el call to action.

    Por otro lado, ten en cuenta que dependiendo del grado de conocimiento que tenga el usuario con tu marca, deberías colocar el formulario en un sitio u otro. 

    Por ejemplo: Si el usuario ya te conoce y está interesado en tu oferta, es una buena oportunidad para colocar el formulario en la parte principal de la landing, donde el usuario no tenga que hacer scroll. En cambio, si el usuario no te conoce, añadir un formulario ya desde la primera sección podría ahuyentarle.

     

    3# Botones Call To Action destacados

    Tanto el call to action del formulario como otros que utilices a lo largo de la landing page, recuerda que deben ser de un color atractivo, que resalte de la página. Además de eso, deberías tener en cuenta lo siguiente:

    • Perseguir un mismo objetivo con cada botón.
    • Transmitir un mensaje claro a través del uso de una tipografía legible.
    • Diseñar el botón de manera que se identifique como tal.
    • Jugar con los contrastes de color (además de ir en línea con la marca).
    • Colocar al menos un botón al inicio y al final de la página.

     

    4# Coherencia visual con la marca

    No tendría mucho sentido diseñar una landing page con colores que nada tienen que ver con la identidad corporativa de la marca. Eso solo despistaría al usuario, así que lo que tienes que hacer es justamente lo contrario; trabajar en la coherencia gráfica.

    Por ejemplo: Los colores corporativos de MadridNYC son rojo y blanco, y también utilizamos el negro y gris para resaltar algunas secciones y texto. Concretamente, en las landing pages que lanzamos, utilizamos prácticamente los mismos colores para que el usuario nos identifique como marca en cuestión de segundos como puedes ver aquí

     

    5# Tipografía legible

    La tipografía es otro elemento visual diferenciador que repercute en tu marca por cómo te ven desde fuera los usuarios. Como ves, estas tienen un peso importante, ya que crean las primeras impresiones de una página. 

    Teniendo en cuenta esto, sigue estas recomendaciones para obtener un diseño efectivo para tus landing pages:

    • Utiliza como mucho 3 tipografía diferentes para cada elemento (titular, cuerpo, subtítulo).
    • Elige tipografías legibles que faciliten la lectura del usuario (por ejemplo, las tipografías sin serif son ideales para la lectura en pantallas).
    • Selecciona una tipografía que vaya en sintonía con tu marca (elegir una tipografía poco coherente puede afectar negativamente a los usuarios).

     

    6# Espacios entre bloques 

    Mantener un espacio mínimo entre los distintos bloques que conforman la landing page es fundamental para tener un diseño limpio. 

    Pero, además de esto, respetar los espacios en blanco ayudará al usuario a centrar su atención en lo verdaderamente importante, y en lo que nos interesa que descubran y procesen. 

     

    7# Diseño mobile-friendly

    Es de suma importancia partir de las tendencias del momento, por lo que contar con un diseño de landing page adaptado a las pantallas de todos los dispositivos móviles es hoy prácticamente una obligación si quieres llegar a tus clientes potenciales. 

    Cuando lleves a cabo la adaptación mobile-friendly de la landing page, no olvides tener en cuenta los siguientes tips:

    • Ajustar la proporción de los botones y del texto para que no quede demasiado grande o pequeño.
    • Intentar que el scroll no quede demasiado largo para no aburrir al usuario e interferir en la navegabilidad web.
    • Ayudarte de herramientas de diseño de landing pages que integren esta adaptación a todo tipo de pantallas.

    Definir estos elementos clave de diseño en tu landing, es fundamental para seguir avanzando en el proceso de creación de una landing completa y efectiva. 

    Sobre todo es importante también porque, una vez asentados estos conceptos, tendrás mucho adelantado y conseguirás la confianza de tus usuarios para que, así, pasen al siguiente nivel.

    ¿Qué elementos de diseño consideras más importantes a la hora de montar una landing page? ¿Conocías todos estos fundamentos?

    Curso: Landing Pages y cómo aumentar tu conversión alead

    MadridNYC Studio (Autor invitado)

    MadridNYC Studio lo componemos un equipo de profesionales expertos en diseño, desarrollo web y diferentes áreas de visibilidad digital; con el foco siempre puesto en ayudar a potenciar la presencia de los negocios online en Internet y mejorar su imagen de marca para destacar de la competencia.