Header

El header, o cabecera, es la sección situada en la parte superior de todas las páginas de un sitio web, siendo generalmente el primer elemento que ve el usuario al acceder. Suele mantenerse fijo o repetirse en cada página y agrupa elementos clave de identidad y navegación, como el logotipo, el menú principal y, en muchos casos, un botón o enlace destacado de llamada a la acción.


El header es fundamental para la primera impresión de una marca y para la usabilidad web, ya que orienta al usuario sobre dónde se encuentra y qué opciones tiene disponibles desde el primer segundo de navegación. Un header bien diseñado facilita el recorrido por el sitio, reduce la tasa de rebote y guía al usuario hacia las acciones prioritarias del negocio, como el contacto, la compra o la suscripción.


Entre los elementos habituales de un header se encuentran el logotipo, que además de identificar la marca suele funcionar como enlace de vuelta al inicio, el menú de navegación principal con las categorías o secciones clave del sitio, una barra de búsqueda y, en el caso del ecommerce, el icono del carrito de compra. También es frecuente incluir un CTA destacado, un selector de idioma o el acceso a la cuenta de usuario.


Entre las buenas prácticas para diseñar un header eficaz destacan mantenerlo simple y con una jerarquía de navegación clara, sin sobrecargarlo de opciones; asegurarse de que su diseño sea responsivo y funcione correctamente en móvil, habitualmente mediante un menú de tipo hamburguesa; valorar un header «sticky», que permanece visible al hacer scroll para facilitar el acceso constante a la navegación; y garantizar tiempos de carga rápidos, ya que es lo primero que percibe el usuario al entrar en la web.


El header es una de las piezas más importantes en el diseño de cualquier sitio web, ya que combina branding, navegación y conversión en un mismo espacio visible en todo momento. Junto con el footer, forma parte de la estructura fija que acompaña al usuario en todo su recorrido, siendo clave para causar una buena primera impresión y facilitar la experiencia dentro del sitio.