herramientas para crear landing pages
TRANSCRIPT
imanolteran.com
HERRAMIENTAS PARA CREAR LANDING PAGESSin código ni conocimientos de desarrollo web
Landing Pages sin código
Landing Pages sin códigoimanolteran.com
HOLA, SOY IMANOL DESARROLLADOR WEB CONSULTOR DE ESTRATEGIA DIGITAL FORMADOR EN NUEVAS TECNOLOGÍAS
[email protected] @imanolteran
Landing Pages sin códigoimanolteran.com
PODCASTSI DUDAS, HAZLO
Spotify Apple Podcasts
Google Podcasts
imanolteran.com Landing Pages sin código
Landing Pages sin códigoimanolteran.com
OTROS PROYECTOS DE FORMACIÓNPASATEAONLINE.COM
imanolteran.com
1. Introducción
2. Herramientas no-code
3. Landing pages a partir de hojas de cálculo
índice
Landing Pages sin código
imanolteran.com
01 Introducción Pongámonos en situación
Landing Pages sin código
Landing Pages sin códigoimanolteran.com
• Cada día afrontamos el nacimiento de nuevos productos o servicios.
• Pueden ser tanto proyectos internos como de cliente final.
• En el mundo digital, este ritmo de lanzamiento de nuevos productos y servicios es si cabe más rápido.
Introducción
01
7
Landing Pages sin códigoimanolteran.com
• Dependiendo del proyecto en cuestión, el simple hecho de tener una versión usable, puede llevar meses y un alto coste económico.
• La idea es que debemos ser capaces de tener esta versión usable lo antes posible y al menor coste posible.
• Debemos explorar caminos alternativos a los tradicionales en el proceso de desarrollo de productos o servicios digitales.
Introducción
01
8
Landing Pages sin códigoimanolteran.com
En la mercadotecnia en internet, se denomina página de aterrizaje a una página web a la que una persona llega tras pulsar en el enlace o botón en una guía, un portal o algún banner o anuncio de texto situado en otra página web, aplicación, red social, E-mail o portal de internet.
WIKIPEDIA
Landing Pages sin códigoimanolteran.com
• Una de las necesidades principales a la hora de lanzar cualquier proyecto es crear una landing page.
• Nos sirve para:
• Probar respuesta del mercado.
• Captar leads.
• Promocionar acciones concretas.
• Vender producto o servicio
Introducción
01
10
Landing Pages sin códigoimanolteran.com
• Nos sirve para:
• Conseguir que contacten con nosotros.
• Venta de afiliados.
• Conseguir suscriptores.
• Visualizaciones de contenido audiovisual.
Introducción
01
11
Landing Pages sin códigoimanolteran.com
• Una landing page puede ser accesible de diferentes formas:
• Dentro de nuestra página web
• Como una web independiente.
Introducción
01
12
Landing Pages sin códigoimanolteran.com
• Titulares llamativos.
• Mensaje claro.
• Beneficios a obtener.
• Minimizar vías de escape.
• Guiar al usuario hacia el objetivo.
Introducción
01
13
CARACTERÍSTICAS PRINCIPALES
Landing Pages sin códigoimanolteran.com
• Objetivo debe ser único.
• Formularios lo más cortos posibles.
• Testimonios.
Introducción
01
14
CARACTERÍSTICAS PRINCIPALES
Landing Pages sin códigoimanolteran.com
• Herramientas web o de escritorio que permiten desarrollar aplicaciones software sin tocar una sola línea de código.
• Con ellas, podemos desarrollar software para uso profesional.
• También son muy útiles para crear MVPs y validar/descartar ideas.
Introducción
01
15
NO-CODE
Landing Pages sin códigoimanolteran.com
• Desarrollo rápido.
• Lo haces tú mismo.
• Ahorro de tiempo.
• Ahorro económico.
• Validar ideas.
• Control sobre el proceso.
Introducción
01
16
VENTAJAS DEL NO-CODE
Landing Pages sin códigoimanolteran.com
• Dependencia de las herramientas.
• Efecto “Lock-in”
• Límites a la hora de personalizar.
• Límites de integración con otros servicios.
• Falta de control.
Introducción
01
17
INCONVENIENTES DEL NO-CODE
imanolteran.com
02 Landing pagesCon herramientas de email marketing
Landing Pages sin código
Landing Pages sin códigoimanolteran.com
• Una de las opciones para crear landing pages de forma sencilla, sin código de programación, es utilizar herramientas de email marketing.
• De un tiempo a esta parte, herramientas con las que estamos muy familiarizados, como Mailchimp, incluyen esta opción.
• Muy orientado a conseguir leads en nuestra web.
• Muy sencillas de utilizar, interfaz similar a la de crear una campaña de email marketing.
Email m
arketing
02
19
Landing Pages sin códigoimanolteran.com
• Mailchimp
• Mailerlite 🥇
• ConvertKit
• Acumbamail
Email m
arketing
02
20
HERRAMIENTAS DE EMAIL MARKETING
Landing Pages sin códigoimanolteran.com
• Pagos mediante Square.
• Ofrecer descargas para nuevos suscriptores.
• Dominio de Mailchimp o propio.
• ____.mailchimpsites.com
• Varias landings en un mismo dominio (subdominios).
• Análisis de visitas.
Email m
arketing
02
21
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• Sistema de plantillas.
• Crear landing desde app móvil.
• Posibilidad de crear una web completa.
• No permite incrustar HTML
• Gratuito.
Email m
arketing
02
22
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• Editamos audiencia a la que queremos dirigir la landing.
• Elegimos nombre para nuestra web.
• Añadimos páginas.
• Configuramos navegación.
• Editamos estilos.
• Preview en Desktop y Mobile.
• Publicar.
Email m
arketing
02
23
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• Tenemos 3 opciones en el menú:
• Páginas.
• Estilos.
• Banner de cookies.
Email m
arketing
02
24
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• Componemos la página mediante secciones.
• Podemos mover o eliminar secciones.
• Añadir secciones
• Distintos tipos.
• Dentro de cada tipo, varias opciones.
• Acceso a fotos de stock de Unsplash.
Email m
arketing
02
25
MAILCHIMP > PÁGINAS
Landing Pages sin códigoimanolteran.com
• Paleta de colores.
• Theme.
Email m
arketing
02
26
MAILCHIMP > ESTILOS
Landing Pages sin códigoimanolteran.com
• Una vez publicado, podemos añadir un popup, para conseguir que los visitante se suscriban a nuestro newsletter.
• Puedes elegir:
• Estilo.
• Opacidad.
• Posicionamiento.
• Tiempo para que aparezca.
Email m
arketing
02
27
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• También es posible extender las métricas de la página, conectándola con:
• Mailchimp.
• Facebook Pixel.
• Google Analytics.
Email m
arketing
02
28
MAILCHIMP
Landing Pages sin códigoimanolteran.com
• Landing pages a partir de plantillas o desde cero.
• Editar “drag and drop”.
• Diferentes tipos de elementos:
• Testimonios.
• Formularios de suscripción.
• Vídeos.
• Cuenta atrás.
Email m
arketing
02
29
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Encuestas.
• Venta y suscripciones mediante Stripe. (Sites Pro)
• Test A/B.
• Guardar plantillas.
• Dominio propio.
• SSL.
Email m
arketing
02
30
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Cumple con RGPD.
• Tracking con Analytics y Facebook.
• Añadir código en Header y footer.
• Responsive design.
• Posibilidad de crear webs completas.
• Popups
• Gratuito.
Email m
arketing
02
31
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Sites Pro
• Pago mediante Stripe.
• Landing pages ilimitadas.
• Visualización de interacción de usuarios.
• Tests A/B.
• Eliminar logo Mailerlite.
• Favicon personalizado.
Email m
arketing
02
32
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Nombre de la página.
• Seleccionar audiencia.
• Seleccionar template.
• Personalizar bloques.
• Ajustes.
• Contenido.
Email m
arketing
02
33
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Reorganizar bloques.
• Eliminar y componer desde cero.
• Filtro por tipos de bloque.
• Dominio:
• subscribepage.com/___
• Dominio propio
Email m
arketing
02
34
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Mostrar u ocultar header y footer.
• Header
• Diferentes layouts.
• Páginas con contenido protegido.
• Popups.
• A partir de plantillas.
Email m
arketing
02
35
MAILERLITE 🥇
Landing Pages sin códigoimanolteran.com
• Publicar.
• Configurar SEO.
• Configurar textos compartir en redes sociales.
• Código Analytics o Facebook.
• Código incrustar header o footer.
• Automatizaciones para suscripciones.
Email m
arketing
02
36
MAILERLITE 🥇
imanolteran.com
03 HerramientasNo-code
Landing Pages sin código
Landing Pages sin códigoimanolteran.com
• También existen herramientas visuales 100% pensadas para crear landing pages.
• En este caso, no dependen de sistemas de email marketing.
• También pueden integrarse con estos sistemas.
• Se trata de herramientas no-code.
• Hay diferentes aproximaciones.
No-code
03
38
Landing Pages sin códigoimanolteran.com
• Carrd 🥇
• Umso 🥈
• Landingi
• Weblium
• Launchaco
No-code
03
39
HERRAMIENTAS NO-CODE
Landing Pages sin códigoimanolteran.com
• Sistema de plantillas.
• Landings responsive.
• Dominio carrd.co
• Dominios personalizados.
• Formularios de contacto.
• Formulario de registro a lista de correo.
No-code
03
40
CARRD 🥇
Landing Pages sin códigoimanolteran.com
• Pago mediante Stripe, Gumroad y Paypal.
• Inscrustar HTML.
• Tracking mediante Analytics.
• Posibilidad de quitar marca Carrd.
• Gratuito / $9-$453 al año.
No-code
03
41
CARRD 🥇
Landing Pages sin códigoimanolteran.com
• Generación de landings de forma automática.
• Indicamos paso a paso las funcionalidades:
• Tipo de producto/servicio vamos a promocionar.
• Tipo de secciones de contenido.
• Tipo de imágenes que queremos mostrar.
• Estilo.
No-code
03
42
UMSO
Landing Pages sin códigoimanolteran.com
• Una vez seguidos los pasos del Configurador, pasamos a trabajar en el Editor.
• Introducimos contenido, estructura se ajusta de forma automática.
• Previsualización en tiempo real.
• Estilos globales.
• Colores, fuentes, border…
No-code
03
43
UMSO
Landing Pages sin códigoimanolteran.com
• Una vez seguidos los pasos del Configurador, pasamos a trabajar en el Editor.
• Librería de elementos.
• Ilustraciones, iconos y mockups.
• Autoguardado.
• Restaurar cambios.
• Soporte para markdown.
No-code
03
44
UMSO
Landing Pages sin códigoimanolteran.com
• Posibilidad de alojar la landing directamente en los servidores de la plataforma:
• SSL Let´s Encrypt.
• Compresión GZIP en servidor.
• Carga rápida.
No-code
03
45
UMSO
Landing Pages sin códigoimanolteran.com
• Otras caraterísticas:
• Funcionalidad de blog.
• Generar listas de correo dentro de la propia plataforma.
• Analítica propia.
No-code
03
46
UMSO
Landing Pages sin códigoimanolteran.com
• Integraciones con servicios externos:
• Zapier.
• Stripe.
• Mailchimp.
• Google Analytics.
• Facebook Pixel.
• …
No-code
03
47
UMSO
Landing Pages sin códigoimanolteran.com
• Integraciones con servicios externos:
• Zapier.
• Stripe.
• Mailchimp.
• Google Analytics.
• Facebook Pixel.
• …
No-code
03
48
UMSO
Landing Pages sin códigoimanolteran.com
• Diferentes planes de precios:
• Gratuito.
• $29-$99 al año.
No-code
03
49
UMSO
Landing Pages sin códigoimanolteran.com
• Sistema de plantillas.
• Editor Drag&Drop.
• Publicar desde la plataforma.
• Dominio propio.
• Incrustar en WordPress (plugin).
No-code
03
50
LANDINGI
Landing Pages sin códigoimanolteran.com
• Integración con servicios de terceros:
• Zapier.
• Mailchimp.
• Hubspot.
• Google Analytics.
No-code
03
51
LANDINGI
Landing Pages sin códigoimanolteran.com
• Tests A/B.
• Herramientas para conversión.
• Formularios.
• Página de agradecimiento.
• A partir de $29.
• 14 días de prueba.
No-code
03
52
LANDINGI
Landing Pages sin códigoimanolteran.com
• Sistema de plantillas.
• Diferentes tipos de bloques.
• Diseño responsive.
• Certificado SSL.
• Acceso a imágenes de stock.
No-code
03
53
WEBLIUM
Landing Pages sin códigoimanolteran.com
• Definir estilos a nivel global de la landing.
• Integraciones con servicios de terceros:
• Zapier.
• Telegram.
• Mailchimp.
• …
No-code
03
54
WEBLIUM
Landing Pages sin códigoimanolteran.com
• Analítica de datos:
• Google Analytics.
• Hotjar.
• Facebook Pixel.
• Fuentes personalizadas.
• Gratuito / $8,25 al mes / $196 pago único.
No-code
03
55
WEBLIUM
Landing Pages sin códigoimanolteran.com
• Creación de landing page de forma automática.
• Selección tipo de proyecto.
• Selección de paleta de colores.
• Seleccionar tipo de fuente.
• Rellenar opciones para sección principal de la landing.
• Call to action principal
No-code
03
56
LAUNCHACO
Landing Pages sin códigoimanolteran.com
• A partir de ahí, podemos añadir elementos adicionales:
• Tablas de precio.
• Testimonios.
• FAQs.
• CTA.
• …
No-code
03
57
LAUNCHACO
Landing Pages sin códigoimanolteran.com
• Sitios ilimitados.
• Integración con Analytics.
• Let´s Encrypt SSL.
• Gratuito - $49.99/año
No-code
03
58
LAUNCHACO
Landing Pages sin códigoimanolteran.com
INFORMACIÓN COMPLEMENTARIACREA PROTOTIPOS DE APPS TOTALMENTE FUNCIONALES SIN CONOCIMIENTOS DE PROGRAMACIÓN CREA UNA LANDING PAGE PARA PROMOCIONAR TU PRODUCTO O SERVICIO EL FENÓMENO “NO-CODE” HA VENIDO PARA QUEDARSE APPGYVER. DESARROLLO DE APPS MULTIPLATAFORMA PROFESIONALES SIN CÓDIGO
Landing Pages sin códigoimanolteran.com
PRÓXIMOS CURSOSSTRIPE WEBFLOW ZOOM NOTION CUSTOM POST TYPES EN WORDPRESS TELETRABAJO Y TELEFORMACIÓN
