Vous avez peut-être entendu parler du terme « guide de style » ou « Style guide » en Anglais ? Ou pas !
Vous êtes plutôt à l’aise avec l’expression plus courante et plus connue : Charte graphique ? Et bien c’est très simple à comprendre :
Un style guide, c’est la charte graphique d’un site web !
dans le contexte du design ou de la rédaction, mais savez-vous à quel point il est essentiel pour maintenir une présence en ligne cohérente et professionnelle ? Si vous utilisez WordPress pour votre site web, vous êtes bien placé pour créer un guide de style efficace qui aidera votre marque à se démarquer. Dans cet article, nous allons plonger dans l’importance d’un guide de style et vous montrer comment en créer un avec WordPress.
Que contient un Style guide ?
Des polices (ou typos) d’écritures
- Polices et Typos avec différentes tailles selon la navigation depuis un PC, une tablette, un mobile et également selon si c’est un titre de niveau 1 (H1 pour Heading 1), niveau 2 (H2), niveau 3 (H3), éventuellement niveau 4 (H4)
Où trouver des polices d’écriture ?
Google Fonts (fonts.google.com) : Google Fonts propose une vaste collection de polices gratuites. Vous pouvez parcourir, sélectionner et intégrer ces polices dans votre site web. Google fournit un code CSS à inclure dans votre site pour utiliser ces polices.
Fontsquirrel (www.fontsquirrel.com) : Fontsquirrel propose une sélection de polices gratuites et propose un outil de correspondance de polices qui vous permet de télécharger des polices compatibles avec le web.
DaFont (www.dafont.com) : DaFont offre une grande variété de polices, y compris certaines gratuites pour un usage personnel. Assurez-vous de vérifier les licences pour chaque police.
- Téléchargement et Intégration :
Une fois que vous avez trouvé une police que vous souhaitez utiliser, téléchargez-la depuis le site web source. Généralement, les fichiers de police téléchargés sont au format TrueType Font (TTF) ou OpenType Font (OTF).
- Intégration dans votre Site Web :
Des couleurs
- Couleurs et colorimétrie de votre site
- Couleurs des liens cliquables
- Couleurs des boutons – restent cohérents. Cela crée une expérience utilisateur uniforme et professionnelle.
Les liens
Ceci est un lien
Le ou les boutons
Pourquoi ce Guide de Style pour votre création de site web est fondamental ?
Avant de plonger dans les détails techniques, explorons pourquoi un guide de style est un outil essentiel pour tout propriétaire de site web.
Un guide de style garantit que tous les éléments graphiques de votre site web :
Marque Forte : Il renforce l’identité de votre marque. Un guide de style définit comment votre marque est représentée visuellement et verbalement. Il renforce la reconnaissance de votre marque et renforce sa crédibilité.
Facilite la Collaboration : Si vous travaillez avec une équipe de concepteurs, de rédacteurs, ou même en freelance, un guide de style facilite la collaboration en fournissant des directives claires à suivre.
Gain de Temps : Une fois que vous avez un guide de style en place, il vous fera gagner du temps. Vous n’aurez pas besoin de prendre de décisions de conception à chaque étape du processus.
Améliore la Convivialité : La cohérence visuelle et la clarté rédactionnelle de votre site rendent la navigation plus facile pour vos visiteurs.
Création d’un Guide de Style avec WordPress
Maintenant que nous comprenons pourquoi un guide de style est essentiel, passons en revue les étapes pour en créer un avec WordPress.
Définissez Votre Marque
La première étape consiste à définir votre marque. Identifiez les éléments clés de votre marque, y compris :
Logo : Quelle est l’apparence de votre logo ? Quelles sont ses variantes ? À quelles occasions les utilisez-vous ?
Couleurs : Définissez votre palette de couleurs. Quelles couleurs primaires et secondaires utilisez-vous ? Fournissez les codes hexadécimaux pour une précision maximale.
Polices : Sélectionnez les polices que vous utiliserez pour le texte, les titres et les autres éléments de conception. Assurez-vous qu’elles sont lisibles et adaptées à votre public.
Règles de Conception
Décrivez les règles de conception spécifiques à votre site web. Cela peut inclure la taille des images, l’utilisation de l’espace négatif, la mise en page des pages, etc.
Images & Médias
Indiquez comment les images et autres médias doivent être utilisés sur votre site. Cela peut inclure des directives sur la résolution des images, les légendes, les droits d’auteur, etc.
Maintenance et Mise à Jour
Un guide de style n’est pas statique. Précisez comment il sera maintenu et mis à jour au fil du temps pour refléter l’évolution de votre marque.
Conclusion
Un guide de style est un atout inestimable pour tout site web. Il garantit la cohérence, renforce votre marque, facilite la collaboration et améliore l’expérience utilisateur. Avec WordPress et les bons outils, la création et la gestion d’un guide de style deviennent une tâche accessible à tous. N’oubliez pas de mettre à jour régulièrement votre guide de style pour qu’il reflète toujours l’identité actuelle de votre marque. En suivant ces étapes, vous serez bien positionné pour créer un guide de style efficace avec WordPress.