Que faut-il 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 souhaitez donner plus de cohérence à votre projet et mettre tout le monde sur la même page, votre guide de style deviendra inestimable.

Maintenant que nous en avons terminé, 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 dans le sujet aujourd'hui.

Aperçu 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 d’un guide qu’ils apprécient - MailChimp en a l’un des meilleurs et le rend disponible sous une licence Creative Commons - et l’utilise comme modèle pour commencer.

La plupart des guides de style ont deux parties:

  • Directives de rédaction
  • Lignes directrices visuelles

Chaque ensemble de directives est tout aussi important et devrait faire partie de votre guide de style général. Assembler les éléments permettra d'établir une identité globale. Chaque marque ou entreprise ou site Web est également un peu différent. Choisissez une tonalité et un style qui fonctionnent bien en termes de copie et de graphismes, mais qui vous concernent également, ainsi que votre public.

Tenez compte des utilisateurs et des parties prenantes lors de l’établissement d’une identité. La marque correspond-elle à leurs attentes et à leurs attentes? 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é est dans la façon dont vous parlez. aux utilisateurs. Ce style est-il formel ou décontracté? Est-ce verbeux ou plus succinct?

Rédigez votre guide de style de la même manière que la copie sur votre site Web. Cela permettra à votre équipe de savoir ce qui est attendu et comment la langue devrait contribuer à l'identité de la marque.

Cette voix et ton devraient être utilisés dans chaque bit de communication de votre part. Revenez aux grandes lignes de MailChimp pour un aperçu complet de la construction de la voix de la marque. Notez la manière dont la société parle de sa mascotte, par exemple: «Freddie est notre mascotte. Nous ne l'utilisons pas en combinaison avec notre logo. Freddie a toujours raison, et il cligne toujours des yeux.

?Règles? et utilisation

Votre guide de style devrait être votre design? Playbook.? (Est-ce que cela ne semble pas plus convivial que? Règles ??)

Il doit indiquer comment et quand utiliser le type, la couleur et tous les autres types d'éléments de conception de manière simple à comprendre. Voici une liste de contrôle à inclure:

  • Palette de couleurs, y compris les valeurs et les teintes acceptables
  • Palette de typographie, avec tous les poids, tailles, caractères principaux et utilisations acceptables
  • Logo, y compris les directives pour la taille et l'emplacement
  • Styles d'icônes ou d'éléments (ceci inclut le traitement des éléments allant des boutons aux icônes de partage de réseaux sociaux)
  • Orthographe, choix des mots et style de copie (Quelles directives éditoriales devez-vous suivre? APA, AP, autre chose?)
  • Directives de photographie, y compris couleur, recadrage et présence visuelle
  • Informations de référencement telles que les balises alt 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

Maintenant, voici 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 le contenu de votre guide de style. Ceci est une référence visuelle; le concevoir de cette façon.
  • Regroupez les éléments liés dans des pages pour une référence rapide: une page pour la couleur, une autre page pour la typographie, une page pour la photographie, etc.
  • Montrer des exemples de ce à quoi les choses devraient ressembler. Ne pas expliquer les choses par écrit quand une image suffira.
  • Fournir des détails utilisables. Les échantillons de couleur, par exemple, doivent inclure les mélanges RVB (ou HEX) et CMJN afin que la couleur soit uniforme dans toutes les utilisations.
  • Découpez certaines parties de la conception pour montrer comment utiliser les éléments.

Extraits et exemples

Que votre guide de style soit imprimé, numérique ou basé sur le Web, il doit contenir de nombreux outils utilisables. L'un des éléments qui peuvent être incroyablement utiles sont des exemples de choses à faire et à ne pas faire pour une marque. 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, en fonction de votre utilisation du logiciel) pour tous les membres de l'équipe. Enregistrez les fichiers dans un emplacement commun, facilement accessible, 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 autres informations de base.) Assurez-vous que tous les packages de polices, logos et fichiers image se trouvent à un emplacement commun et que tous les utilisateurs sachent où ils se trouvent. (Conservez également une copie de sauvegarde ailleurs, au cas où quelqu'un rognerait et sauvegarderait l'original.)

Créez une liste maîtresse d'extraits de code faciles à copier et à coller dans les projets. Il est inutile de créer et de recréer chaque nouveauté à chaque fois. Les éléments communs doivent vivre dans un emplacement partagé auquel tout le monde a accès.

La dernière partie est de ne pas oublier d'évoluer. Les choses vont changer - et elles le 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 de savoir comment amener les gens à suivre les règles. Vous y êtes déjà très bien si vous avez conçu le guide en suivant certaines des grandes lignes 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 micromanage, afin que les gens veuillent 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 devrait également avoir un propriétaire. C'est la personne qui approuve les mises à jour et les modifications et peut répondre aux questions concernant les décisions de conception. Le propriétaire? peut être un individu ou une équipe, en fonction de la taille de votre organisation.

Conclusion

Avez-vous déjà un guide de style ou est-il temps d'en créer un nouveau? C’est un projet auquel vous devriez vous attaquer chaque année afin que le guide soit à jour en tout temps. (Vous ne pouvez pas critiquer un membre de l'équipe si d'anciennes normes flottent dans le monde.)

Avez-vous ou avez-vous vu d'excellents guides de style? Je suis un geek total pour ces choses et j'aimerais les voir. Vous pouvez me contacter sur Twitter ou me laisser un email.