Tous les pieds de page ne sont pas égaux. Bien que la conception des pieds de page ne fasse pas partie du processus de création de sites Web, un pied de page de qualité peut aider les utilisateurs à trouver des informations, à vous contacter et à mieux dialoguer avec un site Web. Voici comment vous en concevez une qui est fonctionnelle et belle.
Un grand pied de page peut également aider à organiser les informations et faciliter la navigation sur un site Web compliqué. Pensez au pied de page immense et multicouche du site Web d'Amazon.
L'astuce pour un pied de page important est l'organisation du contenu. Une fois que vous avez compris ce que la conception de pied de page devrait aider les utilisateurs, il est plus facile de concevoir un élément au bas de la page dont vous pouvez être fier. Nous allons plonger dans quelques conseils de conception de pied de page.
1. Donnez-lui un but
Avant de pouvoir réellement concevoir un pied de page Web volumineux, déterminez comment les utilisateurs doivent l’utiliser. Une bonne conception de pied de page n'est pas un endroit où déposer tous les liens et informations avec lesquels vous ne savez pas quoi faire. (Bien que trop de sites Web l'utilisent de cette façon.)
Une bonne conception de pied de page a un but intentionnel, tout comme toutes les autres parties de la conception.
Les utilisations courantes des pieds de page incluent:
- Plan du site ou liste des pages / liens les plus populaires
- Contact ou autre formulaire de soumission
- Hub de médias sociaux avec prévisualisations et liens vers des comptes sociaux
- Appel à l'action ou dernière chance d'agir
- Carte pour indiquer votre emplacement (important pour les entreprises de brique et de mortier ou les restaurants)
- Contenu associé (idéal pour les blogs)
2. Rendez-le réactif
N'oubliez pas de veiller à l'aspect réactif et aux interactions de cet élément de conception de site Web. Utilisez un format basé sur des colonnes pour que votre pied de page se réduise facilement et s'empile dans un format réactif. Cela devient d'autant plus important que la taille du pied de page augmente.
Bien qu'un pied de page à une colonne puisse sembler joli sur un appareil de bureau, il peut se transformer en désordre sur mobile. N'oubliez pas de veiller à l'aspect réactif et aux interactions de cet élément de conception de site Web.
Rappelez-vous qu'il n'est pas nécessaire d'inclure différents types de contenu dans un format multi-colonnes. La conception est principalement destinée à vous aider à organiser ce qui pourrait être un grand nombre d'éléments dans le pied de page.
Sauf si? vous prenez une autre approche avec un pied de page surdimensionné pour un seul élément. Cela peut être une option populaire pour un grand formulaire de contact ou un appel à l'action, tel que Hustle Panda (ci-dessus). Dans ce cas, la zone de contenu est si grande qu'une option de colonne unique peut se réduire facilement à des tailles plus petites. (Assurez-vous simplement que le texte et les CTA sont toujours assez grands pour pouvoir être lus facilement.)
3. Inclure les informations attendues par les utilisateurs
La plupart des utilisateurs s'attendent à trouver certains types d'informations dans un pied de page de site Web. L'inclusion d'éléments situés dans un emplacement attendu par les utilisateurs peut en faciliter la conception.
Bien que tous ces éléments ne doivent pas nécessairement figurer dans le pied de page d'un site Web, voici quelques-uns des éléments courants que les utilisateurs pourront faire défiler jusqu'au bas d'une page pour trouver:
- Plan du site ou navigation étendue
- Coordonnées, adresse ou carte
- Liens de médias sociaux ou widgets
- Inscription email ou newsletter
- Chercher
- Mission ou à propos d'informations
- Témoignages
- Actualités, articles de blog récents ou listes d'événements
Il existe également quelques éléments minuscules qui peuvent facilement être insérés dans le pied de page. Tous les utilisateurs ne recherchent pas ces éléments, mais ce sont souvent davantage des éléments de gestion de site Web.
- Informations sur le droit d'auteur
- Lien vers des conditions ou une politique de confidentialité (idéal pour les mises à jour GDPR)
- Affiliations professionnelles ou associations
4. Organiser les liens
En organisant des liens, vous pouvez aider les utilisateurs à trouver la partie du site qui leur convient le mieux. Les sites Web contenant beaucoup de contenu ou des types d'informations variés doivent considérer un pied de page de grande taille avec des liens groupés en catégories de ressources. En organisant des liens, vous pouvez aider les utilisateurs à trouver la partie du site qui leur convient le mieux. (Pensez-y de la même manière que ces vieux menus méga qui étaient populaires dans la navigation principale pendant un moment.)
C'est une technique assez courante pour les projets à grande échelle et peut être très utile pour les utilisateurs. Les détaillants en ligne font un excellent travail d’organisation des informations pour les grands pieds de page.
Le pied de page de Home Depot, ci-dessus, comprend plusieurs niveaux d'informations en couches dans le pied de page. La rangée du haut comprend les catégories populaires (l’élément «Avez-vous trouvé tout ce que vous cherchiez» pour la vente au détail en ligne), puis des groupes de liens pour le service clientèle (en fonction de ce que l’utilisateur doit faire), des ressources, des société et un appel à l'action. Enfin, le pied de page contient des liens vers d’autres marques de la société, des informations sur le droit d’auteur et des liens de conditions et d’accord.
5. Maintenir la voix et l'image de marque
Ne traitez pas la microcopie dans le pied de page après coup. (Ceci est un défaut commun.)
La voix et le style de ce contenu doivent refléter le ton du reste de la conception du site Web. Incluez le même jeu de couleurs, les mêmes éléments de conception et la même voix que ceux utilisés dans le reste du projet. Les utilisateurs ne devraient pas avoir à deviner ou à penser où ils se trouvent sur le Web lorsqu'ils sont dans le pied de page.
Le fournisseur de messagerie Emma, ci-dessus, inclut un appel à l’action dans le pied de page avec les visages et la même attitude amicale que le reste de la conception du site Web: "Dites bonjour à votre nouvelle équipe marketing." Le ton est léger, il y a beaucoup d'espace entre les éléments (soulignant visuellement cette sensation de lumière) et des visages joyeux pour attirer les utilisateurs, ce qui permet à l'entreprise de se sentir comme quelqu'un que vous connaissez.
6. Donnez-lui beaucoup d'espace
Un petit texte et un espace restreint peuvent être une recette pour un désastre. Assurez-vous que les éléments disposent de suffisamment d'espace pour respirer dans le pied de page afin que les informations restent faciles à numériser et à cliquer.
Les mêmes principes que vous appliquez à l'espace, à la lisibilité et à la numérisation s'appliquent également au pied de page. (Plus le pied de page est grand, plus ces éléments sont importants.)
Rappelez-vous que si ce n'est pas utilisable, ce n'est pas bon.(Vous pouvez avoir une bonne idée de ce qui fonctionne et ne fonctionne pas en utilisant des informations d'analyse et en suivant les chemins d'accès aux clics. Quels liens dans le pied de page sont réellement cliqués?)
7. Gardez-le séparé
Un changement de contraste peut être un puissant repère visuel qui établit une impression de place dans la conception. Pour tirer le meilleur parti d'une conception de pied de page surdimensionné, assurez-vous qu'il se distingue du contenu situé au-dessus. Un pied de page doit avoir l’impression de faire partie de la conception générale, mais il doit également comporter suffisamment de contraste pour que l’utilisateur comprenne que c’est au bas de la page que se trouvent les informations clés (et attendues).
Une technique courante pour aider à établir ce contraste consiste à placer le pied de page dans un élément de conteneur, tel qu'une zone colorée, qui est d'une couleur différente de celle du reste de l'arrière-plan. (Par exemple, si la conception du site Web a un arrière-plan généralement clair, le pied de page peut être contenu dans un arrière-plan sombre.)
Ce contraste supplémentaire indique clairement que cette partie de la conception est différente. Cela met l'utilisateur en pause et réfléchit aux informations à l'écran. Un changement de contraste peut être un puissant repère visuel qui établit une impression de place dans la conception, ainsi qu’un outil d’utilisabilité.
Conclusion
Mais quand un pied de page est-il trop gros?
En faisant des recherches sur cet article, je suis tombé sur de nombreuses superbes conceptions de pied de page. Plus de concepteurs créent de grands pieds (et même des pieds surdimensionnés) que je ne le pensais quand j'ai commencé dans cette voie. Mais il y a un type de gros pied de page que j'ai trouvé agaçant - les pieds de page qui défilent.
Bien que le pied de page soit un endroit idéal pour organiser de nombreuses informations, en tant qu'utilisateur, je voulais tout voir en un coup d'œil. Alors, gardez cela à l’esprit lors de la conception de votre projet. (Ou peut-être que ce n'est que ma gueule de bois après avoir jeté un coup d'œil à tant de motifs de pied de page.) Bonne chance dans vos grands projets de pied de page!