Guides
Guides et tutoriels sur la création de site
Guides et tutoriels sur la création de site
Guides et tutoriels sur la création de site
Vous le savez sûrement déjà, mais internet fait partie intégrante du processus de consommation. Et cela n’a jamais été aussi vrai, comme le montrent ces statistiques Alioze :
85,5% des Français achètent en ligne en 2020,
30% des consommateurs sur le web achètent directement via les réseaux sociaux,
Presque 68% des décisions d’achat sont influencées par les avis consommateurs en ligne. (Source : netoffensive)
Il est donc dans l’ordre des choses, pour une entreprise en 2020, de soigner son branding digital et de construire l’identité visuelle de son site web avec minutie.
Dans ce guide, on va disséquer ce concept d’identité visuelle numérique et répondre à ces questions :
De quoi se compose-t-elle ?
Quels en sont les enjeux réels ?
Et surtout, comment l’optimiser ?
Prêts à obtenir toutes les réponses ?
L’identité visuelle numérique est l’une des composantes essentielles de l’image de marque : la première fait partie de la seconde. Donc, si vous voulez améliorer votre image de marque, il faudra façonner votre identité visuelle, et vice versa.
C’est en quelque sorte sa “carte d’identité graphique” : elle est constituée de l’ensemble des éléments visuels rattachés à votre société.
Il peut s’agir :
du logo,
de la typographie,
des illustrations,
photos et vidéos que vous utilisez,
des couleurs,
des icônes que vous avez choisies, etc.
Pas de panique, nous allons voir en détail tous ces éléments juste après.
L’identité visuelle véhicule tout aussi bien les valeurs, l’esprit, et les activités de votre société.
💡 Par exemple, si on évoque un “M” jaune, une pomme ou une sirène verte, vous avez directement le nom de ces marques en tête. Et c’est grâce à leur identité visuelle.
Idéalement, si elle est efficace, elle résume toute votre entreprise en quelques nanosecondes, et permet à vos visiteurs de reconnaître immédiatement votre marque.
C’est l’ensemble des opinions et sentiments que peuvent ressentir les consommateurs vis-à-vis de votre entreprise. Cela conditionne la façon dont les utilisateurs vont parler de vous.
Elle est donc fortement déterminée par votre identité visuelle.
Bon, l’identité visuelle, on sait maintenant ce que c’est. Mais à quoi ça sert au juste ?
Photo de Tranmautritam provenant de Pexels
Dans l’idéal, votre identité visuelle remplira les objectifs suivants :
👉 Plaire à votre clientèle-cible : vous créer une grande communauté de consommateurs attachés à votre marque.
👉 Asseoir la notoriété de votre entreprise : faire de votre marque une entité reconnaissable immédiatement, avec une excellente réputation. Tout simplement 🙂
👉 Vous offrir de la crédibilité auprès de vos différents partenaires afin d’inspirer pleine confiance à vos collaborateurs.
Vous l’avez compris, votre identité visuelle sur le web comporte bien plus d’utilités qu’un simple logo.
Vous atteindrez (haut la main !) ces objectifs si votre identité visuelle revêt les principales qualités suivantes :
La simplicité :
Sur le web, la simplicité est reine. Évitez de perdre vos consommateurs avec des informations profuses et complexes. Un message simple sera toujours plus efficace. “Droit au but”, tel doit être votre credo ! 🙂
La cohérence :
La cohérence de votre identité visuelle devra être respectée à différents niveaux. La cohérence est d’ailleurs la composante la plus importante lors de la création de votre identité.
Elle tâchera d’être en accord avec les valeurs de votre entreprise, mais il devra également exister une parfaite unité graphique sur tous les supports de communication utilisés, que ce soit sur papier ou sur internet.
En somme, la cohérence graphique devra permettre, à la fois, la connaissance et la reconnaissance de votre marque.
Le sens :
Les éléments de votre identité visuelle ne sont pas choisis uniquement pour leur aspect esthétique. Ils sont sélectionnés pour leur signifiance, et leur portée psychologique.
Vous l’avez compris, pour votre identité visuelle, le hasard n’existe définitivement pas : tout choix se fait à dessein et pour une raison bien fondée.
Si votre identité visuelle digitale a du sens, elle parlera plus facilement aux visiteurs de votre site.
L’originalité :
Enfin, votre identité visuelle devra vous permettre de vous démarquer, et de marquer (les esprits). Sans bafouer le principe de cohérence avec votre activité dont nous avons parlé plus haut, vous devez vous démarquer des autres.
ous savez exactement les objectifs à atteindre grâce à la création de votre identité visuelle. Place à la pratique !
Photo de Tranmautritam provenant de Pexels
Avant de plonger dans le grand bain et de commencer la création de son identité visuelle, il est judicieux de passer en revue les quelques points listés ci-dessous :
Votre positionnement :
Qui sont vos concurrents ? Qu’est-ce qui vous différencie d’eux ? Qu’est-ce qui fait que vous ne leur ressemblez pas (et que vous êtes, on le sait, bien meilleurs 😉) ?
Votre clientèle-cible :
Quel est le profil-type de vos clients ?
Qui, diantre, sont ces mystérieuses et formidables personnes qui s’intéressent à votre marque ? Et pourquoi ?
Comprendre les éléments déterminants qui font que ces clients viennent et reviennent sur votre site est primordial.
Vos objectifs en termes de communication :
Quelles valeurs et quelle atmosphère souhaitez-vous voir rattachées à votre marque ?
Plutôt la douceur, ou le dynamisme ? La modernité ou l’esprit vintage ?
Une fois vos intentions bien définies, vous êtes prêts à passer aux étapes suivantes :
Trouvez les marques qui vous plaisent afin de vous inspirer.
Pour cela, consultez leur site web de fond en comble. Parcourez toutes les catégories, inscrivez-vous à la newsletter, essayez de lancer un processus d’achat et observez les mails de relance…
Faîtes une analyse complète pour comprendre le fil conducteur de leur identité visuelle digitale.
👉 Sélectionnez les canaux de communication à utiliser en fonction de votre clientèle et de vos objectifs. Vous savez à présent qui est votre public, et quelles sont ses habitudes : préfèrent-ils aller sur Facebook, recevoir un mail, ou regarder une vidéo... ? Allez les trouver là où ils se trouvent !
👉 Choisissez votre style. Vous pouvez opter pour un style rétro, du flat design ou encore une identité très classique et épurée.
👉 Demandez l’avis de votre entourage et de vos clients. Comme vous êtes certainement très bien entouré(e), ils vous feront sans doute remonter des remarques particulièrement judicieuses auxquelles vous n’auriez pas forcément pensé. Cela vous permet de prendre du recul, et d’avoir une compréhension encore plus fine des attentes des utilisateurs.
👉 Rédigez éventuellement une charte graphique, définissant tout cela à l’écrit et avec précision. Rien de tel qu’un bon document Word pour que les choses soient bien claires pour tout le monde !
Cette fois-ci, on est vraiment prêts à se lancer pour de bon dans le vif du sujet. Mais, par quoi on commence ?
Pour créer l’identité visuelle de votre site web, vous pouvez bien évidemment demander l’aide d’un professionnel du web design.
Vous devrez, en tout cas, vous pencher scrupuleusement, sur l’ensemble des éléments qui suivent :
Pour créer votre logo, deux options s’offrent à vous :
Faire appel à un professionnel du graphisme. Si votre budget le permet, que vous souhaitez un résultat professionnel et n’avez pas le temps de temps à y consacrer, c’est la meilleure option pour vous ! Comptez entre 300 € et 1300 € selon si vous embauchez un freelance débutant ou une agence.
Le créer vous-même en utilisant des outils en ligne. Rendez-vous à la fin de l’article pour notre sélection des meilleurs outils. 😊
Votre logo devra être accessible dans toutes les tailles et être déclinable en noir et blanc. Pensez également à créer des sous-logos pour vous permettre d’apposer votre identité sur tous les supports.
Par exemple, sur la charte graphique de Scrimshaw Coffee, on y retrouve des sous-logos. Bien qu’ils soient de formes différentes, ils entretiennent une cohérence visuelle.
Et surtout, n’oubliez pas de protéger juridiquement votre beau logo flambant neuf en le déposant auprès de l’INPI. Le dépôt du logo, ou de l’ensemble de votre identité visuelle, peut être fait en même temps que celui de votre nom de marque.
Les couleurs sont drôlement fortes : elles influent sur notre comportement, sans que l’on en ait forcément conscience.
Par exemple, la couleur violette évoque la royauté, le mystère, la spiritualité, le luxe alors que le bleu s’adapte davantage à la technologie de pointe, l’intelligence, le calme, la confiance, la stabilité, le pouvoir.
En quelques secondes à peine, nous voilà transportés dans une ambiance ou un état d’esprit bien spécifique, rien qu’à travers une certaine combinaison de couleurs.
Choisissez les vôtres en connaissance de cause !
Pour ne pas rendre votre identité visuelle trop floue et peu reconnaissable, optez pour des combinaisons qui ne dépassent pas les cinq couleurs, avec deux couleurs sobres pour vos typographies.
Et, en parlant typographie...
De la même façon, le choix de votre police d’écriture aura un impact instantané sur vos visiteurs.
Par exemple, une police manuscrite suggérera l’intimité, tandis qu’une “font” plus épaisse évoquera la force et la stabilité.
Et, si aucune des polices déjà existantes ne vous convient, vous pouvez également faire appel à un graphiste afin de créer la vôtre !
Dans tous les cas, essayez de ne pas dépasser les 3 polices différentes sur votre site web. L’une d’entre elles doit être très claire et agréable pour faciliter la lecture des utilisateurs.
💡 Dans tous les cas, fuyez la Comic sans MS au risque d’affaiblir considérablement votre image de marque.
Pour vos visuels-clés, vous pouvez tout aussi bien choisir des illustrations, des photos, ou des vidéos, des effets ou animations…
Bref, vous avez l’embarras du choix !
Cependant, gardez en tête ces conseils pour vous aider à élaborer vos visuels :
Utiliser des photos originales :
Essayez d’éviter les banques d’images gratuites pour vos visuels. Si vous utilisez des photos originales, vous gagnez en authenticité et vous vous démarquez de la concurrence.
Avoir recours au format vidéo :
La vidéo est le format le plus engageant pour les utilisateurs. En effet, le taux de conversion des sites web intégrant la vidéo est 34% plus important que celui des sites n’utilisant pas ce format. (Semrush) Convaincant, non ?
Créer des illustrations 3D :
Pour prendre le contre-pied des illustrations classiques, vous pouvez opter pour la 3D ! Vous vous différenciez des concurrents tout en apportant un esprit sympathique à votre site web.
Vous pouvez prendre l’exemple d’Ulysse. Lors de la refonte de leur identité visuelle, ils ont opté pour des illustrations 3D originales et colorées.
Dans tous les cas, faites votre sélection en ayant bien en tête les émotions que vous souhaitez susciter autour de votre marque.
Sélectionnez vos éléments graphiques de façon cohérente. Les éléments graphiques incluent :
Les formes de vos boutons cliquables,
Les icônes pour indiquer vos réseaux sociaux par exemple,
Les pictogrammes...
Vous serez toujours en recherche de cette fameuse “unité graphique” déjà évoquée.
Vous pouvez aussi utiliser des lignes, des formes géométriques, ou des aplats de couleurs…
Le champ des possibles est immense !
Enfin, n’omettez surtout pas de travailler le layout de votre site.
Une mise en page claire et soignée fait toute la différence. Le but à ne pas perdre de vue, c’est de faciliter la vie de vos visiteurs : il faut qu’une visite sur votre site s’apparente davantage à une agréable promenade balisée qu’à un “hors-piste” dangereux.
En conséquence, créez un menu de navigation rationnel, et des sections claires et pertinentes. Vous pouvez structurer votre menu à l’aide de lignes de séparation, d’images en pleine largeur d’écran ou de fonds de couleurs.
De plus, selon l’emplacement des divers éléments, les informations de vos pages n’auront pas le même impact sur vos visiteurs.
Par exemple, on sait que tout ce qui est au-dessus de la ligne de flottaison, c’est-à-dire en haut d’une page web, a beaucoup plus de chances, d’être vu, en particulier les éléments situés dans le coin supérieur gauche.
Ce n’est pas pour rien si presque tous les sites web placent leur logo en haut à gauche !
Pensez également à bien dégager vos boutons d’appel à l’action, histoire qu’on ne puisse pas les manquer. Ils sont généralement centrés sur la page web, et ponctuent le contenu si cela est nécessaire…
On n’y pense que rarement, mais la signature de vos mails constitue aussi un élément de votre identité visuelle.
En créant une signature personnalisée qui correspond à votre site web, vous diffusez facilement et rapidement votre identité.
Et là, vous vous dîtes que le travail d’élaboration d’une identité visuelle est bien plus fastidieux que l’on peut le penser.
Heureusement, vous pouvez utiliser ces outils efficaces (et gratuits pour la plupart !) pour vous faciliter la tâche.
Canva, pour créer ses éléments
Canva est l’outil de création visuelle gratuit par excellence. Très intuitif et complet, il vous permet de créer des logos, des designs et ajouter différentes typographies en quelques instants.
✔️ Les dimensions des différents formats pour chaque réseau social sont déjà enregistrées. Vos visuels peuvent s’adapter à une couverture Facebook comme un post Instagram en quelques clics.
❌ Certaines fonctionnalités ne sont accessibles qu’avec une licence Canva payante. Mais, rassurez-vous, vous aurez l’embarras du choix avec la version gratuite.
Prezi, pour défendre son identité visuelle
Prezi est un outil gratuit très utile pour présenter votre identité visuelle. Comme un Powerpoint, mais en mieux, Prezi vous permet de faire défiler les éléments de votre présentation grâce à des zooms et des dé-zooms. De quoi changer les codes de la diapositive classique afin de dynamiser votre présentation !
✔️ Prezi vous offre une multitude de modèles que vous pouvez personnaliser à votre convenance, ou même partir d’une base vierge.
❌ Si vous optez pour la version gratuite, vous ne pouvez pas télécharger votre présentation. Prezi est donc à privilégier pour une utilisation uniquement sous connexion.
Photoshop, pour les experts
Les plus aguerris d’entre vous peuvent pencher vers l’option Photoshop. En effet, le logiciel d’Adobe est la Rolls Royce en termes de création visuelle.
✔️ Photoshop vous permet de pouvoir réaliser tous les visuels possibles...
❌ … à condition de maîtriser le logiciel. Sa prise en main peut être fastidieuse pour les non-initiés. S’il dispose d’une version d’essai gratuite, vous devrez rapidement passer à une version payante.
The Noun Project, pour les icônes
The Noun Project est une banque d’icônes originales et minimalistes. Vous n’avez qu’à vous créer un compte avec une adresse mail pour y accéder.
✔️ Avec plus de deux millions d’icônes disponibles et une banque alimentée régulièrement, vous trouverez forcément votre bonheur !
❌ Pour customiser les icônes et ne pas avoir la signature du créateur sur le visuel, vous devez opter pour un téléchargement payant.
Frontify, pour réunir tous vos éléments
Frontify est une plateforme pratique lorsqu’il s’agit de créer une identité visuelle. Vous pouvez réunir tous vos éléments sur un même espace, et le partager à tous vos collaborateurs. Plus besoin de chercher les codes des couleurs et le nom des typographies, tout est ici !
✔️ Frontify vous permet de modifier votre identité visuelle dès que vous jugez cela nécessaire, et ces changements seront mis à jour pour toutes les personnes ayant accès au document.
❌ La licence payante de Frontify peut s’avérer onéreuse si vous avez des identités visuelles pour plusieurs sites à créer.
Le moodboard, pour guider sa création
La méthode facile et gratuite pour créer votre identité visuelle, c’est le moodboard ! La planche tendance vous permet de réunir toutes vos inspirations et de poser l’atmosphère de votre marque.
Tenté(e)s par le moodboard ? Consultez notre guide complet pour concevoir le vôtre !
Nous venons de parcourir ensemble les lignes directrices pour commencer à créer l’identité visuelle de votre site internet.
Et vous voyez qu’avec un peu de méthode et quelques conseils, la création de l’identité visuelle digitale devient un long fleuve tranquille !
Il ne vous reste plus qu’à donner le meilleur de votre créativité, et nous sommes on ne peut plus impatients de voir le résultat de votre travail !
Dernière mise à jour : 02 septembre 2020
