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 ma­n­te­ne­r­se igual en todas las secciones. En él se incluyen con fre­cue­n­cia datos im­po­r­ta­n­tes como el aviso legal, la política de pri­va­ci­dad, 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 de­s­pla­zar­se hasta el final de la página.

Sin embargo, numerosos estudios han de­mo­s­tra­do que los usuarios sí recorren por completo las páginas web para obtener in­fo­r­ma­ción relevante. Como los ad­mi­ni­s­tra­do­res de las páginas web no quieren que los vi­si­ta­n­tes se pierdan ninguna in­fo­r­ma­ción im­po­r­ta­n­te, tienden a so­bre­ca­r­gar la cabecera. Pero la so­bre­ca­r­ga de in­fo­r­ma­ción y la falta de una es­tru­c­tu­ra clara tienen el efecto contrario. Los usuarios evitan estas páginas web.

Close

Por lo general, cuanto más clara sea la es­tru­c­tu­ra de una página web, más rápido co­m­pre­n­de­rán los vi­si­ta­n­tes 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.

Close

Con la ayuda de las consultas de medios CSS co­rre­s­po­n­die­n­tes en el código de la página web, se consigue que la in­fo­r­ma­ción se muestre de forma igua­l­me­n­te 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 de­s­pla­zá­n­do­se 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 es­pe­cia­l­me­n­te útil al enlazar con co­n­te­ni­dos es­pe­cia­les o adi­cio­na­les. Los pies de página dan a las páginas web un aspecto pro­fe­sio­nal porque la in­fo­r­ma­ció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é co­m­po­ne­n­tes deberían o deben co­m­ple­me­n­tar­se con in­fo­r­ma­ción repetida. Una solución elegante es añadir menús in­de­pe­n­die­n­tes al footer. Los programas de gestión de co­n­te­ni­dos pro­po­r­cio­nan los llamados widgets para este fin. Una es­tru­c­tu­ra de menús clara garantiza que el footer conserve el mismo diseño en todo momento.

El footer debe estar cla­ra­me­n­te separado del contenido principal de una página web. Esto puede co­n­se­gui­r­se uti­li­za­n­do di­fe­re­n­tes colores de fondo, co­n­tra­s­ta­n­do la zona con el color principal de la página web, añadiendo una línea para separar los bloques de contenido, o cualquier co­m­bi­na­ción de las an­te­rio­res. Como siempre, menos es más. Puedes dividir la sección en dos o tres secciones de contenido co­ne­c­ta­das ló­gi­ca­me­n­te. Deja su­fi­cie­n­te espacio entre estas secciones, el llamado espacio en blanco, para evitar la so­bre­ca­r­ga visual. Presta mucha atención al equi­li­brio 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 in­fo­r­ma­ción que debes incluir en un footer. El contenido relevante de la página web se suele enlazar en el footer. Aquí tienes algunas su­ge­re­n­cias.

Lista de ca­te­go­rías y enlace al blog

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

Co­le­c­cio­nes

• Za­pa­ti­llas para correr
• Calzado para caminar
• Calzado para el cuidado de la salud
• Pla­n­ti­llas
• Productos para el cuidado del calzado

Las páginas web de noticias o los blogs pueden listar sus últimas pu­bli­ca­cio­nes en un widget es­pe­cí­fi­co para el footer.

In­fo­r­ma­ción obli­ga­to­ria

El footer de la página web es un buen lugar para colocar la in­fo­r­ma­ción legal obli­ga­to­ria porque será visible en todas las páginas y su­b­pá­gi­nas de una web. Dicha in­fo­r­ma­ción podría incluir enlaces a un aviso legal y a una política de pri­va­ci­dad. Las tiendas web también pueden señalar sus co­n­di­cio­nes generales y su política de ca­n­ce­la­ción en el footer.

No solo estás cu­m­plie­n­do los re­qui­si­tos legales, sino que también estás mejorando la confianza de los vi­si­ta­n­tes de esta manera. Un gran añadido para las tiendas o pro­vee­do­res de servicios es una lista de opciones de pago, entrega y de­vo­lu­ción. Otras ideas para aumentar la confianza son los ce­r­ti­fi­ca­dos, los sellos de apro­ba­ción, las opiniones positivas de los usuarios y un aviso de en­cri­p­ta­ción SSL.

Contacto, ne­w­s­le­t­ter, app

Puedes mejorar el servicio de tu página web añadiendo datos de contacto y, en su caso, horarios de di­s­po­ni­bi­li­dad. Un enlace a las preguntas más fre­cue­n­tes (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 pro­te­c­ción de datos. La tra­n­s­fe­re­n­cia de datos del usuario a los se­r­vi­do­res suele requerir el co­n­se­n­ti­mie­n­to del usuario. Puedes incrustar un recuadro con un icono, una imagen y un texto ex­pli­ca­ti­vo sobre la tra­n­s­mi­sión de datos. Ten en cuenta que algunos pro­vee­do­res de servicios de mapas prohíben ex­pre­sa­me­n­te el uso de re­pre­se­n­ta­cio­nes des­en­fo­ca­das de sus mapas (por ejemplo, Google Maps).

La situación es similar con las pla­ta­fo­r­mas de redes sociales. Es mejor incluir un icono que enlace con Facebook, Google, X y compañía. La in­te­gra­ción directa de sus servicios puede dar lugar a una tra­n­s­mi­sión de datos no au­to­ri­za­da y podría co­n­s­ti­tuir una violación de la normativa de pro­te­c­ción de datos. Por suerte, en lo que se refiere a las redes sociales, ahora hay muchas he­rra­mie­n­tas web que ayudan a in­cru­s­tar­las de forma legal.

El footer de la página web también es útil para animar a los usuarios a re­gi­s­trar­se en las ne­w­s­le­t­te­rs. Las campañas de correo ele­c­tró­ni­co son una gran manera de fomentar la fidelidad y la confianza de los clientes. Si tus servicios son ac­ce­si­bles a través de una apli­ca­ción, es re­co­me­n­da­ble añadir en el footer enlaces a las tiendas de apli­ca­cio­nes co­rre­s­po­n­die­n­tes. Dado que un número creciente de usuarios accede a la web desde sus di­s­po­si­ti­vos móviles, las apli­ca­cio­nes son un co­m­ple­me­n­to útil para algunas empresas.

¿Qué im­po­r­ta­n­cia tiene la na­ve­ga­ción en el footer?

Cuando añades el menú principal de tu página web al footer, estás fa­ci­li­ta­n­do la na­ve­ga­ción de los vi­si­ta­n­tes de tu página, ya que no tienen que volver a de­s­pla­zar­se hasta la parte superior de la página (con la excepción del llamado sticky menu). Una vi­sua­li­za­ción de tu mapa de la web puede uti­li­zar­se para enlazar páginas in­te­r­na­me­n­te.

¿Trabajas con un gestor de co­n­te­ni­dos? En ese caso puedes probar la mejor di­s­po­si­ción de los menús co­lo­cá­n­do­los en di­fe­re­n­tes po­si­cio­nes en la página web. Podrás reajustar el diseño rá­pi­da­me­n­te si resulta que algunas zonas no funcionan. No olvides optimizar la es­tru­c­tu­ra de tu na­ve­ga­ción para mejorar la usa­bi­li­dad 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 im­po­r­ta­n­te 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 cla­si­fi­ca­ció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 ra­s­trea­do­res de los motores de búsqueda co­n­si­de­ra­rán du­pli­ca­dos los pasajes de texto largos. Puedes evitar la du­pli­ca­ció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 co­n­ti­nua­ción en­co­n­tra­rás algunos ejemplos de footer que in­co­r­po­ran los re­qui­si­tos me­n­cio­na­dos de distintas maneras.

Ma­nu­fa­c­tum

La empresa Ma­nu­fa­c­tum opera una gran tienda online y gestiona grandes almacenes en 18 lo­ca­li­da­des. En co­n­se­cue­n­cia, el footer de la página web es bastante extenso, pero mantiene una es­tru­c­tu­ra clara y anima a los clientes a su­s­cri­bi­r­se a la ne­w­s­le­t­ter de la empresa ofre­cie­n­do un vale a cambio. La estrecha barra gris situada encima de los iconos de las tiendas de apli­ca­cio­nes y de las redes sociales aporta además señales de­s­ti­na­das a animar a los vi­si­ta­n­tes de la página web a realizar una compra.

Close

Zalando

El footer de Zalando también es muy extenso, pero gracias a su es­tru­c­tu­ra clara se mantiene fácil de navegar. Destaca en varios aspectos por su clara orie­n­ta­ción al servicio, con apartados como “Cómo hacer un pedido”, “Derecho de de­vo­lu­ció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 in­fo­r­ma­ción sobre socios y ofertas de empleo, así como re­fe­re­n­cias a sus propias apps móviles y a di­fe­re­n­tes cuentas en redes sociales.

Close

Back Market

La tienda online Back Market vende ele­c­tró­ni­ca re­aco­n­di­cio­na­da, desde sma­r­t­pho­nes hasta de­pi­la­do­ras. Su footer incluye algunos elementos es­pe­cia­les. Entre ellos, un enlace al portal de reseñas Tru­s­t­pi­lot, cuyas va­lo­ra­cio­nes tra­n­s­mi­ten 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.

Close

ARTES Valve & Service

El footer del fa­bri­ca­n­te alemán de válvulas in­du­s­tria­les ARTES Valve & Service es sencillo y funcional e incluye todos los detalles im­po­r­ta­n­tes 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 vi­sua­l­me­n­te del contenido con un sutil contraste y una línea azul.

Close