Un pied de page (footer) de site Web est la section in­fé­rieure d’une page Web, qui reste gé­né­ra­le­ment identique sur l’ensemble des pages. Il contient souvent des in­for­ma­tions im­por­tantes telles que les mentions légales, la politique de con­fi­den­tia­lité, les moyens de contact ou des liens vers les réseaux sociaux. C’est une constante du design Web et il ne devrait manquer sur aucun site Internet.

Outils d'IA
Exploitez toute la puissance de l'in­tel­li­gence ar­ti­fi­cielle
  • Créez votre site Web en un temps record
  • Boostez votre activité grâce au marketing par IA
  • Gagnez du temps et obtenez de meilleurs résultats

Le footer, ou pied de page en français, est la « clef de voûte » d’un site Web et se trouve tout en bas d’une page. Pendant longtemps, on lui a accordé peu d’attention, car on supposait que les in­ter­nautes ne faisaient pas défiler les pages jusqu’en bas. Pour cette raison, le footer a longtemps été négligé par les Web­de­sig­ners, les dé­ve­lop­peurs et les créateurs de contenu.

Cependant, des études ont montré que les visiteurs ont tendance à consulter les sites dans leur entièreté pour trouver les in­for­ma­tions qu’ils cherchent. Lors de la création d’un site Web, il existe un risque de sur­char­ger le header (la zone su­pé­rieure), par crainte que l’uti­li­sa­teur ne rate quelque chose d’important. Pourtant, une telle profusion de contenus peut ra­pi­de­ment inciter à quitter la page, surtout si la structure du site manque de clarté.

Image: Schéma explicatif sur le pied de page d’un site Web
Le footer fait office de con­clu­sion optique du contenu du site Web.

En général, plus la structure d’un site Web est claire, plus il sera rapide pour ses visiteurs de saisir son contenu. Le diagramme ci-dessus illustre la position du footer telle qu’exposée sur l’écran d’un PC fixe et portable ou d’une tablette. Par con­sé­quent, le footer contribue à la clarté d’un site Web et favorise l’ergonomie du Web design.

Image: Schéma du pied de page sur un site Web mobile
Le pied de page joue un rôle d’élément visuel struc­tu­rant dans un design res­pon­sive, en encadrant les in­for­ma­tions pré­sen­tées sur le site Web.

À l’aide des Media Queries CSS intégrées dans le code du site Web, il est possible d’assurer une pré­sen­ta­tion des in­for­ma­tions tout aussi con­vi­viale sur les écrans mobiles.

Le footer indique la fin d’une page Web. Son ap­pa­ri­tion implique que l’uti­li­sa­teur ne peut pas faire défiler plus bas et qu’il n’y a plus de contenu à vi­sua­li­ser. Les uti­li­sa­teurs qui font défiler jusqu’en bas de la page sont souvent à la recherche de contenu sup­plé­men­taire. C’est là que le footer d’un site Web peut se révéler par­ti­cu­liè­re­ment pratique, en renvoyant à du contenu spécial ou ad­di­tion­nel. Les pieds de page ren­for­cent la cré­di­bi­lité et l’aspect pro­fes­sion­nel d’un site Web, dans la mesure où les in­for­ma­tions de base (comme les mentions légales ou les coor­don­nées) qui y sont contenues sont toujours ac­ces­sibles au même endroit.

Conseil

L’hé­ber­ge­ment Wordpress de IONOS vous donne accès à des milliers de modèles de sites Web avec de très belles sug­ges­tions de pieds de page.

Concept et con­cep­tion des footers

Lorsque vous essayez d’intégrer le footer de votre site Web de manière per­ti­nente, la meilleure chose à faire est de jeter un œil à votre contenu et de dé­ter­mi­ner quelles parties devraient être com­plé­tées avec des in­for­ma­tions répétées. Une solution élégante peut être de diviser le footer en plusieurs menus. Les systèmes de gestion de contenu (CMS) proposent ce qu’on appelle des widgets dans cette optique. Une structure de menu claire garantit le fait que le footer conserve le même design d’un bout à l’autre du site Web.

Conseil

Certains des CMS les plus po­pu­laires donnent accès à un large éventail d’options pour adapter le footer. Apprenez comment éditer le footer dans WordPress.

Il est important que le footer soit clai­re­ment séparé du contenu principal d’un site Web. Vous pouvez y parvenir en utilisant dif­fé­rentes couleurs d’arrière-plan, en mettant en contraste la zone par rapport à la couleur prin­ci­pale du site, en ajoutant une ligne pour séparer les blocs de contenu, ou en combinant les solutions pré­cé­dem­ment citées d’une manière ou d’une autre. Comme toujours, « less is more » et vous n’avez au­cu­ne­ment besoin d’en mettre plein la vue. Vous pouvez diviser la section en deux ou trois sections de contenu lo­gi­que­ment reliées. Laissez suf­fi­sam­ment de blanc entre ces sections pour éviter de sur­char­ger vi­suel­le­ment l’espace. Faites très attention à l’équilibre général entre le design unique de votre site et la clarté du contenu, car le footer du site Web constitue souvent l’im­pres­sion finale qu’un uti­li­sa­teur a de votre site.

Il n’existe pas de règle établie quant au type d’in­for­ma­tion devant né­ces­sai­re­ment se trouver dans un footer. On y trouve des liens vers le contenu important d’un site Web. Voici quelques sug­ges­tions.

Ca­té­go­ries et lien vers un blog

Un footer peut être utile à une boutique en ligne pour exposer des ca­té­go­ries de produits ou des sections du site Web :

Col­lec­tion

  • Chaus­sures de running
  • Chaus­sures de marche
  • Chaus­sures médicales
  • Semelles in­té­rieures
  • Produit d’entretien de chaus­sures

Sur les sites Web à caractère jour­na­lis­tique ou sur les blogs, un widget de pied de page listant les derniers articles publiés est par­ti­cu­liè­re­ment utile, car il permet de souligner l’actualité et le dynamisme du site.

In­for­ma­tions obli­ga­toires

Le footer d’un site Web est un bon em­pla­ce­ment pour placer des in­for­ma­tions légales obli­ga­toires, car elles seront visibles sur toutes les pages et sous-pages d’un site. Parmi ces in­for­ma­tions, on pourra trouver des liens vers les mentions légales et la politique de con­fi­den­tia­lité. Les boutiques en ligne peuvent également renvoyer vers leurs con­di­tions générales de vente et d’an­nu­la­tion dans le footer. Non seulement vous vous conformez aux ré­gle­men­ta­tions légales, mais vous renforcez aussi la confiance de vos visiteurs à cet égard.

Du côté des boutiques ou des four­nis­seurs de service, une liste des options de paiement, de livraison et de retour peut faire une vraie dif­fé­rence. Parmi les autres idées sus­cep­tibles de gagner la confiance des visiteurs, on peut citer les cer­ti­fi­cats, les tampons d’ap­pro­ba­tion, les éva­lua­tions positives d’uti­li­sa­teurs et une no­ti­fi­ca­tion de chif­fre­ment SSL.

Conseil

Cons­trui­sez votre propre site et ajoutez des footers efficaces et en­ga­geants vi­suel­le­ment grâce au service de con­cep­tion MyWebsite de IONOS.

Contact, news­let­ter, appli

Vous pouvez améliorer le service de votre site Web en ajoutant des in­for­ma­tions de contact et des créneaux de dis­po­ni­bi­lité quand cela s’avère né­ces­saire. Un lien vers les questions fré­quem­ment posées (FAQ) peut être utile si vous vendez des produits ou des services. Si votre boutique en ligne a un point de vente physique, vous avez intérêt à ajouter vos horaires d’ouverture et un plan d’accès dans votre footer. Ici, il peut être pertinent d’intégrer Google Maps.

Mais faites attention ! Lorsque vous intégrez des cartes en ligne, vous devez adhérer à la règle de pro­tec­tion des données. Le transfert de données uti­li­sa­teur vers des serveurs nécessite le con­sen­te­ment de l’uti­li­sa­teur. Vous pouvez intégrer une carte sym­bo­lique, une photo ou un texte pour détailler toute trans­mis­sion de données. Veuillez noter que certains four­nis­seurs de services de cartes prohibent ex­pres­sé­ment l’uti­li­sa­tion de re­pré­sen­ta­tions floutées de leurs cartes (par ex. Google Maps).

La situation est sen­si­ble­ment la même sur les pla­te­formes de réseaux sociaux. La meilleure chose à faire est d’inclure une icône qui renvoie à LinkedIn, Instagram et autres. L’in­té­gra­tion directe de leurs services peut conduire à une trans­mis­sion de données non autorisée et en­freindre la lé­gis­la­tion sur la pro­tec­tion des données. Heu­reu­se­ment, s’agissant des réseaux sociaux, il existe désormais de nombreux outils en ligne dis­po­nibles pour vous aider à intégrer du contenu dans la plus stricte légalité.

Le footer de site Web est également utile pour inciter les uti­li­sa­teurs à s’inscrire à une news­let­ter. Les ini­tia­tives de marketing par email sont une bonne manière de faire croître la fidélité et la confiance client.

Si vos services sont ac­ces­sibles via une ap­pli­ca­tion, vous pouvez renvoyer vers les App Stores dans le footer. Étant donné que de plus en plus d’uti­li­sa­teurs accèdent à Internet depuis leurs appareils mobiles, les ap­pli­ca­tions re­pré­sen­tent un atout sup­plé­men­taire non né­gli­geable pour de nom­breuses en­tre­prises.

Lorsque vous ajoutez le menu principal de votre site Web au footer, cela facilite la na­vi­ga­tion d’un bout à l’autre de votre page, étant donné que les visiteurs n’ont pas besoin de remonter jusqu’en haut de la page. Une pré­sen­ta­tion de votre plan de site peut être utilisée pour lier vos pages en interne.

Vous tra­vail­lez avec un système de gestion de contenu (CMS) ? Dans ce cas, vous pouvez tester les meilleurs ar­ran­ge­ments de menus en les plaçant dans dif­fé­rentes positions au sein d’un site Web. Vous serez en mesure de réajuster le design ra­pi­de­ment s’il s’avère que certaines zones ne fonc­tion­nent pas. N’oubliez pas d’optimiser la structure de votre na­vi­ga­tion pour améliorer l’ergonomie de votre site Web.

Les in­ter­nautes ont tendance à con­si­dé­rer le contenu situé dans le menu supérieur ainsi que dans le footer d’un site Web comme plus important et plus digne d’être lu. Ceci peut augmenter le temps qu’un visiteur passe sur votre site Web, ce qui aide à faire croître le clas­se­ment SEO de votre site. Les moteurs de recherche sont al­ler­giques à ce qu’on appelle le Duplicate Content, c’est-à-dire du contenu qui apparaît au moins deux fois (voire plus) sur un même site. Compte tenu du fait que le footer est souvent copié-collé sur chaque page du site, les longs passages de textes seront con­si­dé­rés comme du contenu dupliqué par les robots d’in­dexa­tion des moteurs de recherche. Vous pouvez éviter la du­pli­ca­tion en sau­ve­gar­dant votre contenu sur une page séparée à laquelle vous renverrez depuis le footer du site Web.

Conseil

Vous souhaitez en savoir plus sur l’op­ti­mi­sa­tion des moteurs de recherche ? Découvrez les termes les plus courants et leur dé­fi­ni­tion dans notre lexique SEO.

Vous trouverez ci-dessous des exemples de footers qui ap­pli­quent les exigences pré­sen­tées ci-dessus de dif­fé­rentes manières.

Ma­nu­fac­tum

La société de vente par cor­res­pon­dance Ma­nu­fac­tum fait fonc­tion­ner une im­por­tante boutique en ligne et gère des grands magasins dans 18 lieux dif­fé­rents. De la même façon, le footer du site Web est assez vaste, mais dispose d’une structure claire et encourage les clients à souscrire à la news­let­ter de la société en leur offrant un bon d’achat en échange. La barre grise et étroite encourage les visiteurs du site à effectuer des achats dans des ca­té­go­ries sé­lec­tion­nées.

Image: Capture d’écran du pied de page du site de vente par correspondance Manufactum
Le pied de page du site de vente par cor­res­pon­dance Ma­nu­fac­tum. / Source : https://fr.ma­nu­fac­tum.ch

Zalando

Le footer de Zalando constitue un autre exemple d’une in­té­gra­tion plus riche, mais qui va droit au but, grâce à sa structure très claire. Il se distingue notamment par sa forte orien­ta­tion service avec des rubriques telles que le « Guides des tailles », « Essayer d’abord, payez après », une large sélection de moyens de paiement, ainsi qu’une liste détaillée des par­te­naires de livraison. On y trouve aussi tous les liens vers les mentions légales, une section incluant les par­te­naires et les offres d’emploi, sans oublier les liens vers les ap­pli­ca­tions mobiles de l’en­tre­prise et ses dif­fé­rents comptes sur les réseaux sociaux.

Image: Capture d’écran du pied de page de Zalando
Le pied de page complet du site E-commerce Zalando. / Source : https://www.zalando.fr/

Back Market

Back Market est une mar­ket­place en ligne qui vend des biens élec­tro­niques re­con­di­tion­nés, allant des smart­phones à des épi­la­teurs. Son pied de page présente quelques par­ti­cu­la­ri­tés in­té­res­santes. On y trouve un lien vers la pla­te­forme d’avis Trust­pi­lot, dont les éva­lua­tions té­moig­nent de confiance et de pro­fes­sion­na­lisme. Les visiteurs peuvent vite en apprendre plus sur les valeurs et ambitions de l’en­tre­prise en suivant le lien dans la section « À propos de nous » du footer.

Image: Capture d’écran du pied de page de Backmarket
Le pied de page de la pla­te­forme de vente d’élec­tro­nique re­con­di­tion­née Ba­ck­mar­ket. / Source : https://www.ba­ck­mar­ket.fr/fr-fr

ARTES Valve & Service

L’en­tre­prise de ro­bi­net­te­rie in­dus­trielle basée à Velten, près de Berlin, propose sur son site mul­ti­lingue un pied de page très sobre, axé sur la prise de contact rapide, que ce soit pour les nouveaux clients ou pour les services après-vente. Les deux adresses de l’en­tre­prise sont ac­ces­sibles via Google Maps, mais uni­que­ment de manière conforme au RGPD, c’est-à-dire après un clic vo­lon­taire sur le lien. Vi­suel­le­ment, le pied de page est dis­crè­te­ment séparé du contenu par un contraste léger et une fine ligne de dé­mar­ca­tion.

Image: Capture d’écran du pied de page de l’entreprise industrielle ARTES Valve & Service GmbH
Un pied de page centré sur l’essentiel pour l’en­tre­prise in­dus­trielle ARTES Valve & Service GmbH. / Source : https://artes-valve.com/
MyWebsite Now Plus
Créez un site Web pro­fes­sion­nel pour votre en­tre­prise
  • Large choix de templates, domaine et email
  • Outils SEO et plus de 17 000 photos libres de droit
  • Prise de rendez-vous en ligne, simple et rapide
Aller au menu principal