![Cómo crear una landing page con Divi para captar clientes [para freelances]](https://www.maxcf.es/wp-content/uploads/2018/04/crear-landing-page-divi-2.jpg "crear-landing-page-divi-2")
24 Abr 2018
5 comentariosSi eres freelance y ofreces servicios profesionales a través de Internet (fotógrafo, coach, psicólogo, diseñador, creativo, social media...) seguro que una de las tareas que más complicada te resulta es la de captar nuevos clientes.
Por ese motivo, en este post te quiero mostrar cómo crear una landing page desde cero en Divi con ese objetivo.
Para ello, he creado la landing page de un fotógrafo de bodas en Madrid que busca captar nuevos clientes.
Este es el resultado y el ejemplo de landing page que te voy a enseñar a diseñar con Divi paso a paso.
¿Qué es una landing page?
Lo primero que voy a hacer es definir qué es exactamente una landing page.
Es un concepto que se puede traducir al castellano como página de aterrizaje.
Este tipo de páginas están creadas para cumplir un objetivo muy concreto, es decir, cuando el usuario "aterriza" en ellas, solo puede realizar una acción, o en caso contrario marcharse.
Por ese motivo, una landing page no debe tener puntos de distracción como menús, enlaces a otras páginas o botones de redes sociales.
Cuando el usuario llega a ella, tiene que realizar la acción para la que se ha creado dicha página o cerrarla.
Algunas de estas acciones son:
- Registrarse.
- Suscribirse.
- Contestar a una encuesta.
- Completar un formulario.
- Descargar algún recurso o material.
- Acceder a un curso o una masterclass.
- Realizar una compra.
¿Qué necesitas para crear una landing page de captación de clientes?
Para crear una landing page necesitas una serie de recursos y materiales, tales como:
- Una herramienta para diseñar y maquetar landing pages. Puede ser un plugin de WordPress, una plataforma externa o el propio maquetador visual que utilices en tu web, como es mi caso.
- Material audiovisual. Las imágenes y los vídeos de calidad son fundamentales en una landing page para captar la atención del usuario.
- Textos. También necesitas unos copys persuasivos, es decir, que inciten al usuario a realizar la acción que pretende la landing page.
- Llamadas a la acción. Las llamadas a la acción como botones de descarga o de suscripción son importantes para animar al usuario a realizar dicha acción.
- Formulario contacto / suscripción. Por último, necesitas un elemento imprescindible en toda landing page: un formulario para captar suscriptores o que el usuario deje sus datos.
Estructura de una landing page si eres freelance y quieres captar clientes
La estructura de una landing page no es estática, es decir, puede variar en función del objetivo que busque conseguir.
En el ejemplo de este post, he seguido una estructura sencilla que me funciona bien en mis propias páginas de captación de clientes.
A diferencia, por ejemplo, de una landing page para la captación de suscriptores en la que lo primero que suele aparecer es el lead magnet (regalo a cambio de la suscripción), las páginas para captar clientes suelen tener más texto y el formulario aparece al final.
En mi ejemplo a la hora de crear una landing para el fotógrafo de bodas en Madrid he seguido la siguiente estructura:
- Cabecera de gran tamaño a modo de presentación. En ella queda claro quién es la persona que está detrás de la página y a qué se dedica. El usuario solo necesita un vistazo.
- Biografía del autor. Un poco de información acerca del profesional en cuestión.
- Los servicios que ofrece ese profesional. También podrían ser las diferentes modalidades de un mismo servicio.
- Ejemplos de su trabajo, a modo de galería. En el caso de un diseñador, por ejemplo, aparecerían sus últimos diseños.
- Testimonios de clientes satisfechos (con dos o tres es suficiente).
- Formulario de contacto. Por último, aparece el formulario que debe completar la persona que está interesada en los servicios que se ofrecen en la landing page. Este formulario es muy importante para recoger el máximo número de datos del posible cliente y cualificar el lead.
De hecho, en esta landing de ejemplo he incluido un formulario sencillo, pero en mis propias páginas el usuario tiene que responder unas cuantas preguntas más:
Cómo crear una landing page con Divi paso a paso
Una vez tienes clara cuál va a ser la estructura de tu landing page, es el momento de ponerte manos a la obra.
Para ello, he dividido las tareas que hay que realizar para crear una landing page en estas tres:
#1 Crear una nueva página en WordPress
El primer paso para diseñar una landing page con Divi es crear una nueva página en tu WordPress.
Para ocultar el menú, debes seleccionar la siguiente opción:
Atributos de página > Plantilla > Blank Page.
#2 Definir el estilo visual y creativo
Como en todos mis diseños, lo primero que hago es definir el estilo visual y creativo de la página: colores, tipografías, efectos , animaciones, etc.
En el caso de esta landing page, he optado por un color verde turquesa como principal (me encanta), quedando la paleta de colores de la siguiente forma:
- Verde turquesa (color principal): #35c3a9
- Blanco: #ffffff
- Negro: #000000
En cuanto a las tipografías, he elegido las dos siguientes, como es habitual en mis diseños:
- Poppins para los títulos y subtítulos.
- Noto Sans para el cuerpo de texto.
Sobre el estilo de la landing page, he optado por diferenciar los títulos de los diferentes apartados del contenido mediante bloques de imagen con ancho completo y un efecto degradado que combina los colores blanco y turquesa:
- rgba(41,196,169,0.86)
- rgba(255,255,255,0.45)
El resultado de estos bloques de títulos y subtítulos con este efecto degradado es el siguiente:
Por último, he añadido un divisor inferior para darle más dinamismo a los bloques y conseguir ese efecto tan chulo.
#3 Maquetar el contenido
Creada la página y definido el estilo, es el momento de pasar a la maquetación del contenido, proceso que te muestro paso a paso en el siguiente vídeo para no alargar en exceso este post:
Espero que este tutorial te ayude a la hora de crear una landing page en WordPress si usas Divi y tu objetivo es captar clientes 😉
Portada: shutterstock
Gracias Max está muy bueno! Actualmente estoy trabajando en reestructuraciones de mi página y una de las cosas en mi lista es una landing page.
Está muy útil la información.
Genial Esther!
Me alegra que te sirva para tu nueva web y que lo puedas aplicar a tus Landing Pages.
Muchas gracias por comentar 🙂
Hola Max! qué tal?
El otro día te descubrí, te hice una pregunta y justo te pillé escribiendo en el blog, así que en menos de un minuto me compré divi.
Le estoy dando caña ya y ahora quiero crear una Landing Page y una Squeeze Page. Quiero saber qué me recomiendas para la landing page, ¿Hacerla yo mismo o utlizar una plantilla "premade" ? He visto que no es demasiado difícil hacerla yo mismo (relativamente) pero también he visto mucho material en la red gratis o con un costo no demasiado alto.
Muchísimas gracias de antemano,
Un saludo!
Hola Mario,
Pues creo que depende un poco de la destreza que tengas con Divi.
En mi caso, no suelo usar los layouts que trae Divi (es raro que lo haga). Prefiero crear mis diseños desde cero con total creatividad. Pero, si acabas de empezar y no controlas tanto la herramienta, las plantillas de Divi son muy buena opción.
Puedes coger alguna que te guste y personalizarla según tus necesidades.
Espero que te sirva el consejo ?
Saludos
Gracias por este diseño y material interesante, un saludo desde Venezuela....