¿Debe mantener los principios de diseño de la mitad superior de la página?
El campo del diseño y desarrollo web presenta muchos dilemas para usted: usar un estilo limpio o no, incorporar las últimas tendencias en su sitio web o no, hacer énfasis en el frente visual o la funcionalidad, hacer que el diseño sea receptivo o no, etc.
No podemos responder a todas estas preguntas a la vez; en cambio, comenzaremos con un aspecto muy importante: el pliegue.
¿Qué significa el pliegue?
El pliegue es un término utilizado por los propietarios y desarrolladores de sitios web para identificar la parte del contenido del sitio que se muestra sin desplazarse hacia abajo. Esta es un área visible justo cuando un usuario ingresa a un sitio web.
Origen del periódico
¿De dónde han venido los orígenes? Todo es simple: la prensa fijó este término mucho antes de que el diseño web se convirtiera en un campo tan importante y desarrollado. Los periódicos impresos tenían los artículos más sensacionales en la parte superior de la página para atraer a los lectores a hojear todo el periódico.
Variedad de resoluciones de pantalla
El problema del redil hoy es la resolución. El iPad tiene una resolución de 1024×768, el iPhone 4 tiene una resolución de 960×640, mi monitor de 22 pulgadas tiene una resolución de 1920×1080, y aún hoy la más común es de 1280×720. Ya no es un tipo de computadora que todos tengan, pero hoy en día hay una gran cantidad de diseños y tamaños de monitores de computadora, por lo que es difícil crear un diseño general de la parte superior de la página. De todos modos, algunos usuarios verán más, otros menos, ¿dónde está entonces la media dorada? Supongo que está en la negación del redil, porque el término general está muerto ahora.
Los dispositivos móviles están cambiando el pliegue
Te hemos hablado de la resolución de pantalla unas líneas más arriba, pero también cabe mencionar que no sabemos qué dispositivos aparecerán mañana, dentro de un mes o dentro de un par de años. Hoy en día, las personas usan tabletas y teléfonos inteligentes, pero hace unas décadas estaban fuera de nuestro conocimiento.
Época de desplazamiento
Desplazamiento sobre todo: así es como se crean los sitios web en estos días. Era habitual navegar por un sitio web en la mitad superior de la página y no saber cómo actuar cuando los navegadores web no estaban explorados. Hoy los usuarios viven en línea, se comunican, compran, anuncian y hacen negocios en Internet, y saben todo al respecto. Otra cosa es que a los usuarios no les gusta leer y prestan demasiada atención a una sección del sitio, por lo que se desplazan, se desplazan y se desplazan de nuevo. Es tu tarea hacer que se detengan en este o aquel elemento, y como entiendes, no se trata del pliegue. Son solo unos segundos cuando los usuarios miran el área principal del sitio, por lo que no es necesario que guarde todo en una zona de página. Debe poner una proporción correcta de contenido en toda la página, y al hacerlo, duplicará sus posibilidades de ser notado y leído.
Ejemplos de cómo involucrar a los usuarios para desplazarse
Una vez que decida hacer que su sitio web sea de desplazamiento activo, debe pensar en todas las opciones posibles para que funcione y sea atractivo. ¿Cómo entenderán los usuarios que necesitan desplazarse? ¿Por qué necesitan desplazarse? ¿Qué obtendrán si se desplazan?
Senderos de ruta para desplazarse: esto es cuando usa algunos elementos para mostrar el camino a través de su sitio web. Aquí me refiero tanto a flechas elementales como a soluciones creativas como globos aerostáticos, furtivos, cualquier cosa que puedas imaginar.
Sitio web de Beach Boar con raqueta de tenis de mesa
Estudio de chispas
Diseño de columna: esta característica puede ayudar mucho a intrigar a los usuarios, especialmente si una de las columnas está rota por el pliegue. Luego, los usuarios comienzan a desplazarse para leer hasta el final de la sección y, sin darse cuenta, llegan al pie de página y obtienen otra parte de la información que ha preparado.
La navegación es la piedra angular de cualquier sitio web y no sorprende que tenga la mejor posición y la funcionalidad más fácil de usar. La mejor posición es encima del pliegue, eso es sin duda. ¿Por qué? Porque es posible que los usuarios no deseen desplazarse por toda la página de inicio, pero tienen un objetivo concreto y necesitan ver una página en particular, como sobre nosotros, contacto, pago, cartera, etc. Si hace que se desplacen para navegar por más páginas, lo regalarán todo y encontrarán otro sitio. Muchos desarrolladores cometen un error al diseñar grandes áreas de héroes con imágenes que ocupan todo el espacio por encima del pliegue (y el área de grandes héroes está de moda en la actualidad). Será mejor que coloque la barra de navegación sobre esta imagen en la parte superior, en lugar de hacerlo debajo de la sección y visible solo después de un poco de desplazamiento.
Diseño de sitios web con navegación superior
¿Dónde son más efectivos los llamados a la acción?
La respuesta a esta pregunta depende de muchos factores: qué tipo de servicios/productos ofreces, un cliente puede tomar una decisión inmediatamente o necesitará leer más antes, tienes uno o un par de llamados a la acción para aparecer en el página. Ahora, describamos cada punto uno tras otro.
El botón de llamada a la acción (CTA) es efectivo en la mitad superior de la página, cuando proporciona información exhaustiva sobre su producto en el encabezado. Esto puede ser una presentación de diapositivas, listas con viñetas con las ventajas de su producto, cualquier estática, etc. Entonces, el usuario se ha formado una impresión de su empresa y puede tomar una decisión. En este caso, los botones de arriba del pliegue actuarán a tu favor.
Sitio web de una página con botón CTA en la parte superior del pliegue
Si tienes una larga historia que contarles a tus clientes y quieres que sepan cada pro y contra de tu producto, debes colocar tu CTA debajo de la tapa y mejor hacerlo en el pie de página. Así, cuando los clientes estén seguros de que lo necesitan, verán un empujón justo delante de ellos. Sin embargo, debe hacer que su historia sea atractiva, interesante, atractiva y útil, si no, no tendrá ninguna respuesta.
¿Cuándo puedes usar varias llamadas a la acción? Solo cuando los hace con un propósito diferente y los coloca en diferentes secciones de contenido. Además, es mejor crear varios diseños para que todos ellos se diferencien unos de otros. Si tiene el mismo botón en todas partes, estropeará su presencia en línea y empeorará sus resultados finales.
Sitio web con múltiples llamadas a la acción
¿Cómo poner CTA en el medio? Hay algunos trucos que debes saber:
- coloque la llamada a la acción en una barra lateral, preferiblemente en el lado izquierdo porque generalmente leemos de izquierda a derecha y todo lo que está a la izquierda se ve primero:
- haga que el diseño de la llamada a la acción sea notable, coloréelo de forma brillante y use fuentes grandes;
- use espacios en blanco alrededor de su llamado a la acción para que se destaque entre otros contenidos.
El mayor error que puedes cometer es mezclar CTA con otros elementos de contenido. Así que nunca lo pongas en un diseño desordenado y desordenado, no funcionará con seguridad.
Información de contacto: ¿Arriba o debajo del pliegue?
No a todos los usuarios les gusta navegar por sitios web largos con mucho contenido, algunos de ellos encuentran estos sitios solo para obtener contactos de la empresa para hacer una llamada. Es por eso que es mejor que los contactos estén arriba del pliegue, puede ser una sola línea con el número de teléfono o un bloque compacto con información más detallada. Además de esto, no se olvide de una página de Contactos separada, es imprescindible para cualquier sitio.
Arriba del pliegue sigue siendo importante: página de inicio y aterrizaje
El principio de diseño por encima del pliegue no es igual para todas las páginas del sitio web. Si bien no es importante e innecesario en las páginas de contenido, es bastante vital para el diseño de la página de inicio y las páginas de destino. Aquí tiene la oportunidad de atraer a los espectadores con una bonita sección de héroes con imágenes o con una presentación de diapositivas. Sin embargo, respete las reglas de todo el diseño de acción y navegación que discutimos anteriormente.
Sugerencias finales: Elementos para presentar arriba y debajo del pliegue
Esperamos que no te hayas confundido con el artículo; de todos modos te daremos brevemente los puntos clave del diseño de la mitad superior de la página y lo resumiremos todo en sencillos consejos a seguir:
- Destaca tu nombre en la parte superior del pliegue. El logotipo tiene un gran impacto en el conocimiento de la marca y, en realidad, es por eso que se crea el sitio web: para promocionar su nombre/empresa.
- Utilice la navegación superior. Este es el elemento más vital de un sitio web de varias páginas, por lo que los principios de plegado realmente importan aquí.
- Coloque las noticias principales en la parte superior de la página. Deje que los clientes estén al tanto de sus eventos y nuevos productos de inmediato, no los deje adivinando.
- Los botones de las redes sociales funcionan bien tanto en la parte superior como en la inferior. Si la página de su sitio web tiene un desplazamiento prolongado, no elija: simplemente coloque los botones para compartir en redes sociales en la parte superior e inferior. Los botones de encabezado son buenos para los visitantes que ya lo conocen y estaban buscando su sitio web exactamente para encontrar estos botones de seguimiento. Los botones de pie de página son excelentes, porque si los usuarios están interesados en su contenido, se desplazarán hacia abajo de todos modos.
- Encuentre la posición de llamada a la acción adecuada para su sitio web en particular. Cada empresa y proveedor de servicios tiene un objetivo diferente al tener un sitio web, por lo que las llamadas a la acción también son diferentes para ellos. En este post damos una buena aclaración sobre este tema de diseño, esperamos que lo leas detenidamente, vuelve si no.
- No ponga todo por encima del pliegue. En otro caso, obtendrá un sitio web terrible con un diseño desordenado, además con un diseño vacío y aburrido debajo del pliegue.
- Descuide los principios de la parte superior de la página, si su sitio web es utilizado principalmente por usuarios de dispositivos móviles. Las personas están acostumbradas a desplazarse cuando navegan por sitios a través de teléfonos inteligentes o tabletas.
- El desplazamiento está de moda, así que dale una mejor exposición en lugar del diseño de la parte superior de la página, que no es obligatorio en el mundo digital moderno.