El footer o pié de página es un elemento muy olvidado en la mayoría de sitios web, pero que bien trabajado y diseñado, puede mejorar la experiencia de usuario, el SEO y la conversión del sitio. Por ello, en esta entrada quiero enseñarte qué es el footer en WordPress, qué elementos poner y cómo editarlo.
Índice del artículo
Cuando hablamos sobre el footer o pié de página, hacemos referencia a la última sección de la página en la que nos encontramos. Generalmente, se trata de una sección bien diferenciada del resto del contenido, ya que suele utilizar un color diferente o algún tipo de división.
Definición: El footer o pié de página es un elemento de HTML que aparece como norma general en todas las páginas que conforman un sitio web e indica a los usuarios el final de la pagina en la que se encuentra. La etiqueta de apertura de este elemento es <footer> y su etiqueta de cierre es </footer>.
Otras definiciones de footer que te pueden interesar son las de Wikipedia o Mozilla developer.
Al igual que otros elementos de HTML como el <header> o <aside>, la etiqueta <footer> puede contener información, enlaces, imágenes, etc. que haya decidido el diseñador web y que pueden ser de utilidad para mejorar la experiencia de usuario y un mejor funcionamiento del sitio web.
** El elemento <footer> no llegó hasta HTML5. Hasta ese momento, el pié de página se definía con un elemento <div id=”footer”></div>.
Lo primero por lo que el footer es importante a nivel de diseño web es porque marca el final de la página web. Es el elemento que indica al usuario que no hay más información y no puede seguir navegando hacia abajo.
Pero, ¿el pié de página solo sirve para esto? NO. Existen otras 4 razones más por las que el footer es importante en una página web:
1# Informa
Dentro del elemento footer podremos añadir información relacionada con otras páginas y contenidos que tenemos en nuestro sitio web y que pueden ser interesantes para el usuario. Algunos ejemplos son:
- Enlaces a páginas interesantes como: últimas entradas, comentarios, categorías…etc.
- Copyright de la página web.
- Enlaces a páginas de Aviso Legal y Política de Privacidad.
- Datos de contacto.
Por ello, podemos decir que el pié de página es un elemento donde añadir información de crucial interés para los usuarios.
2# Mejora la navegación
Muchas veces las páginas contienen grandes secciones que no caben en el menú de la página web. Por ello, y para facilitar la navegación de los usuarios, puedes poner estos enlaces o menús en el footer.
De esta forma cuando el usuario alcanza el final de la página y no haya encontrado lo que busca (o no lo haya visto), tenga una opción fácil de acceder a páginas interesantes para él.
Debido a esto, es común ver en el pié de página elementos como:
- Apartados de preguntas frecuentes (FAQ)
- Barras de búsqueda
- Menús desplegados
- Enlaces a servicios secundarios
- Enlaces a páginas de Políticas de Devoluciones, Soporte Técnico o Pasarelas de Pago.
Un gran ejemplo de Footer que informa y ayuda a la navegación a páginas importantes es el de Footlocker:
3# Ayuda al SEO
En SEO, el enlazado interno cada vez tiene mayor importancia, ya que cuando enlazas a una página la estás transmitiendo autoridad.
En este caso, el footer es un buen elemento donde poner enlaces a páginas que te interesa posicionar. Eso sí, debes tener en cuenta que cuantos más enlaces incluyas, menos autoridad transmites a cada página.
Algunos consultores SEO optan por poner un enlace al Sitemap o a una página donde enlazan todas aquellas páginas que les interesan, pero todo depende de tu estructura web y qué quieres posicionar. ¡Cada web es un mundo diferente!.
4# Aumenta la confianza
Por otro lado, el pié de página es muy usado para aumentar la confianza de los usuarios en un sitio web, sobre todo cuando hablamos de tiendas online.
Una de las prácticas más usadas es introducir imágenes de certificados de seguridad como SSL, pago seguro, organizaciones oficiales, etc.
Si introduces elementos que demuestren que tu página es segura, aumentarás la confianza de los usuarios y las conversiones.
Además, el footer es el lugar indicado si quieres presumir de algún premio que hayas ganado. El mejor ejemplo de esto es PC Componentes que tiene incluido los premios que ha ganado su e-commerce.
El footer es un elemento al que muchas veces no se presta la suficiente atención, por lo que es común encontrar sitios web con un pié de página sin diseñar y que no son visualmente agradables.
Desde hoy tienes que pensar en el footer como un elemento que te da la posibilidad de mejorar tu web, no solo desde el punto de vista SEO, sino a nivel de usabilidad y comportamiento de usuario.
Si no sabes qué elementos utilizar a la hora de personalizar tu footer, aquí te dejo una lista de elementos que son los más usados por las páginas web:
1# Información de contacto
Ya sea una tienda online, una página corporativa o de marca personal, es costumbre poner los datos de contacto en el footer.
Esto se debe a que en la mayoría de páginas web, el pié de página es un elemento común y lo podemos encontrar en todas y cada una de las páginas de ese sitio. Aunque he de decir que actualmente hay plantillas de WordPress que te permiten poner un footer personalizado en algunas páginas o incluso hacerlo desaparecer como si fuese una página de aterrizaje de publicidad.
En cuanto a la información de contacto más habitual destacaría:
- Número de teléfono
- Dirección de correo electrónico
- Dirección física (sobre todo en tiendas y empresas).
2# Enlaces a redes sociales
Al igual que pasa con la información de contacto, los enlaces a perfiles sociales se suelen colocar en dos sitios: en la parte superior del menú (header top en WordPress) y en el footer.
Las redes sociales son uno de los mejores canales para comunicarte con tus usuarios/clientes, así que si trabajas y mimas tus redes sociales no dudes en enlazarlas en tu web.
3# Enlaces a páginas de información esencial
En todos los sitios web, independientemente de la temática, existe una serie de páginas que debemos enlazar sí o sí y el footer es el mejor lugar para hacerlo.
Los ejemplos más comunes son:
- Aviso legal
- Política de cookies
- Política de privacidad
Si hablamos de una tienda online además de lo anterior habría que añadir:
- Condiciones de cambios y devoluciones
- Condiciones de envío
- Páginas relacionadas con pagos
4# Páginas más interesantes a nivel SEO
El footer es muy utilizado también para mejorar el enlazado interno de los sitios web, poniendo enlaces a las páginas más importantes a nivel SEO. Estos enlaces ayudan tanto a la navegación como a la transmisión de autoridad de una página a otra, aunque debes tener en cuenta que los enlaces en el footer no son los más relevantes para Google.
Potencia tu enlazado interno con enlaces en el footer
Además de estos enlaces, es habitual ver menús de navegación replicados en el footer. De esta forma potencias las principales secciones de tu página web. ¡Facilita la navegación a tus usuarios!.
5# Certificados
Este elemento es muy útil tanto en páginas de servicios como en tiendas online. Existen múltiples certificados como Google Partners, pago seguro o certificados de calidad de productos.
Insertar imágenes de estos certificados en el pié de página ayuda a la conversión ya que aumenta la percepción de calidad y mejora la sensación de seguridad que tienen los usuarios en los productos/servicios que se ofrecen en esa página web.
6# Logotipo
El logotipo es otro elemento bastante habitual en los footers, ya que ayuda a reforzar la imagen de marca (branding). En muchas ocasiones suele ir acompañado de una frase representativa, normalmente el eslogan del negocio o una breve presentación de la empresa.
En la mayoría de sitios webs creados con WordPress podemos encontrar dos pasos esenciales antes de tener el footer que habíamos imaginado:
La gran mayoría de las plantillas de WordPress ya tienen un apartado o sección en el que configurar aspectos principales del footer y cómo se va a componer. Por ejemplo, en una plantilla como Salient que es con la que he creado esta web, dentro de las opciones del tema podremos configurar lo siguiente:
- Colores de todos y cada uno de los elementos que añadamos al footer. Desde el color de fondo al color de la tipografía.
- Anchura del footer: si es full width (ancho completo) o in grid (con márgenes a los lados).
- La forma en la que va a aparecer el pié de página cuando el usuario esté navegando por la página web.
- Cantidad de columnas que formarán el pié de página.
Una vez configurados los aspectos esenciales, es el momento de personalizar el footer. Este apartado es común en la gran mayoría de páginas creadas en WordPress: Escritorio > Apariencia > Widgets
**En función de la configuración que hayas elegido, aparecerán más o menos secciones en las que añadir widgets y personalizar tu footer.
En este caso, en función de la configuración previa que he realizado sólo me aparecen dos secciones: Footer Área 1 y Footer Copyright.
Para empezar a personalizar cada sección, primero debes clickar en el apartado correspondiente y se abrirá el desplegable. Una vez desplegado, podrás arrastrar el widget que prefieras para personalizar tu footer.
Ejemplo de cómo personalizar el Footer en WordPress
- Selecciona el apartado «Footer Copyright».
- Añade el widget de «texto» y escribe lo que quiera que vean los usuarios.
- Guarda los cambios realizados en el widget.
- Abre tu página web y observa cómo queda el cambio.
El footer o pié de página es un elemento esencial en cualquier sitio web. Debes prestarle la atención que merece, ya que puede ayudarte a crear una página con un mejor diseño y que ayude tanto a los motores de búsqueda como a los usuarios a navegar por tu web de una forma cómoda.
Y tú, ¿Qué elementos prefieres utilizar a la hora de personalizar el footer? ¿Tienes algún ejemplo de pié de página perfecto?
