Qué es un footer: diseño y consejos SEO

Un footer o pie de página es la parte inferior de una página web, que suele mantenerse igual en todas las secciones. En él se incluyen con frecuencia datos importantes como el aviso legal, la política de privacidad, las formas de contacto o los enlaces a redes sociales. Es una constante dentro del diseño web y no debería faltar en ninguna página.

¿Qué es un footer y dónde se encuentra?

El footer es la “piedra angular” visual de una página web y se encuentra justo en su parte inferior. Durante mucho tiempo, se le prestó poca atención porque se pensaba que los usuarios de una página web eran demasiado perezosos para desplazarse hasta el final de la página.

Sin embargo, numerosos estudios han demostrado que los usuarios sí recorren por completo las páginas web para obtener información relevante. Como los administradores de las páginas web no quieren que los visitantes se pierdan ninguna información importante, tienden a sobrecargar la cabecera. Pero la sobrecarga de información y la falta de una estructura clara tienen el efecto contrario. Los usuarios evitan estas páginas web.

Por lo general, cuanto más clara sea la estructura de una página web, más rápido comprenderán los visitantes su contenido. El diagrama anterior ilustra la posición del footer tal y como se visualiza en una pantalla de ordenador de sobremesa, un portátil o una tableta de mayor tamaño. Así, el footer mejora la claridad de la página y potencia la facilidad de uso del diseño web.

Con la ayuda de las consultas de medios CSS correspondientes en el código de la página web, se consigue que la información se muestre de forma igualmente clara y fácil de usar en una pantalla móvil.

¿Para qué sirve un footer?

El footer señala el final de una página web: el usuario no puede seguir desplazándose ni hay más contenido que ver. Los usuarios que se desplazan hasta el footer suelen buscar contenido adicional. Ahí es donde el footer de una página web puede ser especialmente útil al enlazar con contenidos especiales o adicionales. Los pies de página dan a las páginas web un aspecto profesional porque la información básica que contienen está siempre accesible.

Concepto y diseño de un footer

Cuando quieras integrar el footer de tu página web de forma coherente, lo mejor es que eches un vistazo a tu contenido y evalúes qué componentes deberían o deben complementarse con información repetida. Una solución elegante es añadir menús independientes al footer. Los programas de gestión de contenidos proporcionan los llamados widgets para este fin. Una estructura de menús clara garantiza que el footer conserve el mismo diseño en todo momento.

El footer debe estar claramente separado del contenido principal de una página web. Esto puede conseguirse utilizando diferentes colores de fondo, contrastando la zona con el color principal de la página web, añadiendo una línea para separar los bloques de contenido, o cualquier combinación de las anteriores. Como siempre, menos es más. Puedes dividir la sección en dos o tres secciones de contenido conectadas lógicamente. Deja suficiente espacio entre estas secciones, el llamado espacio en blanco, para evitar la sobrecarga visual. Presta mucha atención al equilibrio general entre el diseño único de tu página web y la claridad del contenido, porque el footer de la página web suele ser la última impresión que tiene el usuario de tu página.

¿Qué contiene un footer?

No hay una regla estricta sobre la información que debes incluir en un footer. El contenido relevante de la página web se suele enlazar en el footer. Aquí tienes algunas sugerencias.

Lista de categorías y enlace al blog

Una tienda online puede utilizar un footer para mostrar categorías de productos o secciones de la página web, por ejemplo:

Colecciones

• Zapatillas para correr
• Calzado para caminar
• Calzado para el cuidado de la salud
• Plantillas
• Productos para el cuidado del calzado

Las páginas web de noticias o los blogs pueden listar sus últimas publicaciones en un widget específico para el footer.

Información obligatoria

El footer de la página web es un buen lugar para colocar la información legal obligatoria porque será visible en todas las páginas y subpáginas de una web. Dicha información podría incluir enlaces a un aviso legal y a una política de privacidad. Las tiendas web también pueden señalar sus condiciones generales y su política de cancelación en el footer.

No solo estás cumpliendo los requisitos legales, sino que también estás mejorando la confianza de los visitantes de esta manera. Un gran añadido para las tiendas o proveedores de servicios es una lista de opciones de pago, entrega y devolución. Otras ideas para aumentar la confianza son los certificados, los sellos de aprobación, las opiniones positivas de los usuarios y un aviso de encriptación SSL.

Contacto, newsletter, app

Puedes mejorar el servicio de tu página web añadiendo datos de contacto y, en su caso, horarios de disponibilidad. Un enlace a las preguntas más frecuentes (FAQ) puede ser útil si vendes productos o servicios. Si tu tienda online tiene una tienda física, debes añadir al footer tus horarios de apertura y un mapa de cómo llegar. Aquí, por ejemplo, resulta útil integrar Google Maps.

Pero ¡cuidado! Al incrustar mapas online, tienes que cumplir las normas de protección de datos. La transferencia de datos del usuario a los servidores suele requerir el consentimiento del usuario. Puedes incrustar un recuadro con un icono, una imagen y un texto explicativo sobre la transmisión de datos. Ten en cuenta que algunos proveedores de servicios de mapas prohíben expresamente el uso de representaciones desenfocadas de sus mapas (por ejemplo, Google Maps).

La situación es similar con las plataformas de redes sociales. Es mejor incluir un icono que enlace con Facebook, Google, X y compañía. La integración directa de sus servicios puede dar lugar a una transmisión de datos no autorizada y podría constituir una violación de la normativa de protección de datos. Por suerte, en lo que se refiere a las redes sociales, ahora hay muchas herramientas web que ayudan a incrustarlas de forma legal.

El footer de la página web también es útil para animar a los usuarios a registrarse en las newsletters. Las campañas de correo electrónico son una gran manera de fomentar la fidelidad y la confianza de los clientes. Si tus servicios son accesibles a través de una aplicación, es recomendable añadir en el footer enlaces a las tiendas de aplicaciones correspondientes. Dado que un número creciente de usuarios accede a la web desde sus dispositivos móviles, las aplicaciones son un complemento útil para algunas empresas.

¿Qué importancia tiene la navegación en el footer?

Cuando añades el menú principal de tu página web al footer, estás facilitando la navegación de los visitantes de tu página, ya que no tienen que volver a desplazarse hasta la parte superior de la página (con la excepción del llamado sticky menu). Una visualización de tu mapa de la web puede utilizarse para enlazar páginas internamente.

¿Trabajas con un gestor de contenidos? En ese caso puedes probar la mejor disposición de los menús colocándolos en diferentes posiciones en la página web. Podrás reajustar el diseño rápidamente si resulta que algunas zonas no funcionan. No olvides optimizar la estructura de tu navegación para mejorar la usabilidad de tu página web.

Footer de la página web y SEO

Los usuarios de la página web tienden a valorar el contenido incluido en el menú superior y también en el footer de la página web como más importante y que vale la pena leer. Esto puede aumentar el tiempo que un visitante pasa en tu página, lo que a su vez mejora la clasificación SEO de tu página web. Los motores de búsqueda son alérgicos al llamado “contenido duplicado”, es decir, al contenido que aparece al menos dos veces (o más) en una página web. Como el footer suele copiarse en todas las páginas, los rastreadores de los motores de búsqueda considerarán duplicados los pasajes de texto largos. Puedes evitar la duplicación guardando tu contenido en una página separada a la que enlaces desde el footer de la página web.

Footer de la página web: buenas prácticas

A continuación encontrarás algunos ejemplos de footer que incorporan los requisitos mencionados de distintas maneras.

Manufactum

La empresa Manufactum opera una gran tienda online y gestiona grandes almacenes en 18 localidades. En consecuencia, el footer de la página web es bastante extenso, pero mantiene una estructura clara y anima a los clientes a suscribirse a la newsletter de la empresa ofreciendo un vale a cambio. La estrecha barra gris situada encima de los iconos de las tiendas de aplicaciones y de las redes sociales aporta además señales destinadas a animar a los visitantes de la página web a realizar una compra.

Zalando

El footer de Zalando también es muy extenso, pero gracias a su estructura clara se mantiene fácil de navegar. Destaca en varios aspectos por su clara orientación al servicio, con apartados como “Cómo hacer un pedido”, “Derecho de devolución de 30 días”, múltiples formas de pago y un listado de socios de envío. Además, incluye todos los enlaces a los textos legales, una sección de “Sobre Zalando” con información sobre socios y ofertas de empleo, así como referencias a sus propias apps móviles y a diferentes cuentas en redes sociales.

Back Market

La tienda online Back Market vende electrónica reacondicionada, desde smartphones hasta depiladoras. Su footer incluye algunos elementos especiales. Entre ellos, un enlace al portal de reseñas Trustpilot, cuyas valoraciones transmiten seguridad y generan confianza. Otro punto positivo es la mención de la garantía de 12 meses. En la sección de footer “Sobre nosotros”, el enlace “¿Quiénes somos?” resume de forma rápida y clara la propuesta de la empresa.

ARTES Valve & Service

El footer del fabricante alemán de válvulas industriales ARTES Valve & Service es sencillo y funcional e incluye todos los detalles importantes para que los clientes se pongan en contacto de forma rápida y sencilla y pregunten por sus servicios. Los datos de contacto de la empresa pueden verse en Google Maps. El footer de la página web está separado visualmente del contenido con un sutil contraste y una línea azul.