Qu'est-ce qui doit être dans votre guide de style? (Et comment l'appliquez-vous?)
Tout le monde avec un site Web a besoin d'un guide de style. C'est si simple. Si vous voulez instiller plus de cohérence dans votre projet et mettre tout le monde sur la même page, votre guide de style deviendra inestimable.
Maintenant que nous avons mis cela de côté, que mettez-vous exactement dans ce guide? Et comment vous assurez-vous que les autres membres de l'équipe respectent les règles afin que votre présence visuelle reste cohérente? C'est un peu plus compliqué. Plongeons-nous dans le sujet aujourd'hui.
Présentation de la marque
Créer un guide de style à partir de zéro peut être assez intimidant si vous ne l'avez jamais fait auparavant. Les débutants peuvent bénéficier de trouver un guide qu'ils aiment - MailChimp a l'un des meilleurs sur le marché et le rend disponible sous une licence Creative Commons - et de l'utiliser comme modèle pour commencer.
La plupart des guides de style comportent deux parties:
- Consignes de rédaction
- Lignes directrices visuelles
Chaque ensemble de lignes directrices est tout aussi important et devrait faire partie de votre guide de style global. La réunion des éléments établira une identité globale. Chaque marque, entreprise ou site Web est également un peu différent. Choisissez un ton et un style qui fonctionnent bien en termes de copie et de visuels, mais qui se rapportent également à vous et à votre public dans son ensemble.
Tenez compte des utilisateurs et des parties prenantes lors de l'établissement d'une identité, la marque est-elle ce qu'ils veulent et attendent? Peuvent-ils s'y rapporter? Veulent-ils interagir avec elle?
Voix et ton
Nous allons nous concentrer principalement sur les aspects visuels de votre guide de style, mais la voix et le ton sont importants. Une partie de votre identité réside dans la façon dont vous «parlez» aux utilisateurs. Ce style est-il formel ou décontracté? Est-il verbeux ou plus succinct?
Écrivez votre guide de style de la même manière que la copie sur votre site Web. Cela aidera votre équipe à savoir ce qui est attendu et comment la langue devrait contribuer à l'identité de la marque.
Cette voix et ce ton doivent être utilisés dans chaque communication de votre part. Revenez aux contours de MailChimp pour un aperçu complet de la création d'une voix de marque. Notez la façon dont l'entreprise parle de sa mascotte, par exemple: «Freddie est notre mascotte. Nous ne l'utilisons pas en combinaison avec notre logo. Freddie fait toujours face à droite et il fait toujours un clin d'œil. »
«Règles» et utilisation
Votre guide de style devrait être votre «playbook» de conception. (Cela ne semble-t-il pas plus convivial que les «règles?»)
Il doit indiquer comment et quand utiliser le type, la couleur et tous les autres types d'éléments de conception d'une manière facile à comprendre. Voici une liste de contrôle des éléments à inclure:
- Palette de couleurs, y compris les valeurs et les teintes acceptables
- Palette de typographie, avec tous les poids, tailles, interlignes et utilisation acceptables
- Logo, y compris des directives pour la taille et l'emplacement
- Styles d'icônes ou d'éléments (cela inclut le traitement des éléments, des boutons aux icônes de partage des médias sociaux)
- Orthographe, choix des mots et style de copie (quelles directives éditoriales devez-vous suivre? APA, AP, autre chose?)
- Directives de photographie, y compris la couleur, le recadrage et la présence visuelle
- Informations SEO telles que les astags et les mots clés
- Normes de grille (pour le Web et l'impression)
- Considérations d'espacement (si la conception est lâche ou serrée)
- Point de contact (où les membres de l'équipe peuvent poser des questions ou demander des éclaircissements)
Concepts simples et spécifiques
Voici maintenant la partie difficile. Vous devez prendre toutes les informations ci-dessus et les résumer en concepts simples, spécifiques et exploitables.
- N'exagérez pas avec le contenu en ce qui concerne votre guide de style. Ceci est une référence visuelle; concevoir de cette façon.
- Regroupez les éléments associés dans des pages pour référence rapide: une page pour la couleur, une autre page pour la typographie, une page pour la photographie, etc.
- Montrez des exemples de ce à quoi les choses devraient ressembler. N'expliquez pas les choses par écrit quand une image suffira.
- Fournissez des détails utilisables. Les échantillons de couleur, par exemple, doivent inclure des mélanges RVB (ou HEX) et CMJN afin que la couleur soit cohérente dans toutes les utilisations.
- Découpez des parties de la conception pour montrer comment les éléments doivent être utilisés.
Extraits et exemples
Que votre guide de style soit imprimé ou un document numérique ou basé sur le Web, il doit être rempli d'outils utilisables. Un des éléments qui peuvent être incroyablement utiles sont des exemples de choses à faire et à ne pas faire. Il peut être facile de mettre l'accent sur ce que vous voulez voir visuellement avec la marque.
Créez ensuite un catalogue de pièces facilement accessibles. Créez des bibliothèques (ou un ensemble d'éléments communs, selon l'utilisation de votre logiciel) pour tous les membres de l'équipe. Enregistrez les fichiers dans un emplacement commun qui est facilement accessible et pour que les modifications soient relativement faciles à effectuer.
Fournissez une liste d'outils pour les logiciels basés sur le cloud pour toutes les personnes impliquées dans le projet. (Cela inclut les liens, les noms d'utilisateur et d'autres informations de base.) Assurez-vous que tous les packages de polices, logos et fichiers image se trouvent dans un emplacement commun et que tous les utilisateurs savent où ils se trouvent. (Conservez également une sauvegarde ailleurs au cas où quelqu'un recadrerait et enregistrerait l'original.)
Créez une liste principale pour les extraits de code faciles à copier et à coller dans les projets. Il est inutile de créer et de recréer tout ce qui est nouveau à chaque fois. Les éléments communs doivent vivre dans un endroit partagé auquel tout le monde a accès.
La dernière partie de cela est de se souvenir d'évoluer. Les choses vont changer - et elles devraient. Smashing Magazine a une merveilleuse étude de cas qui décrit un «guide de style de vie».
Appliquer le guide de style
Enfin, la plus grande question est «comment amener les gens à suivre les règles?» Vous êtes déjà un bon moyen si vous avez conçu le guide en suivant certains des éléments ci-dessus, en particulier la section sur l'utilisation de concepts simples et spécifiques.
Le guide doit être facile à suivre et utilisable (tout comme votre site Web). Le langage doit être simple et non microgestionnaire, de sorte que les gens voudront suivre les directives.
Ce devrait être un guide qui laisse beaucoup de place à la flexibilité et à la conception réelle. Concevoir dans un ensemble de contraintes peut aider les membres de l'équipe à libérer leur créativité tout en créant quelque chose qui ressemble à votre marque. Le guide de style doit également avoir un propriétaire. Il s'agit de la personne qui approuve les mises à jour et les modifications et peut répondre aux questions sur les décisions de conception. Le «propriétaire» peut être un individu ou une équipe, selon la taille de votre organisation.
Conclusion
Avez-vous déjà un guide de style ou est-il temps d'en créer un nouveau? Il s'agit d'un projet auquel vous devez vous attaquer chaque année, afin que le guide soit à jour à tout moment. (Vous ne pouvez pas blâmer un membre de l'équipe si vous avez de vieilles normes qui circulent.)
Avez-vous ou avez-vous vu d'excellents guides de style? Je suis un vrai geek pour ces choses et j'adorerais les voir. Vous pouvez me contacter sur Twitter ou m'envoyer un e-mail.
){kind=link}