Footer

El Footer es el pie de página de los sitios del Estado: identifica a la institución responsable y reúne enlaces secundarios, canales de ayuda o datos del servicio. Tiene tres tipos según el contexto: landing pública, producto privado y portal de autenticación ClaveÚnica.

Propiedades y configuraciones

Cuando usarlo

Úsalo al final de todas las páginas de un sitio del Estado. Elige Landing en sitios públicos e informativos, Producto en zonas privadas de una aplicación (bandejas, escritorios de funcionarios) y ClaveÚnica solo en el portal de autenticación.

Si necesitas comunicar algo importante para completar un trámite (plazos, requisitos, errores), usa Alert o el contenido de la página; el footer es para información secundaria y de respaldo.

Buenas prácticas

Recomendado: Identifica a la institución responsable

La bajada bajo el logo dice a qué ministerio o servicio pertenece el sitio: es una señal de confianza y de a quién recurrir.

Recomendado: Incluye canales de ayuda con horario

Ofrece un enlace de ayuda, la mesa de atención, su horario y un teléfono que se pueda marcar desde el celular.

Recomendado: Agrupa los enlaces con encabezados claros

Pocas columnas con títulos que describen su contenido permiten recorrer el footer de un vistazo.

Recomendado: Usa el footer de producto en zonas privadas

En aplicaciones internas o con sesión iniciada, muestra la versión y el historial de cambios sin repetir la navegación pública.

Malas prácticas

No recomendado: No conviertas el footer en un mapa del sitio interminable

Listar todas las páginas en una sola columna hace imposible encontrar algo. Prioriza pocos enlaces útiles por grupo.

No recomendado: No uses el footer ClaveÚnica fuera del portal de autenticación

La franja “Colabora / Administra” es del servicio ClaveÚnica; en un sitio municipal confunde sobre quién es responsable.

No recomendado: No dejes información crítica solo en el footer

Plazos, requisitos o cambios de horario no se buscan en el pie de página: van en el contenido o en una Alert.

No recomendado: No uses enlaces genéricos

“Clic aquí”, “Ver más” o “Link” no dicen a dónde llevan y, leídos en lista por un lector de pantalla, son indistinguibles.

Recomendaciones de accesibilidad

Usa un único <footer> por página
El pie se marca con <footer> para que funcione como landmark de información de contenido; evita anidarlo dentro de otras regiones.

Nombra cada grupo de enlaces
Las columnas de enlaces son <nav> con aria-label igual a su encabezado (p. ej. “Trámites frecuentes”), así los lectores de pantalla distinguen cada navegación del footer.

Escribe enlaces descriptivos
Cada enlace debe entenderse fuera de contexto (“Certificado de nacimiento”, “Preguntas frecuentes”), porque es común recorrer el footer como lista de enlaces.

Haz marcable el teléfono
Usa un enlace tel: para el número de atención, de modo que en móvil se pueda llamar con un toque y se anuncie como enlace.

Describe los logos institucionales
En el footer ClaveÚnica, los logos de Registro Civil y Gobierno Digital llevan alt con el nombre de la institución; la franja de marca va con aria-hidden="true".

No uses el encabezado atenuado para contenido esencial
Los encabezados de columna se muestran con opacidad reducida; úsalos solo como títulos cortos y deja la información importante en texto con contraste completo.