DE
BR
Above the fold: Definición
El significado original de «Above the fold» se refería al primer pliegue de los periódicos. Los periódicos se presentaban en los quioscos doblados por la mitad para que el lector pudiera leer el titular superior de un vistazo.
En el mundo digital, » above the fold » en una página web significa el contenido que el visitante ve cuando se carga la página antes de desplazarse hacia abajo.
Importancia de la sección «above the fold»
La sección «above the fold», o «first fold» como también se le llama, es importante porque es la primera parte de la página web que ven los visitantes. Por eso debe ser llamativa, atractiva y capaz de captar la atención del visitante.
La sección «above the fold » debe incluir contenido interesante e importante y estar en consonancia con los objetivos de tu negocio. Por ejemplo, para una página web de eCommerce, colocar sus últimas ofertas «above the fold» puede conducir a un aumento de clientes potenciales y conversiones.
Above the Fold y la optimización para motores de búsqueda (SEO)
Según Google, si tu página no tiene un cierto grado de contenido en el primer pliegue, tu ranking puede sufrir, y en el caso de una página web nueva también se convertirá en un problema para posicionar la página. Como Google quiere ofrecer a sus usuarios la mejor experiencia y la información relevante de inmediato, ha recomendado incluir fragmentos relevantes de información en el «first fold».
Además, para las empresas que dependen de los anuncios para sus ingresos, si en los primeros pliegues aparecen grandes bloques de anuncios y esto dificulta que el visitante encuentre el contenido original de la página, este algoritmo de diseño de página tenderá a afectar a la clasificación de estas páginas.
Optimizar la sección «Above the Fold»: Mejores prácticas
Cuanto más sencilla sea la página, más podrá captar la atención del visitante. A continuación vamos a ver algunas de las mejores prácticas que te ayudarán a optimizar la sección above the fold en tus páginas de aterrizaje.
1. Título de la página (H1) y texto principal
El H1 de la página debe ser claro, conciso y convincente. El texto principal debe contener el punto de venta único (USP). El encabezado y el texto principal deben explicar claramente a los visitantes lo que ofreces y cómo puedes resolver sus problemas.
2. Los CTA adecuados
Dependiendo de los objetivos de tu empresa y de tu público, es importante crear los CTA adecuados y colocarlos en la parte correcta de la página web. Por lo general, los CTA se colocan en la esquina superior derecha de la página para que sean fáciles de encontrar y realizar acciones como » Contactar con nosotros», «Prueba gratuita» o «Añadir al carrito».
3. El tiempo de carga de la página es la clave para las conversiones
El tiempo de carga de la página es lo más crucial tanto para la optimización de motores de búsqueda (SEO) como para la optimización de la tasa de conversión (CRO). Un visitante tarda menos de un segundo en formar su primera impresión de tu página web, por lo que el contenido de la parte superior debe cargarse antes que el resto de la página. Eliminar JavaScript innecesario de la cabecera y optimizar el CSS ayudará a disminuir el tiempo de carga de la página.
4. Elimina todas las distracciones
Quieres que tus visitantes se sientan atraídos por el texto que has escrito en el primer pliegue, ¿verdad? Evita añadir demasiados elementos en la parte superior de la página. Demasiadas imágenes, vídeos, sliders, pop-ups pueden distraer al usuario y hacer que abandone la página. Sigue siempre la regla general: muestra primero la información más importante.
5. Optimización de imágenes
Utilizar imágenes en el «first fold» es muy habitual, pero hay que tener en cuenta que un mayor número de imágenes aumenta el tiempo de carga de la página. Se aconseja optimizar las imágenes descomprimiéndolas y subiéndolas en formatos actuales (webp, png) para poder cargar rápidamente una imagen de alta calidad.
Aunque recomendamos seguir estas prácticas, lo que funciona para una empresa no es lo mismo que para otra. Sólo hay una forma segura de identificar lo que funciona para tu empresa: los tests A/B.
Cómo realizar un test A/B del diseño Above the Fold
Ahora que ya sabes qué es exactamente la sección «above the fold» y cómo puedes optimizarla, es importante que pruebes qué es lo que funciona mejor antes de ponerlo al alcance de todos tus visitantes.
¿Cómo mejor que con un test A/B? Para poner a prueba tus encabezados y el texto principal, puedes configurar fácilmente un test A/B utilizando VWO Testing y ver qué versión de tu página funciona mejor. Pruébalo ahora. No necesitarás ayuda de un desarrollador para hacerlo.
Elegant Steps probó elementos «above the fold» en su página web con VWO y mejoró sus conversiones en un 200%. La USP principal de Elegant Steps, es decir, el envío gratuito, no aparecía en la parte superior en los dispositivos móviles. Se planteó la hipótesis de que mostrar «Envío gratuito» above the fold ayudaría a reducir la tasa de rebote y animaría a los usuarios a continuar por el embudo de conversión. Los resultados llegaron en un mes y fueron muy positivos. La tasa de conversión móvil aumentó un 200%.
Ejemplos de secciones «above the fold»
A continuación tenemos algunos ejemplos para que te hagas una idea de cómo es una buena sección «above the fold»:
- Grammarly tiene un titular claro, con un texto principal conciso que transmite su USP y un CTA obvio que pide al visitante que se descargue la aplicación.
- La página web de Facebook también tiene un texto claro sobre la USP de la empresa y un formulario de registro que anima al visitante a interactuar con la página.
