¿Qué es la hero section?

La hero section es el bloque que ocupa la parte superior de una página, el primero que ves antes de hacer scroll. Suele llevar el titular, una frase de apoyo, una imagen o vídeo de fondo y el botón de llamada a la acción. Es la carta de presentación de toda la web.

Ahí se juega media visita. La gente decide en segundos si se queda o se va, así que la hero section tiene que decir de un vistazo quién eres y qué ofreces, sin obligar a leer nada más abajo.

Combina tipografía grande, poco texto y un fondo con peso visual. En una web construida con IA, nombrar la hero section sirve para señalar exactamente dónde quieres un cambio, en vez de describir "la parte de arriba, la primera que se ve": la IA sabe a qué bloque te refieres sin ambigüedad.

En Google AI Studio, en vez de escribir "cambia el título grande de arriba", copias un trozo del texto de esa zona y le dices "en la hero section, cambia el titular por...". Apunta directo al bloque correcto y evita que toque otra parte de la web por error.

Se retoca con CSS cuando es solo estilo, y se genera de golpe al pedirle un PRD completo a una herramienta no-code como AI Studio.