¿Qué es una landing page?
Si llegaste hasta aquí, probablemente ya tienes una idea de qué es una landing page. Pero vale la pena aclararlo, para que estemos en la misma página. En primer lugar, una landing page no es una página de inicio. Una página de inicio o home es donde llegan los visitantes cuando se dirigen a tu sitio web – es la “home” de tu sitio. Las páginas de inicio tienen muchos propósitos: dirigir a los visitantes a otras páginas de tu sitio, ofrecerles un lugar familiar al que llegar, brindar un centro desde donde comercializar tu marca, entre otros. Una landing page es una única página diseñada con un fin específico: convencer a los visitantes de que realicen una acción. Puede ser acceder a más información, comprar un producto o servicio, o visitar tu sitio principal. Se llama página de aterrizaje porque es donde quieres que tus visitantes “aterricen” después de hacer clic en un enlace o anuncio.¿Cómo es una landing page efectiva?
Profundicemos un poco más en lo que hace que una página de aterrizaje sea efectiva. Si tu página de aterrizaje va a convertir visitantes, debe tener al menos estos tres elementos:- En encabezado. Esto atraerá la atención de tus visitantes. Debe ser corto y directo.
- Un subencabezado. Se trata de un fragmento de texto en el que explicas a tus visitantes cómo puedes ayudarles. Aunque aquí tienes un poco más de espacio para elaborar tu encabezado, tu subtítulo también debe ser corto y atractivo.
- Un CTA. Se trata del llamado a la acción o “call to action” en inglés. Es el botón que quieres que pulsen tus visitantes. Así de sencillo.
- La navegación debe ser poca o nula. Una landing page efectiva debe hacer todo lo posible para llamar la atención hacia tu CTA. Otros elementos de navegación podrían distraer la atención de tu CTA, lo que en última instancia te haría perder clientes potenciales. Aunque hay páginas de aterrizaje efectivas que incluyen elementos de navegación (me viene a la mente DoorDash), trata de mantenerlos al mínimo.
- Incluye elementos visuales interesantes. No querrás llenar tu página de texto, pero tienes que hacerla atractiva de alguna manera. Las imágenes de alta calidad son una forma estupenda de aumentar el interés por tu servicio. Puntos extra si puedes incluir un vídeo.
- Incluye una prueba de popularidad. ¿Has recibido algún comentario positivo? No dudes en compartirlo en tu landing page. Los seres humanos son criaturas sociales. Si tus visitantes ven que otros recomiendan lo que ofreces, es más probable que se interesen.
- Hazla interactiva (si corresponde). Hacer que los visitantes interactúen con tu sitio puede ser una forma efectiva de aumentar su interés. Los concursos, las barras móviles y los minijuegos son excelentes para animar a los visitantes a hacer clic. Sin embargo, asegúrate de que los elementos interactivos estén realmente relacionados con lo que ofreces. De lo contrario, corres el riesgo de molestar a tus visitantes.
- Conoce a tu audiencia. ¿Qué ofreces? ¿Es elegante? ¿Enérgico? ¿Es tendencia? Una revista de juegos podría sacarle provecho a un minijuego en el navegador. Una tienda de velas podría tener un pequeño cuestionario que ayude a los visitantes a encontrar la vela ideal. Todo, desde los tipos de letra hasta los colores de fondo, debe atraer a tu público objetivo.
Método 1 – Utiliza un generador de páginas de WP
Antes de empezar, tenemos que tener en claro la diferencia entre WordPress.com y WordPress.org. WordPress.org es una plataforma de código abierto para crear y gestionar sitios web. Puede que hayas oído que aproximadamente un tercio de los sitios web funcionan con WordPress. Eso es exactamente así. Para utilizar WordPress.org, necesitas un proveedor de alojamiento web y un nombre de dominio. Pero no te preocupes, esto parece más complicado de lo que es. WordPress.com es la versión de WordPress que viene con su propio alojamiento. Comparado con WordPress.org, es mucho más parecido a un creador de páginas web tradicional. Esto significa que es más fácil de administrar, pero también más limitado. Ten en cuenta que ambos editores están disponibles en español. Empecemos por crear una landing page con WordPress.org. Si sólo estás interesado en usar WordPress.com, puedes saltarte esta parte.Paso #1: Consigue un Hosting
Antes de empezar, necesitarás un proveedor de hosting donde puedas instalar WordPress y un editor de páginas web. Si ya utilizas uno para tu sitio principal o tienda online, sigue con él; no hay razón para complicar las cosas. Si aún no tienes un proveedor de alojamiento, te sugiero que leas nuestra reseña de los mejores proveedores de hosting 2024.
El proceso de instalación de WordPress variará dependiendo de tu proveedor, pero no debería ser muy complicado con ninguno. Para mi página elegí Hostinger. Hostinger se ha especializado en planes de alojamiento para WordPress, así que solo tuve que crear una cuenta y seguir las instrucciones para la autoinstalación.
¡Ahorra hasta un 75 % en tu plan de Hostinger!
Oferta por tiempo limitado: ¡No se la pierda!
Paso #2: Instala tu editor de páginas
Ahora que tienes el proveedor de alojamiento adecuado, es el momento de instalar el editor web. Solo tienes que ir a tu panel de control de WordPress, dirigirte a Plugins, y hacer clic en “Añadir nuevo”. Si ya has descargado un archivo .zip para tu editor, sólo tienes que cargarlo. Si no, puedes buscar tu editor preferido en la barra de “búsqueda de plugins” y hacer clic en el botón “Instalar ahora”. Yo usé Elementor para mi landing page, pero los pasos son muy similares cualquiera sea tu editor web. Si no sabes qué editor usar, puedes echar un vistazo a algunos de mis favoritos más abajo. Sea cual sea el editor que elijas, juega un poco con él antes de empezar. Mira tutoriales en YouTube, crea páginas de prueba, etc. Querrás sentirte cómodo con la interfaz de tu editor y sus funciones antes de meterte de lleno.Paso #3: Haz un boceto de tu página
Si no tienes una imagen clara de lo que quieres, podrías acabar fácilmente con una landing page desordenada y sin idea de cómo arreglarla. Por eso es importante tener un plan.
Comienza haciendo un modelo de prueba de tu landing page. No hay reglas para esta parte. Puedes diseñarla en Photoshop, MS Paint o dibujarla en una servilleta. Lo único que importa es que sea lo suficientemente claro para trabajar.
Si no sabes por dónde empezar, no está de más consultar ejemplos de excelentes páginas de aterrizaje en tu nicho. Piensa en tu marca, tu estilo y a quién te diriges. Para este ejemplo, decidí diseñar una landing page para una librería por suscripción que envía sugerencias personalizadas cada mes. Además de lo básico, decidí incluir un cuestionario que recomienda nuevos libros al usuario.
Paso #4: Elige la plantilla perfecta
Ya has elegido un proveedor de alojamiento, has instalado WordPress y has puesto en marcha tu editor de páginas. Estás listo para empezar con la parte divertida, ¿verdad? Casi. Todavía tienes que elegir una plantilla. Por supuesto, podrías partir de una página en blanco y empezar a construir desde ahí, pero la cantidad de decisiones de diseño minuciosas que tendrás que tomar – cosas como fuentes, colores, animaciones y diseños de fondo – podría sorprenderte. Cuanto más se ajuste una plantilla existente a tu diseño ideal, menos trabajo tendrás que hacer para darle vida a tu visión. WordPress.org tiene una enorme galería de plantillas para elegir. Tu editor web también podría venir con una variedad de opciones incorporadas. Si te sientes abrumado, nuestra lista de las mejores plantillas de landing page2024 puede ayudarte. Empecé con el tema Online Life Coach de Elementor. Aunque lo adapté para un propósito diferente (pregúntale a cualquiera, no estoy en posición de decirte cómo vivir tu vida), sus tipografías elegantes y sus elementos ordenados me dieron un gran punto de partida.Paso #5: Personaliza tu página
El proceso exacto de personalización de una landing page será diferente para todos. En mi caso, me gusta comenzar con los aspectos generales y avanzar hacia los elementos específicos. Para editar con Elementor, simplemente ve a tu panel de control de WordPress, crea una nueva página y elige “editar con Elementor”. Verás un menú con varias opciones de widgets. Haz clic en el menú hamburguesa de la parte superior izquierda (son las tres líneas horizontales) y luego en “Configuración del sitio”. Aquí, puedes personalizar los aspectos más generales de tu página, como la tipografía global, el color del fondo, entre otros. Cuando hayas terminado, haz clic en los cuadraditos de la parte superior derecha del menú. Verás una serie de widgets que puedes añadir a tu sitio. Los widgets básicos incluyen cosas como texto, imágenes y vídeos. Yo decidí actualizar mi plan a Elementor Pro para desbloquear más widgets interesantes como titulares animados y galerías multimedia. De cualquier manera, puedes simplemente arrastrar y soltar cualquier widget hasta donde quieras que aparezca en tu página. A continuación, puedes hacer clic en tu widget para que aparezca el menú de widgets. Dependiendo del widget, puedes personalizar cosas como el color, los bordes e incluso las animaciones. Para mi propia página, empecé por cambiar los colores del fondo y eliminé los elementos innecesarios de mi plantilla. A continuación, edité mi encabezado, subencabezado y creé un espacio en el que podía añadir un cuestionario. Quería que mi landing page fuera lo más sencilla posible, así que eliminé la mayoría de los elementos desplazables de la página. Sólo mantuve los elementos prefabricados para la prueba social y una pequeña sección “Sobre nosotros”, que modifiqué para que coincidiera con el estilo que quería. El cuestionario me llevó un poco más. Por suerte, Elementor viene con un widget de formulario incorporado, así que fue bastante sencillo. Si utilizas otro editor web, encontrarás un montón de plugins de formularios que puedes instalar en tu página.Los mejores editores web para Landing Pages
Hay muchos (y digo muchos) editores de páginas para WordPress. Incluso una lista de los mejores ocuparía demasiado espacio. Lo que puedo hacer es darte un vistazo rápido a mis favoritos.
Elementor
Elementor es uno de los editores de páginas más populares para WordPress, y por una buena razón. Elementor ofrece edición poderosa con solo arrastrar y soltar, y es gratis . Hay una curva de aprendizaje para dominar sus características más interesantes, pero Elementor es extremadamente potente una vez que te acostumbras a él. Algunas de sus mejores características para las páginas de aterrizaje son:- Montones de temas de terceros. Hay miles de temas compatibles con Elementor en la web. Esto incluye un montón de temas estupendos para páginas de aterrizaje que se adaptan a todos los presupuestos.
- Funcionalidad escalable. El plan gratuito de Elementor no es nada del otro mundo. Sin embargo, si buscas aún más funcionalidad, los planes Pro y Expert tienen un precio razonable y ofrecen características fantásticas como el editor de temas y un editor de popups avanzado.
- Edición personalizada de CSS. A partir del plan Pro, puedes editar casi todas las partes de tu sitio web con código personalizado. Necesitarás un poco de conocimientos técnicos, pero las posibilidades son infinitas.
Divi
Divi de Elegant Themes es una opción flexible para editar todo tipo de sitios. El editor de módulos es increíblemente fácil de usar, a pesar de la enorme variedad de opciones de personalización que ofrece. Y si prefieres la edición del backend, Divi también lo admite.
Algunas de las mejores características de Divi son:- El editor de módulos. Si quieres editar un elemento, sólo tienes que hacer clic en él. Las distintas opciones de personalización aparecerán entonces directamente sobre el elemento.
- Fantásticos paquetes de diseño. Divi ofrece más de 250 paquetes de plantillas (llamados paquetes de diseño) para ayudarte a crear cualquier tipo de página.
- Muy fácil de usar. Hay muy pocos editores de páginas tan fáciles de usar como Divi.
SeedProd
SeedProd es el único editor de páginas en esta lista que está diseñado específicamente para páginas de aterrizaje. No tiene casi ninguna curva de aprendizaje, y los resultados son impresionantes. Es ideal si buscas una versión de Elementor más centrada en las páginas de aterrizaje, ya que las interfaces de ambos editores son bastante similares. SeedProd ofrece características geniales como:- Edición súper rápida. Gracias al diseño simple y a los widgets responsivos, sólo toma un par de minutos crear una impresionante landing page con SeedProd.
- Plantillas de alta calidad. SeedProd ofrece hasta 180+ plantillas de alta calidad y muy personalizables, dependiendo de tu plan.
- Gestión de suscriptores. Las herramientas de gestión de suscriptores de SeedProd te permiten hacer un seguimiento del crecimiento de los suscriptores y te ofrecen datos visuales sobre su número.
Beaver Builder
Beaver Builder es un editor de páginas simple, basado en módulos. Aunque se centra en la creación de páginas para sitios web de agencias, su interfaz fácil de usar y su amplia variedad de plantillas hacen que cualquiera pueda utilizarlo. Beaver Builder ofrece:- Edición con altísima respuesta. Cuando realizas cambios en tu sitio web, prácticamente no hay retraso en el editor.
- Edición sencilla de botones. Beaver Builder ofrece todas las herramientas que podrías necesitar para afinar un botón clicable (un elemento especialmente importante en la mayoría de las páginas de aterrizaje).
- Enorme centro de atención. Si alguna vez pierdes el rumbo, Beaver Builder te ofrece cientos de videotutoriales para ayudarte a retomar el camino.
Método 2 – Usar el editor WordPress Gutenberg
Si usas WordPress.com, necesitarás el plan Pro para instalar un editor de páginas (o cualquier otro plugin). Además, la mayoría de los editores guardan sus mejores características para los planes de pago, por lo que los costes pueden acumularse rápidamente. La buena noticia es que todos los planes de WordPress vienen con el editor Gutenberg, un sencillo editor de bloque para crear páginas web con facilidad. Aunque es más limitado que muchos otros constructores, puedes utilizarlo para crear una página de aterrizaje efectiva, y por poco o nada de dinero. Se hace de esta manera:Paso #1: Crea una cuenta en WordPress.com
Para empezar, solo tienes que ir a WordPress.com y hacer clic en “comenzar.” Tendrás que introducir tu nombre, tu correo electrónico y crear una contraseña.¡Ahorra hasta un 55 % en tu plan de WordPress.com!
Oferta por tiempo limitado: ¡No se la pierda!
Paso #2: Planifica tu Landing Page
El consejo es prácticamente igual al anterior, excepto que ahora debes considerar las limitaciones del editor Gutenberg cuando planifiques tu diseño. No planees una página con animaciones complejas y fondos dinámicos y… no sé, ¿efectos de partículas? Con Gutenberg, tendrás que conformarte con lo básico. Sin embargo, no dejes que esto te desanime. Una buena página de aterrizaje no necesita un montón de elementos extravagantes. Solo necesitas un fuerte CTA y una identidad que te diferencia.Paso #3: Elige tu tema
Ahora que tienes una hoja de ruta para tu página, es el momento de elegir un tema. Ve a tu panel de WordPress.com, haz clic en Apariencia y luego en Temas. Elige el que mejor se adapte al diseño que tienes en mente. Los temas de WordPress.com están diseñados para diferentes propósitos. En lugar de centrarte en los colores y los estilos de texto (siempre puedes cambiarlos más adelante), busca un tema que esté optimizado para tu estructura ideal.Paso #4: Familiarízate con Gutenberg
Cuando empieces a editar tu sitio por primera vez, WordPress.com te ofrecerá un tour rápido del editor Gutenberg. Esta es una buena oportunidad para repasar los fundamentos. También te recomiendo fuertemente que juegues un poco antes de empezar a crear tu página. Intenta añadir y quitar bloques, sólo para ver lo que hacen. Para personalizar tu página, dirígete a tu panel de control, Apariencia, y luego Editor. Ahí puedes empezar a añadir y modificar diferentes bloques para adaptarlos a tus necesidades. Para cambiar aspectos más generales de la apariencia de tu sitio, como el color de fondo, el diseño del encabezado y las tipografías, haz clic en el botón “estilos” de la esquina superior derecha. Lo que puedas y no puedas personalizar dependerá del tema que hayas elegido.Paso #5: Edita tu página
WordPress.com separa los bloques en diferentes categorías, como multimedia, texto y diseño. Los bloques de diseño son especialmente útiles ya que te permiten editar el diseño básico de tu sitio. Separar tu sitio en columnas, grupos y espacios personalizados puede ayudarte a crear un diseño cohesivo. Si necesitas añadir un elemento, simplemente dirígete a la esquina superior izquierda y haz clic en el signo más. WordPress.com ofrece una amplia gama de bloques básicos, pero las mejores herramientas serán las que permiten añadir y personalizar títulos, imágenes y párrafos. Si necesitas personalizar un bloque, haz clic en el botón “Opciones” (que se muestra como tres puntos) que aparece en su parte superior derecha y haz clic en “Mostrar más ajustes”. Dependiendo del bloque, esto te dará diferentes opciones de personalización que puedes utilizar para modificar su diseño. También puedes usar lo que WordPress.com llama “Patrones.” Los patrones son colecciones predefinidas de bloques que puedes utilizar para añadir características comunes a tu página. Hay patrones para insertar CTA, bloques de contacto, secciones “sobre nosotros” y más.Método 3 (Extra) – Deja WordPress y elige una solución más sencilla
Oye, tengo una pregunta. ¿Exactamente por qué quieres usar WordPress? No me malinterpretes, WordPress es una plataforma fantástica con mucho que ofrecer, pero no es la única manera de crear una landing page. Hay muchos editores de sitios web que te permitirán crear una página de aterrizaje eficaz en la mitad de tiempo. Y si bien es cierto que no pueden igualar a WordPress en términos de escalabilidad, para una landing page, no tienen por qué hacerlo. Así que, como extra, aquí tienes una guía rápida para crear una landing page utilizando un editor web.Paso #1: Elige un editor web
El mejor editor de páginas web para ti dependerá de lo que necesite en términos de características, facilidad de uso y flexibilidad de diseño.
Para las páginas de aterrizaje, las opciones que más recomiendo son:- Wix. Wix brinda una increíble flexibilidad para el diseño gracias a su editor gratuito con el que puedes arrastrar y soltar. Es muy fácil de usar, por lo que sólo se tarda un par de minutos en acostumbrarse. Además, incluye un montón de animaciones y elementos prefabricados que puedes utilizar para animar tu página.
- SITE123. SITE123 es uno de los editores web más sencillos que existen. Con SITE123, cualquiera puede crear una página de aterrizaje en cuestión de minutos, independientemente de su experiencia. También se adapta a los dispositivos móviles, por lo que puedes estar seguro de que tu página se verá tan bien en el móvil como en el escritorio.
- Squarespace. Squarespace es una opción fantástica para páginas que enfatizan lo visual, llaman la atención sobre elementos específicos y consiguen interacciones. Podría haber dicho simplemente landing pages. Te recomiendo Squarespace si quieres un diseño elegante pero dinámico que mayormente explique todo por ti.
Paso #2: Planifica tu diseño y elige una plantilla
Sí, esto otra vez. No voy a entrar en muchos detalles porque los pasos son básicamente los mismos que antes. Planifica de antemano la estructura de tu página y luego elige una plantilla que se acerque a ella. Wix tiene una biblioteca de más de 800 plantillas de alta calidad (35 están hechas específicamente para páginas de aterrizaje), por lo que no debería ser demasiado difícil encontrar la base perfecta para tu diseño. Los editores de sitios web ofrecen mucha más libertad de diseño que el editor Gutenberg. Algunos incluso ofrecen editores de landing page dedicados. También son mucho más fáciles de usar. El editor de arrastrar y soltar de Wix, por ejemplo, hace que sea fácil cambiar el aspecto y la funcionalidad de tu plantilla tanto como quieras.Paso #3: Empieza a editar
Empieza por cambiar los colores y la tipografía de tu tema al estilo que más te convenga. Para ello, simplemente dirígete al menú de la izquierda y haz clic en “diseño del sitio”. Aquí puedes empezar a eliminar los elementos que no necesites y añadir otros nuevos. Para navegar por los elementos, basta con hacer clic en el signo más de la parte superior izquierda. Wix ofrece más de 20 categorías de elementos, que van desde texto y elementos decorativos hasta funciones de tienda y una herramienta de blogging. Para añadir un elemento, simplemente haz clic en él y suéltalo donde quieras en la página. Te sugiero que aproveches al máximo la gran variedad de efectos dinámicos que ofrece Wix, como animaciones y transiciones. Son una manera estupenda de añadir interés visual a tu página y mantener la atención de los visitantes. Para editar las propiedades de un elemento, basta con hacer clic en él. Dependiendo del elemento, verás que aparecen botones para diferentes menús. En estos menús, puedes hacer cosas como editar el contenido, añadir animaciones personalizadas y mucho más. Recuerda previsualizar las diferentes versiones de tu página para asegurarte de que funcione bien tanto en móvil como en escritorio. Con unos pocos ajustes, tendrás una landing page impresionante en un abrir y cerrar de ojos.Paso #4: Publica tu página
Para publicar tu página, tendrás que registrar un dominio para ella, incluso si es sólo la versión gratuita proporcionada por Wix. Sin embargo, no te preocupes, la mayoría de los editores de páginas vienen con un registro de dominio integrado que facilita la puesta en línea de tu sitio.¡Wix cuesta ahora tan solo $17.00 al mes!
¡No te pierdas esta gran oferta!