Lección 2 – Menú, cabecera y footer (sin marear)

Módulo 3 Lección 2 Navegación

Menú, cabecera y footer (sin marear)

El diseño PRO no es “decoración”. Es que el usuario sepa qué hacer. Un menú limpio + una cabecera clara + un footer útil = más confianza, mejor SEO y más conversiones.

15–20 min UX básica Claridad

Qué vas a conseguir

Vas a dejar la navegación de tu web limpia y profesional: menú superior sin exceso, cabecera con intención clara y footer con enlaces útiles. Sin marear, sin “menús infinitos”.

1) El menú superior (lo mínimo que debe tener)

Si el menú tiene 10–20 enlaces, el usuario se pierde. Lo PRO es simple: 4 a 6 enlaces máximo.

Menú recomendado (ejemplo)

  • Inicio
  • Guías / Blog
  • Academia / Cursos
  • Sobre mí
  • Contacto

Si te sobran enlaces, van al footer. Arriba solo lo esencial.

Errores típicos

  • Poner 12 categorías arriba.
  • Duplicar enlaces (Inicio + Home + Portada).
  • Menú con nombres raros (“Soluciones”, “Servicios”, “Recursos”) sin explicar.
  • Ocultar lo importante: la parte de aprendizaje.

2) Cabecera (header): qué debe transmitir

La cabecera no es solo el menú. Es la primera sensación de “esto es serio”. El objetivo es que el usuario entienda qué haces y tenga un primer paso.

Logo simple

Que se vea bien en móvil, sin ocupar media pantalla.

Menú corto

4–6 enlaces, coherentes con la estructura.

CTA suave

Un botón tipo “Empezar” o “Ver cursos” (si tu tema lo permite).

Regla PRO

En móvil, el header debe ser fino. Si ocupa demasiado, baja la percepción de calidad y empeora UX.

3) Footer (pie de página): tu “zona de orden”

El footer es donde pones enlaces útiles sin ensuciar el menú superior. Además, aumenta confianza (y eso ayuda a conversiones).

Footer recomendado (bloques)

  • Enlaces útiles: Inicio, Guías, Cursos, Sobre, Contacto
  • Legales: Privacidad, Cookies, Aviso legal
  • Extra: mapa del sitio o enlaces a guías importantes

Qué NO meter

  • 10 banners o widgets innecesarios.
  • Listas eternas de categorías.
  • Enlaces repetidos 3 veces.

Footer limpio = marca seria.

4) La prueba de 10 segundos (la más importante)

Abre tu web (móvil) y haz esta prueba:

  • ¿Entiendo qué ofrece esta web en 10 segundos?
  • ¿Veo un camino claro (Guías / Cursos / Empezar)?
  • ¿El menú es corto y no me abruma?
  • ¿Puedo llegar al “primer paso” con 1 clic?

Si el usuario no sabe qué hacer, no es problema de contenido. Es problema de estructura y navegación.

Checklist final (navegación limpia)

  • Menú superior con 4–6 enlaces (máximo).
  • “Primer paso” claro (cursos/guías/empezar).
  • Header fino y usable en móvil.
  • Footer con enlaces útiles + legales.
  • Nada de menús infinitos ni categorías arriba.

Siguiente paso

Ahora vamos con UX básica: jerarquía visual, espacios, tipografía y CTAs suaves para que el usuario avance sin pensar.