Como diseñador web, realmente trato de no desechar la jerga técnica tanto como sea posible. Pero a veces hay términos que funcionan tan bien cuando se habla de algo, ¡que es difícil no usarlos! “Hero Section”, es por lejos el término técnico más común que uso, así que pensé en hablar un poco sobre qué es exactamente y por qué es tan importante.
¿Qué es el “Hero Section” dentro un sitio web?
El “hero section” de un sitio web es simplemente la primera parte de tu sitio web que es visible antes de desplazarse hacia abajo. Esto puede referirse a cualquier página de tu sitio web, pero se usa más comúnmente cuando se habla de una página de inicio y otras páginas clave en tu recorrido de ventas o experiencia de tu cliente.
La razón por la que se llama «hero section” o traducido al español como «sección de héroe», es ¡porque realmente puede ser tu héroe! Aquí es donde se producen tus primeras impresiones. También es la parte más visitada y visible de su sitio web, y donde la mayoría de los visitantes decidirán si quieren continuar.
¿Por qué tu «hero section» es la parte más importante de tu sitio web?
Como habrás adivinado por mi descripción anterior, la «hero section» es donde se producen tus primeras impresiones. No sólo en su página de inicio, sino en todo su sitio web. Si lo traducimos correctamente, la interpretamos como «sección principal» y esta informa a las personas en dónde están y cómo podemos ayudarlas.
El Hero Section abarca tu navegación principal, ayuda a guiar a las personas a través de su sitio web hasta (con suerte) tu call to action final. Estructurando la navegación para presentar claramente a sus visitantes los pasos principales para conocer su negocio y convertirse en un usuario que expresado interes en tu producto o servicio.
¿Como está compuesto el hero section?
Como sabemos, el hero section se encuentra ubicado debajo del header (encabezado) de nuestro sitio web. Mientras que el header te ofrece datos de contacto y una ruta rápida al sitio web, el hero section enriquece la experiencia con elementos visualmente cautivadores e impactantes que llamen la atención al usuario.
En esta sección de la página web se puede incorporar los siguientes componentes:
- Imagenes o Videos
- Texto que llame la atención al usuario (CTA)
- Elementos interactivos
- Un carrusel (Slider)