Si nos remontamos a los primeros días de la publicación, obtenemos el término «above the fold» como un término utilizado para el contenido que aparecía en la mitad superior de la primera página de un periódico. El contenido que aparecía por encima del pliegue era el más visible para los lectores, con titulares pegadizos e imágenes vívidas que se utilizaban habitualmente para atraer la atención de los lectores con la esperanza de que, al pasar por el quiosco, les convenciera de comprar un periódico.
Ahora, avancemos hacia la transición de la apertura a lo digital, ya que esos mismos editores trasladaron sus negocios de la impresión a la red. A medida que el diseño de la web ha ido evolucionando desde principios de los años 90, el término ha seguido vigente. Entonces, ¿qué significa above the fold para tu página de inicio? Y ¿todavía es importante en 2019?
¿Por qué es importante para mi sitio web lo que está por encima del pliegue?
En la era del marketing digital, el pliegue ya no se refiere a un pliegue real en un periódico, sino que se refiere al contenido que se carga primero cuando se visita un sitio web, captando su atención y atrayéndolo.
En el mundo del diseño web, donde te preocupas por la disposición y la colocación del contenido porque el contenido que aparece por encima del pliegue es lo que se ve primero cuando el visitante del sitio web carga la página. Ese contenido es el principal terreno que recibe la mayor parte de la atención de los visitantes de su sitio y la experiencia del usuario debe reflejar eso. Jakob Nielsen estima que «…los usuarios de la web pasan el 80% de su tiempo mirando la información por encima del pliegue de la página». Aunque los usuarios se desplazan más hoy en día, siguen destinando sólo el 20% de su atención por debajo del pliegue»
Primero tienes que preguntarte, ¿cuál es el contenido más importante para ayudarme a alcanzar mis objetivos de negocio?
Una vez que hayas respondido a esa pregunta, sabrás qué colocar en esa zona de alta visibilidad. El contenido debe captar inmediatamente la atención del usuario y presentarle el contenido que está buscando para que no rebote y visite otro sitio.
Consejos rápidos para aumentar las tasas de conversión
- Imagen de héroe: No te pongas demasiado etéreo aquí. ¿Cómo son sus clientes felices? ¿Qué están experimentando? Muestra una imagen que evoque una aspiración positiva.
- Copia del encabezado: No renuncie a la claridad por ser inteligente. Si confunde, pierde. Limítate a un mensaje sencillo que muestre exactamente lo que haces o que empatice con el reto principal al que se enfrentan.
- Llamada a la acción (CTA): Su CTA principal debe ser obvio y colocado en la esquina superior derecha de la navegación Y en la sección de héroe.
- Tagline: Acompañe el texto de cabecera claro con una línea de una o dos frases que posicione su marca para ayudar a resolver el problema de su cliente.
- Navegación: Menos es más. Un buen diseño de sitio web guía al usuario exactamente hacia donde usted quiere que vaya. Demasiadas opciones pueden provocar fatiga en la toma de decisiones.
- Velocidad de carga: El tiempo de carga de su página de inicio podría estar provocando el rebote de los visitantes.
Colocar los anuncios por encima del pliegue mejora su visibilidad y genera más ingresos por publicidad que los anuncios que se colocan en lugares menos visibles.
¿Cómo se mide «el pliegue» en el diseño web?
En resumen, es imposible definir exactamente dónde se coloca el pliegue en su sitio web. La ubicación exacta difiere debido a la variedad de tamaños de pantalla de los monitores (de escritorio y portátiles), las resoluciones de pantalla, los plugins del navegador y los tamaños de varios teléfonos móviles y tabletas.
Como regla general, la mayoría de los diseñadores web están de acuerdo en que la línea de pliegue es de aproximadamente 1000 píxeles de ancho y 600 píxeles de alto. Esta es la mejor estimación a partir de la combinación más común de monitor/navegador de 1024×768 píxeles, con la ventana del navegador maximizada y sin barras de herramientas instaladas en la parte superior que empujen el contenido hacia abajo.
Si tiene curiosidad por saber más, consulte el programa de análisis de su sitio web (si no tiene uno, Google Analytics es un gran lugar para comenzar) que debería ser capaz de decirle cuáles son las dimensiones de pantalla más comunes para sus visitantes. Mientras que el tamaño de pantalla común de 1024×768 ha sido tradicionalmente el adecuado, las nuevas dimensiones están ganando popularidad como 320×568 y 360×640, todo ello debido al aumento de la visualización de sitios web desde el móvil.
Visualización móvil y diseño responsivo
Durante el último par de años, el uso de dispositivos móviles para la navegación web se ha incrementado en gran medida y eso complica aún más el concepto de optimización del diseño web para el contenido above the fold.
Un desafío es que los dispositivos móviles ofrecen una gran variedad de tamaños de pantalla, así como, los usuarios en los dispositivos móviles en su mayoría navegan en modo vertical en lugar de en modo horizontal. Una vez más, esto repercute en el tamaño que un diseñador tiene para mostrar el contenido importante.
Optimizely dice: «Con tantas personas que acceden a las páginas web a través de una gran variedad de dispositivos, las prácticas actuales de diseño web implican el uso de diseño responsivo: hacer uso de diseños flexibles, imágenes y hojas de estilo en cascada. En el diseño responsivo, no hay un diseño fijo para una página, y el contenido se adapta a una pantalla de cualquier tamaño. Las páginas web con capacidad de respuesta reaccionan o «responden» al entorno en el que se consumen o se navega».
Aunque el contenido importante sigue teniendo que estar más arriba en la página, hoy en día las páginas deben estar diseñadas para incitar a los usuarios a desplazarse para que no se pierdan el contenido importante.
El pliegue siempre existirá como concepto, pero es una regla que puede cambiarse o modificarse, especialmente con el tiempo. Dado que hay tantos dispositivos y resoluciones de pantalla diferentes para navegar por los sitios web, el pliegue difiere demasiado de un usuario a otro como para confiar en él con regularidad. Pero si te aseguras de colocar sólo los elementos y contenidos más importantes por encima del pliegue, puedes encontrar un buen equilibrio entre la usabilidad de tu sitio y servir el contenido adecuado «Above The Fold».»
Para más consejos sobre las mejores prácticas de la página de inicio o cómo mejorar la velocidad de tu sitio web ¡consulta estos blogs!
- 5 prácticas recomendadas para la página de inicio
- 13 formas de aumentar la velocidad del sitio web
Desde páginas de aterrizaje hasta páginas de inicio, hemos ayudado a empresas como la suya a construir experiencias de usuario que conducen a una venta. Programe una hora para hablar.