Tutorial Divi: Cómo diseñar una landing page con Divi

¡Hola DivilFans! en este tutorial de Divi les enseñaré a diseñar una landing page o página de aterrizaje con Divi. Las landing page o páginas de...

Por Jefferson M.

Jun 9, 2020

¡Hola DivilFans! en este tutorial de Divi les enseñaré a diseñar una landing page o página de aterrizaje con Divi.

En este vídeo tutorial diseñaremos una página de aterrizaje efectista y con diseño potente para que puedas usarla para la venta de algún producto digital o configurar alguna caja de suscripción de correos electrónicos en la misma.

Preview

Al terminar el tutorial, podrás conseguir un resultado como este:

Descarga el layout de forma gratuita

¿Qué es una landing page o página de aterrizaje?

Las landing page o páginas de aterrizaje son páginas que podemos crear para un propósito: la conversión. Sí deseas convertir a los visitantes de la página en seguidores, suscriptores o clientes. Tener una landing page efectiva puede ser la diferencia entre el éxito y el fracaso de tu emprendimiento digital.

Si quieres usar el tema Divi de manera profesional, revisa nuestro Curso básido del tema Divi para lograr diseños geniales.

Una landing page efectiva llamará la atención del lector sobre tu contenido y le dará la información que necesita para realizar la acción que tu has programado. Aquí tenemos un resumen de los elementos clave que hacen que una landing page sea efectiva.

Titulo de una landing page

El titular es una de las primeras cosas que verá el visitante. Debe contener dos elementos:

Titulo principal: es el título principal y el propósito de la página.

Subtítulo: Información adicional y concentrada dentro de la página.

La importancia de un buen titulo radica en la efectividad de su mensaje. Los titulares deben ser claros, concisos y llamar la atención del usuario que navega la landing page.

Imagen o video

Esta es una imagen de portada de tu landing page, da el primer impacto visual cuando un usuario entra a nuestra landing. Debes usar una imagen o video y audio con la más alta calidad posible. Asegúrate de que tengan una excelente iluminación y que tenga estándares de fotografía profesionales. No deberían verse cómo fotos tomadas con el móvil.

Oferta y Beneficios

Aquí debes proporcionar información valiosa de la oferta y los beneficios que tendrá el usuario al hacer cualquiera que sea la acción que hayas programado en la landing page. Es importante que la oferta sea clara, sea real y no sea exagerada, no podemos levantar falsas expectativas a los usuarios.

Llamado a la acción

El llamado a la acción es el propósito principal de la página. El resto es información de respaldo para guiar a los visitantes a la CTA y brindarles la información que necesitan para tomar una decisión informada. Por lo general, son botones que usan frases de acción como comprar, descargar, unirse, hacer clic y luego agregar términos como «gratis».

Uno de los CTA más recurrentes son la suscripción, cosa que puedes configurar con el módulo de email optin de Divi o con el plugin bloom tambien de Elegant Themes, ambos funcionan de maravilla.

Por ejemplo, los botones pueden incluir texto como «Comprar ahora», «Descargar gratis», «Únase hoy», «Haga clic aquí para obtener un 15% de descuento», etc. Los botones de llamada a la acción deben estar bien etiquetados, destacados y arriba del scroll (visible en un escritorio sin tener que desplazarse). Nunca debes obligar a un visitante a buscar su botón CTA.

Testimonios y confianza

Esto incluye calificaciones, reseñas, entrevistas, cifras de ventas, comunicados de prensa, garantías y cualquier otro material para generar confianza.

Esto debe incluir testimonios que sean buenos y no tan buenos, y revisiones que sean números precisos y no redondeados. Esto demuestra que las revisiones y testimonios son honestos y crean credibilidad. Otra forma de generar confianza es agregar insignias de confianza y seguridad.

Estructura de navegación

No deseas distraer a tus visitantes de realizar su llamado a la acción. El sistema de menús debe ser breve y simple con solo unos pocos enlaces que sean fáciles de entender y seguir. No deseas todas las páginas y categorías en el menú. Esta no es una estructura de navegación completa como podríamos esperar en una página web normal. Recuerda, el enfoque es la conversión, no llevarlos a otras páginas del sitio.

Conclusiones

La clave para diseñar una landing page con Divi efectiva es probar constantemente y hacer mejoras basadas en esas pruebas. Crear un diseño acorde a los lineamientos de una landing page que funcioné y por supuesto, usar todo el poder de Divi para crearla de manera sencilla tal como lo hicimos en este video tutorial.

¡Nos gustaría saber qué piensas! ¿Tienes algún consejo de diseño de landing page que podemos agregar? ¿Has probado hacer landing pages con Divi? Déjanos los enlaces en los comentarios.

¡Muchas gracias! ¡No olvides compartir este contenido en tus redes sociales!

Nos vemos el el proximo video tutorial.

¿Te gustó? ¡Compártelo en redes sociales!

¿Quieres aprender a usar Divi de manera profesional?

Conoce nuestro contenido premium y comienza hoy mismo a llevar tu sitio web o el de tus clientes a otro nivel

¿Te gustó este contenido?

Conoce nuestro contenido premium y aprende a crear sitios web geniales, modernos y potentes.

Post relacionados:

5 Comentarios

  1. Avatar

    Hola! Muy buen tutorial.

    Una pregunta, en donde descargas las imágenes que usas en este tutorial? No los íconos si no las imágenes de las personas sentadas en los escritorios.

    Gracias de antemano!

    Responder
      • Avatar

        Otra pregunta! Alguna página parecida donde se puedan descargas estas imágenes que se ocupan de fondo? Son muy minimalistas y tiene pequeños detalles, pero que se ven mejor que un fondo blanco y las veo mucho en tus web.

        Gracias de antemano!

        Responder
        • Jefferson M.

          Hombre de páginas para backgrounds así de este tipo no conozco ninguna, regularmente estos fondos con detallitos los hace un diseñador, aunque con la misma gente de Elegant Themes en los diseños de Divi, traen mucho estos fondos de este tipo que puedes usar con toda libertad.

          Responder
          • Avatar

            Comprendo. Muchas gracias nuevamente por tu respuesta

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Shares