Diseño de la página de destino: 12 reglas importantes con ejemplos reales

En nuestro artículo anterior sobre las páginas de destino, analizamos 8 factores principales que deben considerarse al crearlos. En este momento, decidimos elaborar el diseño de las páginas de destino. Dado que el diseño de las páginas web está inextricablemente vinculado al contenido, también examinaremos algunos puntos relacionados con el contenido de las páginas de destino.

Seguramente, usted conoce el propósito principal de la página de destino: inducir a un visitante del sitio a tomar una determinada acción (por ejemplo, comprar su producto o suscribirse al boletín). En la implementación de este objetivo, el diseño de alta calidad no desempeña el último papel. Él es capaz de centrar la atención de los clientes potenciales en su llamado a la acción, para hacerlo más visible. Además, simplifica la percepción de toda la información publicada en la página de destino.

Y ahora, de las palabras - a los negocios. Considere reglas específicas, después de las cuales puede mejorar el diseño de su página de destino y, por lo tanto, aumentar el nivel de conversión en su sitio web.

1. Cuida la usabilidad de tu landing page.

Entrando en su página de destino, el visitante del sitio debe entender inmediatamente:

  • destino de página
  • acción que debe tomar
  • los beneficios que su producto traerá

Si no cumple con estos requisitos, puede considerarse inútil. No obligue a los visitantes a su sitio a vagar por el laberinto de su página de destino. Créeme, no querrán pasar su tiempo en eso y simplemente agitarte un bolígrafo. Como resultado, su sitio solo aumentará la tasa de rebote, y un aumento en la tasa de conversión seguirá siendo un sueño inalcanzable.

Este es un ejemplo de una página de inicio exitosa, tomada del sitio FeedMyInbox, que incluso un escolar manejará:

2. No uses demasiados gráficos.

Su página para llamar a la acción debe contener solo los elementos gráficos necesarios. Las imágenes excesivas solo lo saturarán, especialmente si están ubicadas en el área de la "primera pantalla". En la mitad superior de la barra de desplazamiento solo debe haber un logotipo y una imagen estilizada del producto que desea vender.

Junto con estas imágenes, también se permiten imágenes que muestran las ventajas o características de su producto. Tenga cuidado al utilizar los iconos. En algunos casos, no aportarán ningún beneficio, sino que solo distraerán la atención de los clientes potenciales.

Considere la página de destino del sitio web de Dialogix, que ofrece un servicio web para monitorear redes sociales:

Como puede ver, no hay elementos gráficos adicionales en la página. Contiene solo el logotipo del programa, su captura de pantalla, los íconos de las empresas clientes, así como la imagen de un pájaro lindo que simboliza Twitter.

3. Minimizar las opciones de navegación

Cuantas más opciones de navegación ofrezca a los visitantes de su sitio en su página de destino, mayor será la probabilidad de que los utilicen. Su página de inicio puede contener docenas de enlaces de navegación, pero la página de destino solo debe indicar una dirección para los clientes potenciales, ya que es el elemento inicial del embudo de ventas.

Si no puede prescindir de los enlaces a otras áreas de su sitio, piense cómo reducir la probabilidad de que los visitantes del sitio hagan clic en ellos. Por ejemplo, puede dejar solo la barra de navegación superior y eliminar completamente algunos enlaces. Los enlaces de navegación son necesarios solo si los visitantes del sitio tienen una razón seria para hacer clic en ellos. Si cree que es poco probable que los clientes potenciales busquen dichos enlaces, no puede incluirlos.

Los creadores de la aplicación eWedding, con la que puede crear su propio sitio web dedicado a su boda, han adoptado esta regla. En la página de destino de su sitio, solo son visibles los enlaces relacionados con el producto en sí (por ejemplo, las características de la aplicación o las variaciones del tema). Y los otros enlaces se encuentran en un lugar apartado: en la parte inferior de la página. Además, están impresos en letra pequeña:

4. Usa ventanas modales.

Cuando publique información o algunos enlaces que puedan interesar a los visitantes de su sitio, intente usar ventanas modales en lugar de redirigirlas a una nueva página. Las ventanas modales pueden proporcionar a los clientes potenciales cualquier información sin interrumpir el embudo de conversión.

Las ventanas modales y la información sobre herramientas pueden contener preguntas frecuentes, listas de características del producto, capturas de pantalla, etc. Utilícelos en la primera oportunidad conveniente, para no suspender el proceso de convertir a los visitantes del sitio en compradores reales.

Por ejemplo, en la página de venta del programa Capo que crea espectrogramas de archivos de música, se utiliza una ventana modal en forma de captura de pantalla de su interfaz:

5. Evite el rojo en el botón de llamada a la acción.

En muchas culturas, particularmente en los Estados Unidos y los países europeos, el rojo tiene una connotación negativa. En su imagen del mundo, el rojo es el color de la agresión, el peligro y el semáforo. Incluso en las connotaciones más positivas (pasión y amor), los tonos de rojo causan ansiedad en las personas. A partir de aquí, una conclusión: si su sitio está destinado a la audiencia europea y estadounidense, rechace el uso de un fondo rojo en el botón de llamada a la acción. Quizás, en algunos casos, saldrá con la suya, pero no vale la pena correr el riesgo. Utilice mejor los colores más tranquilos, como el azul o el verde (como se hace en la aplicación de planificación del tiempo de cosecha):

6. Haga visible el botón de llamada a la acción.

Entonces, descubrimos que el fondo rojo no es la mejor solución para llamar la atención sobre el botón de llamada a la acción (consulte el párrafo anterior). Pero hay otro extremo: el uso de colores demasiado pálidos o letra pequeña, por lo que se pierde literalmente en su página de destino. El botón de llamada a la acción debe ser un punto brillante en su página de destino para que los visitantes del sitio puedan notarlo incluso a simple vista.

El grado de "visibilidad" del botón de llamada a la acción se puede evaluar con una simple prueba visual: retroceder aproximadamente un metro y medio desde la pantalla de la computadora y responder honestamente a la pregunta: "¿Está el botón de llamada a los ojos claro a los ojos?" Si no puede decir que sí con confianza, entonces su botón de llamada a la acción debe funcionar.

Es posible que deba cambiar su color para que contraste con el fondo de la página, o aumentar ligeramente el tamaño de la fuente. Algunos diseñadores web descuidados incluso logran colocar el botón de CTA fuera de la "primera pantalla", y luego todavía se sorprenden de que las tasas de conversión de sitios web no despeguen. Para no repetir sus errores, considere cuidadosamente todos los aspectos del botón de llamada a la acción.

Tome un ejemplo de los diseñadores del sitio Plnnr, que realiza excursiones individuales a diferentes ciudades. ¡Su botón amarillo, ubicado sobre un fondo gris, es simplemente imposible de no notar!

7. Especifique solo información de interés para los visitantes del sitio.

Proporcione a los visitantes de su sitio web solo la información que necesitan para tomar una decisión. No sobrecargue sus cabezas con demasiada información. Su objetivo es convertir a los clientes potenciales en compradores reales con la cantidad mínima de información.

Piense en la información en la que podrían estar interesados ​​sus clientes potenciales y exprésela con palabras precisas y comprensibles. Tu texto debe ser corto y tocar el punto. Los consumidores modernos realmente valoran su tiempo, por lo que inmediatamente querrán saber si su oferta satisface sus necesidades. Si no lo hacen en segundos, abandonarán su sitio sin dudarlo.

Además, el texto presentado en la página de destino debe tener una estructura clara (título, subtítulo, listas con viñetas). Sujeto a esta condición, los visitantes del sitio podrán hojear toda la página y seleccionar solo la información de interés.

Eche un vistazo a la página de inicio del editor de texto en línea TitanPad. Como puede ver, solo contiene la información necesaria (funciones de la aplicación y un claro llamado a la acción):

8. No solicite demasiada información.

Al crear un formulario de suscripción, intente minimizar la información que solicita a los visitantes de su sitio. En la mayoría de los casos, basta con pedirles una dirección de correo electrónico. Si necesita otros datos personales de sus clientes potenciales, por ejemplo, un número de teléfono móvil, debe explicar por qué solicita esta información.

Nuevamente, esto es necesario para que los visitantes de su sitio tengan menos razones para dejarlo. Después de todo, casi todas las personas tienen dudas sobre cómo utilizará sus datos personales. ¿Qué pasa si empiezas a llenar su casilla de correo electrónico con spam? ¿O le enviará un mensaje de texto, saturando su teléfono móvil con información innecesaria?

Cualquier información adicional que solicite a los visitantes del sitio es otro obstáculo para convertirse en sus clientes. Y mientras más obstáculos haya en su camino, mayor será la probabilidad de que no alcancen su destino final.

Afortunadamente, muchos desarrolladores web son conscientes de esta simple verdad y tratan de no obtener información adicional de clientes potenciales. En algunos sitios, no solicitan ningún tipo de información personal: simplemente se registra y continúa su trabajo. Tomemos, por ejemplo, el blog de Pen.io. Todo lo que se requiere de usted es que ingrese el nombre de su página y una contraseña, e inmediatamente puede comenzar a crear una publicación:

9. No preguntes a los visitantes del sitio c todos a la vez.

Imagine que un cliente potencial llega a su sitio e inmediatamente ve un gran botón brillante que pide un determinado producto para comprar. ¿Cuál será su reacción? En el mejor de los casos, tendrá una serie de preguntas, tales como: "¿Qué me sugieren que compre?" o "¿Cuánto cuesta este producto?". Y en el peor de los casos, cerrará de inmediato su página de destino, pensando que quieren empujar una cosa inútil sin siquiera preguntarle si la necesita.

Por lo tanto, no comience a hablar inmediatamente sobre la compra, si no quiere asustar a sus clientes. Divida el proceso de compra en 2 o 3 pasos para que aprendan la información necesaria antes de tomar una decisión final. De lo contrario, tendrán la impresión de que les está imponiendo su producto.

El botón de llamada a la acción debe contener frases más neutrales, por ejemplo, "Ver precios y planes de tarifas" u "Más información". Contienen menos subtexto forzado que en Comprar ahora o Suscribir expresiones. Además, gracias a ellos, los visitantes del sitio entienden lo que deben esperar en el siguiente paso.

Los desarrolladores del complemento VaultPress diseñado para admitir sitios de WordPress han aplicado esta regla con éxito en la práctica:

10. Apunta a un diseño simple y ordenado.

Todos los aterrizajes tienen un objetivo específico: animar a los visitantes del sitio a realizar una acción específica. Si ciertos elementos de diseño no contribuyen a la implementación de esta tarea, puede deshacerse de ellos de manera segura.

Esto no significa que su página de destino esté medio vacía: solo tiene que determinar qué componentes son relevantes y cuáles no. Si confía en que aumentarán la confianza del cliente en su llamada de ventas, les ayudará a comprender mejor su producto y, en general, a mejorar sus impresiones generales de su empresa, la conclusión es obvia: estos elementos deben estar presentes en su página de destino.

Presta atención a la página de inicio de la aplicación Things 2 para iPhone:

Como puedes ver, está hecho de forma sencilla y con gusto. Al mismo tiempo, contiene todos los elementos necesarios: una descripción de la aplicación, sus capturas de pantalla y una llamada a la acción ("Ir a la App Store").

11. Resaltar mejores ofertas.

Si su página de destino contiene varias llamadas a la acción (por ejemplo, tablas con diferentes planes de tarifas), puede solicitar a los visitantes de su sitio la opción más rentable o popular utilizando herramientas gráficas. Por ejemplo, puede resaltar la oración correspondiente en el marco o hacer que su fuente sea más grande.

No debe resaltar automáticamente la opción más costosa, de lo contrario, los visitantes de su sitio web pensarán que lo está haciendo a propósito para que se conviertan. La mayoría de las compañías enfocan a los clientes potenciales en un plan de tarifas intermedias, que contiene todas las opciones necesarias y al mismo tiempo tiene un precio razonable.

Vea cómo los diseñadores del sitio web de Ning, que ofrecen una aplicación para crear su propia plataforma social, hicieron esto:

Como puede ver, han elegido un fondo más oscuro para el plan de tarifas Performancé, que pertenece a la categoría de precio medio. Además, se encuentra en el centro de la pantalla, el área más visible de la página. Preste atención al icono de elección popular, que indica la popularidad de este plan de tarifas.

12. Informe sobre los beneficios de su producto.

La pregunta principal que interesa a los visitantes de su sitio: "¿Qué beneficios obtendré de este producto?" No es suficiente enumerar sus características y funciones generales, debe indicar cómo puede ayudarlos en la vida real. En primer lugar, usted mismo debe confiar en el valor de su producto para transmitir esta idea a sus clientes potenciales con la ayuda de un título brillante, texto claro y una estructura de contenido óptima en la página de destino.

En general, no dude en elogiar su producto de acuerdo con sus méritos, como lo hacen, por ejemplo, los desarrolladores de la aplicación Skylight:

No te olvides de probar las landing pages.

Por lo tanto, analizamos una docena de recomendaciones para el diseño de páginas de destino y les proporcionamos ejemplos reales a seguir. Esperamos que te inspiren para mejorar aún más sus páginas de destino.

Sin embargo, no se olvide de otra etapa importante en la creación de páginas de destino: A / B-testing. Cualquier cambio que realice en el diseño de su aterrizaje, de una forma u otra, conducirá a ciertos resultados. Pueden aumentar o disminuir la tasa de conversión de su sitio o incluso mantenerlo en el mismo nivel. Todo depende de la situación específica.

De ahí la conclusión: no sea perezoso para realizar pruebas A / B antes de detenerse en una versión específica de la página de destino. Tome nota de los resultados de estos estudios y seleccione la opción que está por delante de todos los demás en términos de conversión, incluso si, a primera vista, le pareció poco visible.

Deja Tu Comentario