El diseño de la página de inicio (o página de inicio) es el diseño visual y estructural de la primera página de un sitio web que los visitantes ven cuando visitan el sitio por primera vez. La página de inicio juega un papel clave en la creación de la primera impresión del sitio y ayuda a los visitantes a encontrar la información que necesitan o navegar más a través del recurso.

 

1. Diseño de la página de inicio de Shopify

Como muchas de las otras páginas de destino de esta publicación, la página de destino de muestra Shopify lo hace simple. Por ejemplo, el título centrado en el usuario consta de solo unas pocas palabras y la página se basa en viñetas simples en lugar de párrafos para transmitir los detalles y beneficios de la prueba. Sólo hay unos pocos campos que deben completarse antes de comenzar. Todo esto te facilita vender online utilizando tu herramienta.

Registro de la página de destino de Shopify

 

2. Diseño de la página de inicio de Bozal

Las páginas de destino ayudan a los usuarios a decidir si su producto o servicio vale su valioso tiempo y energía. ¿Qué mejor manera de comunicar su propuesta de valor de forma clara y directa que relacionar a sus visitantes con el problema que resuelve su aplicación?

Los comentarios de Instagram obtienen más

BozalUna aplicación para Mac que silencia las notificaciones en pantalla cubre completamente esto mostrar sin decir mentalidad en su página de destino mínima. Los visitantes de esta página son recibidos por una rápida descarga de notificaciones incómodas en la esquina superior izquierda de la pantalla. La animación no sólo es divertida, sino que también transmite de forma convincente la utilidad de la aplicación sin largas descripciones.

Diseño de página de inicio 11

 

 

3. Diseño de la página de inicio de TransferWise

TransferWise le permite enviar y recibir dinero en varias monedas, y su página de inicio, que se muestra a continuación, desglosa cada acción individual para que no se distraiga con opciones que no se aplican a su caso.

Si desea enviar dinero, puede completar el formulario de transferencia. Para recibir dinero, simplemente vaya a la pestaña del medio y para registrarse en TransferWise usando su tarjeta de débito, vaya a la pestaña del extremo derecho.

Cada pestaña de esta página de destino crea su propia llamada a la acción dependiendo de en qué te estés inscribiendo, cada uno con un marco verde brillante para resaltar tu siguiente paso después de tres posibles puntos de partida.

Diseño de la página de inicio de TransferWise

 

4. Diseño de la página de inicio de Airbnb

Para ayudar a convertir a los visitantes en anfitriones, Airbnb ofrece una personalización tentadora: una estimación aproximada de los ingresos promedio según su ubicación. Puede ingresar información adicional sobre su ubicación potencial en los campos para obtener una evaluación aún más personalizada.

Si ya visitó una página de la que está convencido, un llamado a la acción claro en la parte superior de la página facilita la conversión en el momento.

Diseño de la página de inicio de Airbnb

 

5.bit de equipo

peculiar No suele ser la primera palabra que te viene a la mente cuando piensas en software de recursos humanos, pero la página de inicio visual de Teambit es solo eso. Un formulario simple con un campo va acompañado de una adorable oficina llena de personajes animales, todos ellos. muy contento con Teambit, si estás interesado. Aparece un animal de dibujos animados junto a cada sección de información de la página de destino, lo que incita a los visitantes a desplazarse hacia abajo para obtener más información. Diseño de página de inicio

Página de destino Equipo es una gran prueba de que no es necesario tener un producto o servicio “divertido” para crear una página de destino divertida.

Página de inicio de Teambit con CTA

 

 

6. Diseño de la página de inicio de Wistia

Primero que nada, esta es la página de inicio. Wistia para su cuenta gratuita de Wistia. Inmediatamente notará el formulario con un campo para crear una cuenta: el fondo azul con un diseño minimalista contrasta muy bien con el campo del formulario blanco brillante.

La longitud del campo del formulario combinada con una ubicación destacada elimina casi todas las fricciones al crear una cuenta... pero si tiene dudas, siempre puede desplazarse hacia abajo para leer las preguntas frecuentes. Al separar los dos con un fuerte contraste de color, Wistia facilita mucho el proceso de conversión.

página-de-aterrizaje-wisita

 

7. Flujo web. Diseño de página de inicio

Webflow, una herramienta de diseño para desarrolladores web, incluye mucha información en un GIF y tres campos de formulario. Sería bueno tener todo el formulario de registro en una sola línea; no solo hace que la página sea más corta, sino que completar cada campo de izquierda a derecha muestra a los usuarios qué tan cerca están de hacer clic en el cuarto botón azul y comenzar de forma gratuita.

El GIF animado debajo del formulario se muestra en el mismo marco en el sitio web para que los usuarios puedan ver cómo funciona el producto. и registrarse sin desplazarse o ir a una nueva página.

Flujo web. Diseño de página de inicio

 

Diseño de página de inicio de libro electrónico.

8. Diseño de la página de inicio de Nauto

nautico, una plataforma de datos sobre vehículos autónomos, está ayudando a que la conducción autónoma sea más segura para las empresas que gestionan flotas. Naturalmente, sus clientes necesitarán toda la información para vender en esta plataforma. Nauto lo tiene super sencillo libro electronico, cuya página de inicio le ofrece un breve formulario de contacto y estadísticas previas para demostrar por qué este recurso es tan importante.

Página de inicio del libro Nauto

 

Es posible que el botón verde "Descargar ahora" haya sido intencionado (después de todo, verde significa "ir").

Desplácese hacia abajo y verá otra CTA "Obtener libro electrónico" para recordar a los usuarios lo que hay en la tienda. También verá tres estadísticas discordantes sobre accidentes automovilísticos para alentar a los usuarios a obtener más información. Compruébalo a continuación.

nauto-book-airborne-page-STA-1

 

9. Diseño de la página de inicio de marketing industrial sólido

Esta página de destino me atrae inmediatamente con su título irresistible y contundente: "No me obligues a hacer zoom". Esto habla directamente de la experiencia general que tenemos la mayoría de nosotros cuando navegamos por nuestros teléfonos o tabletas, y también es un poco descarado.

Pero eso no es lo único que me interesó en esta página de destino. Observe cómo el color rojo está estratégicamente ubicado en la parte superior e inferior del formulario, acercándolo aún más al evento de conversión.

marketing-landing a nivel industrial

 

Además, este diseño es meta para empezar: se ve y funciona muy bien en dispositivos móviles. Tenga en cuenta que muchos visitantes accederán a sus páginas de destino desde sus teléfonos inteligentes o tabletas, y si diseño de tu sitio web no les conviene, pueden darse por vencidos y abandonar su página.

Los especialistas en marketing de fuerza industrial llegaron al campo fuentes y formularios lo suficientemente grandes como para que los visitantes no tengan que hacer zoom, por ejemplo, para leer e interactuar con el contenido.

marketing-a nivel industrial-página-de-aterrizaje-móvil

 

 

10. Chat en vivo de Velaro

A veces los detalles más pequeños marcan la mayor diferencia. Por ejemplo, son ellos quienes hacen la página de destino. Chat en vivo de Velaro asombroso.

Ese pequeño símbolo de PDF encima de la imagen del elemento ayuda a determinar en qué formato se realizará la descarga. Una flecha antes del subtítulo ayuda a resaltar aún más la copia importante que los visitantes desean leer. Al igual que IMPACT, también tienen una casilla de verificación marcada automáticamente para suscripciones al boletín en su formulario, lo cual, si se convierte en una casilla de verificación adicional, es una excelente manera de aumentar el número de suscriptores. Todos estos pequeños detalles, aparentemente insignificantes, ayudan a crear un diseño de página de destino sólido y sorprendente. Diseño de página de inicio

Velaro-landing-page-ejemplo

 

11. IMPACT Branding y diseño / Diseño de página de inicio

 Hogar IMPACTO han sido durante mucho tiempo una fuente de inspiración para los diseñadores. Me encanta el diseño simple de la página, desde el título grande y la imagen detallada, hasta el contorno que rodea la forma, hasta los colores y fuentes que son muy agradables a la vista.

El manual gratuito que IMPACT ofrece para descargar aquí tampoco resalta la descarga en sí en el botón azul que le permite enviar el formulario completo. Más bien, IMPACT lo invita a "generar más conversiones" centrándose en lo que puede obtener al leer la guía.

IMPACT Branding y Diseño/Diseño de Página de Inicio

 

Páginas de destino para obtener más información

12. Descartar

No es sorprendente que la Unbounce está en la parte superior de esta lista: realmente escribieron el libro sobre la creación de páginas de destino de alta conversión. Si bien hay muchas cosas sorprendentes acerca de esta página de destino, dos que realmente me gustan son: 1) el uso de un cuadro de chat en lugar de un formulario clásico, y 2) la información detallada, pero bien empaquetada, debajo del formulario/Inicio. Diseño de página

El primero ayuda a dirigir la atención al propósito de la página (que usted complete un formulario) de una manera discreta y que no parezca una tarea ardua. El segundo le da a esa página un impulso de SEO (los motores de búsqueda tendrán más contenido para rastrear) y elimina la ansiedad de las personas que necesitan saber más sobre un contenido antes de enviar su información, sin distraer a las personas de la ventana de chat.

 

13. Facturas.com. Diseño de página de inicio

La gente suele pensar que las páginas de destino son páginas estáticas de su sitio web. Pero con las herramientas adecuadas, puedes hacerlos interactivos y personalizados.

Tome el siguiente ejemplo con Facturas.com. Para saber si se beneficiaría de su consulta, responda tres preguntas antes de que le muestren el formulario. Comienza con esto:

 

Luego respondes dos preguntas más como la siguiente:

 

Y aquí está el formulario de la página de destino final donde puede completar su información:

Diseño de página de inicio 33

 

No estoy seguro de cómo funciona el algoritmo (o si existe alguno), pero mientras lo completaba tenía cierta preocupación sobre no calificaciones. Una vez que descubrí lo que hice, me emocionó completar el formulario, lo cual estoy seguro que hace la mayoría de las personas que tienen deudas y usan esta herramienta. Al hacer que esta oferta sea más exclusiva antes de que el formulario aparezca en la página de destino, apuesto a que Bills.com mejorará significativamente mayor conversión.

14. Diseño de la página de inicio de Trulia

Trulia hizo algo muy similar a Bills.com con su página de inicio. Comienza con un formulario simple que solicita "dirección" (que suena menos espeluznante que "su dirección", aunque eso es lo que quieren decir). Debajo de este campo de formulario simple hay un botón naranja brillante que contrasta bien con la imagen del personaje detrás del formulario y enfatiza que el presupuesto se personalizará para su hogar.

Por supuesto, la dirección en sí no es suficiente para estimar el valor de la casa. Simplemente denota el entorno de la casa. Es por eso que la página siguiente incluye preguntas adicionales sobre la propiedad en sí, como la cantidad de habitaciones y baños. A continuación puede ver una copia de "Díganos dónde enviar el informe", con el descargo de responsabilidad de que al ingresar esta información usted acepta comunicarse con el agente de bienes raíces. Este es un gran ejemplo de cómo una empresa valora a sus visitantes desde el principio y, al mismo tiempo, establece las expectativas de los visitantes sobre lo que sucederá como resultado.

Página de inicio de Trulia

 

15. Diseño de la página de inicio de Landbot

robot terrestre, un servicio que crea páginas de inicio basadas en chatbot, coloca su propio producto en el centro de su página de inicio basada en chat. Los visitantes son recibidos por un robot amigable, completo con emojis y GIF, que los alienta a proporcionar información en un formato conversacional en lugar del formato tradicional.

Diseño de la página de inicio de Landbot.

 

16. Beneficios web

Para poner un poco de contraste... ¿qué pasa con las páginas de destino largas? Con solo unos pocos trucos, puedes hacer que incluso la página de destino más larga parezca corta. La página de inicio de Webprofits a continuación muestra cómo hacer esto. Diseño de página de inicio

Hay un botón de CTA destacado en la parte superior derecha para obtener más información, con un buen contraste en el fondo para que se destaque y una flecha hacia abajo para fomentar el desplazamiento. Al no colocar el campo del formulario al principio, ayudan a reducir la fricción y brindan a los visitantes la oportunidad de obtener más información antes de que se les presente una opción de conversión.

También te permiten entender lo que es realmente delatar Webprofits El resto de la página proporciona detalles de lo que recibirá cuando envíe su información. Además, incluye CTA estratégicas para ayudarte a regresar a la parte superior para completar el formulario, como "Hablemos".

Diseño de página de inicio 67

 

17. H.BLOOM

A veces solo necesitas detenerte y admirar una página de destino por lo hermosa que es. Cuando se utiliza una foto de alta resolución y mucho espacio en blanco en la página de destino H.BLOOM agradable a la vista.

Más allá de su belleza, la página tiene algunos elementos de conversión excelentes: un formulario general, una descripción clara y concisa de lo que sucederá cuando complete el formulario e incluso un botón naranja brillante "Enviar". ¿Lo único que cambiaremos? Copiar en el botón Enviar: esto puede ser más específico para la propuesta que se ofrece. Diseño de página de inicio

Diseño de página de inicio de hbloom.

 

18. Laboratorio de conversión

Si bien no incluiría una publicación de formulario de ejemplo en una publicación sobre páginas de destino, este sitio es especial. Inicio es el sitio completo; los enlaces de navegación simplemente lo llevarán a la información a continuación. Diseño de página de inicio

Cuando hace clic en "Obtener ayuda en las páginas de destino", todo el sitio se mueve para dejar espacio para el formulario. Así es como se ve antes de hacer clic:

página de inicio del laboratorio de conversión

 

Y, cuando haces clic en esa CTA, mira cómo se ve el formulario:

Diseño de página de inicio 121

 

Me gusta que no es necesario salir de la página para completar el formulario, pero el formulario no será intrusivo para los visitantes ocasionales del sitio.

Ideas/Diseño de página de inicio

Una página de inicio bien optimizada puede convertir a los clientes en clientes potenciales al capturar información que lo ayudará a comprender, comercializar y deleitar mejor a sus visitantes. Dado que las páginas de destino son fundamentales para las conversiones, es importante asegurarse de que estén bien planificadas, diseñadas y ejecutadas. Aquí hay algunas cosas a considerar al crear objetivo páginas: Estética atractiva: sólo el color de su página de destino y una interfaz de usuario limpia pueden ayudar. Los visitantes querrán saber más sobre sus productos y ver evidencia del valor que ofrece. Eche un vistazo al número 10 de nuestra lista, Inbound Emotion, para ver un gran ejemplo de una página web increíble.
Menos es más: deje que la oración o las imágenes hablen la mayor parte, pero asegúrese de incluir todos y cada uno de los titulares descriptivos y el texto de respaldo para que su página de destino sea clara y convincente. Esto se aplica a casi todos los componentes de la página: espacios en blanco, texto simple y formularios más cortos.

Diseño de página de inicio

Mantenga a los visitantes en la página: al eliminar la navegación principal o cualquier vínculo de retroceso que distraiga, es menos probable que se produzca algún tipo de fricción en la generación de leads que pueda llevar a los visitantes a abandonar su página.
Compartir en redes sociales. Una forma sencilla de atraer visitantes a su página de destino es mediante el uso de botones para compartir enredes sociales, para que puedan distribuir su contenido a sus seguidores en las redes sociales. Después de todo, los clientes son el centro de su volante de marketing.
Pruebas A/B: es importante que las páginas de destino funcionen correctamente y, dado que la psicología del consumidor a veces puede ser sorprendente, siempre es mejor experimentar con diferentes versiones de sus páginas para ver cuál tiene la tasa de conversión (CVR) más alta. Comprueba el posicionamiento de la oferta, los tipos de CTA o incluso la combinación de colores.
Call-To-Action: CTA, donde el meollo está en la página de destino, o el punto de inflexión, donde está la perspectiva de convertirse en contactos. Las CTA pueden pedir a los visitantes que se suscriban, descarguen, completen un formulario, compartan redes sociales etc., pero en general, las CTA son necesarias para involucrar a su audiencia de manera más activa con su oferta. Para generar clientes potenciales, las CTA deben ser audaces y atractivas, pero lo más importante es que deben transmitir valor de manera efectiva.

АЗБУКА