Site web Archives - Chickadee Blue - Studio graphique

Avez-vous besoin de créer un site internet pour communiquer ?

Margaux AVERTY — Fri, 09 Jun 2023 11:10:47 +0000

Avez-vous vraiment besoin de créer un site internet ?

Créer un site internet demande des ressources et du temps. Que vous fassiez appel à un prestataire ou que vous vous remontiez les manches, ce n’est pas un projet qui s’improvise. Cet article vous aidera à comparer les différentes solutions qui s’offrent à vous, mais aussi à anticiper les moyens nécessaires pour mener à bien sa création.

Quelles solutions pour créer votre site internet ?

Les plateformes de création de site : Wix, Squarespace, Hubspot...

De nombreuses plateformes permettent de créer un site web sans savoir coder ou posséder compétences techniques particulière. Et le mieux ? Elles sont parfois gratuites ou généralement accessible avec une offre de base très accessible. Elles vous promettent une création de site facile : en quelques heures, vous avez un site unique et fonctionnel. Vraiment !? La réalité est souvent bien différente.

Car les options incluses dans les offres de base sont souvent très limitées. Il y ait donc peu de chances qu’elles vous permettent de créer le site internet professionnel dont vous rêvez… Vous devrez alors investir dans un forfait plus cher ou l’achat d’options supplémentaires pour obtenir les fonctionnalités souhaitées. Et la note peut vite, mais alors très vite, grimper !!

Sans compter que serez alors totalement dépendant.e de cette plateforme. Si les prix augmentent d’une année à l’autre, vous serez obligé.e d’accepter ces nouveaux tarifs au risque de perdre le travail réalisé sur votre site. Ou contraint.e de trouver une autre solution rapidement, avec le temps et l’énergie que cela prend. Ajoutez à cela des techniques de rétention dont il n’est pas toujours évident de se dépêtrer sans l’aide d’un professionnel.le et vous voilà dans la panade…

Cela peut être une bonne solution pour la création d’un site vitrine simple, mais vous pouvez vite être limité.e en fonction de votre forfait. Attention donc à bien comparer les options en fonction des fonctionnalités / évolutions souhaitées pour votre site.

Les CMS (Content Management System) open source : WordPress.org, Joomla, Drupal...

Heureusement, il existe des solutions gratuites, comme les CMS open sources. Pour démarrer, il vous faudra néanmoins investir dans un forfait d’hébergement, et l’achat de votre nom de domaine. Et c’est tout ! Même si bien-sûr, certaines extensions ou thèmes sont disponibles en version gratuite et payante, vous n’avez à priori pas besoin de débourser quoi que ce soit pour créer votre site internet.

Pour ma part, j’ai créé mon site internet avec WordPress.org (attention à ne pas confondre avec WordPress.com) et n’ai jamais eu à acheter quoi que ce soit. Les thèmes et extensions gratuites ont largement suffi. Mais il est vrai que cela demande un certain investissement personnel pour prendre en main la plateforme… On n’a rien sans rien ! Une solution moins facile donc, mais qui vous garantit davantage d’autonomie dans la gestion de votre site web.

En soit, la solution la plus pérenne et pratique si vous souhaitez gérer votre site et le faire évoluer comme bon vous semble, à petit prix. Cependant il faudra prévoir du temps pour se former et/ou s’approprier la plateforme car elle demande davantage d’autonomie.

Faire appel aux services d'un prestataire spécialisé

L’avantage de faire appel à un prestataire, c’est évidemment d’obtenir un service personnalisé et adapté à vos besoins. Certains créateurs de sites internet ont parfois une double casquette de graphiste. Ce qui peut être pertinent si vous souhaitez créer votre identité visuelle en même temps que votre site web.

Cependant, comme pour les plateformes, vous pouvez devenir assez dépendant.e de ce prestataire. Attention donc à bien comparer les offres : comment se déroule la livraison du site, la maintenance régulière est-elle incluse, et combien de temps ? Vérifiez également le niveau d’autonomie que vous obtenez à sur le site, pour le mettre à jour ou ajouter des articles par exemple. Si oui combien de temps, et que comprend-elle ?

Car toute manipulation future sur le site aura un coût, à prévoir bien-sûr. À contrario, l’utilisation en totale autonomie de ton site une fois finalisé n’est pas à prendre à la légère si vous ne vous sens pas capable de gérer cela seul.e.

Si vous avez le budget, et que c’est le bon timing pour vous, foncez ! Cela sera d’autant plus intéressant si vous souhaitez créer un site relativement complexe en termes de fonctionnalité, ou original dans son interactivité. Mais c’est évidemment un coût qu’il faut anticiper.

Seul.e ou accompagné.e, la création d'un site internet ne s'improvise pas

Quels sont les objectifs de votre site internet ?

Vous vous en douter, créer un site sans réel objectif derrière, c’est jeter du temps et de l’argent par les fenêtres. Je vois beaucoup de entrepreneurs créer un site dès le lancement de leur activité, sans savoir vraiment comment ils comptent l’utiliser, le faire vivre, et l’intégrer dans une stratégie de communication globale ! Pourtant, un site visible mais non terminé, ou mal pensé, n’apportera rien à leur développement. Voire même, pourra renvoyer une image peu professionnelle de votre activité.

Réfléchissez donc à la fonction que ce site doit remplir.

- - - Présenter efficacement vos services et votre activité à vos prospects ?
    - Permettre à plus de gens de vous trouver sur internet ?
    - Proposer du contenu de façon plus personnalisée à votre audience ?
    - Vendre vos produits et/ou prestations directement sur votre site ?

Car bien-sûr, de votre objectif dépendra la structure du site, son organisation et son contenu. Ce qui nous amène au deuxième point essentiel.

Avez-vous déjà les éléments et contenus nécessaires à la création de votre site ?

Si vous souhaitez optimiser votre présence sur le net, et gagner en visibilité, il faut penser votre site pour qu’il réponde aux exigences des moteurs de recherche, mais aussi pour qu’il offre une expérience agréable à vos utilisateurs.

Cela passe par une structure hiérarchique claire de votre contenu, une recherche sur les mots clés et le champs lexical le plus adapté par rapport à vos sujet, et une arborescence pertinente pour les différentes pages et sections de votre site.

Ça, c’est pour le fond. Mais la forme compte aussi 🙂 ! Votre site a besoin d’une identité visuelle qui lui est propre, avec un design soigné pour rendre la visite d’un utilisateur fluide et agréable. Enfin, cet habillage doit être adapté à tous les types d’écran (responsive) pour une lisibilité optimale.

Comment faire vivre et évoluer votre site internet ?

Peu importe le type de site que vous créez : one page vitrine, blog ou site e-commerce… Vous devez vous assurer qu’il soit à jour d’un point de vue technique, informatique, et esthétique.

- - - Design et esthétique : le web évolue rapidement, un site web au design et à la mise en page obsolète dénote, et n’inspire pas confiance aux utilisateurs. Pensez à faire évoluer le design et l’identité de votre site internet pour qu’il rassure votre audience et renvoie une image professionnelle de votre activité.
    - Mises à jour et contenu récent : Les moteurs de recherche aussi se méfient des sites inactifs et dont le contenu n’évolue pas. Pour être bien référencé, il vaut mieux donc mettre à jour son site et/ou ajouter du contenu régulièrement. Pour Google par exemple, un contenu récent est à priori plus pertinent qu’un autre dont les informations n’ont pas été mises à jour depuis des mois voire des années… Ensuite, parce que des mises à jours techniques doivent être réalisées sur ton site pour le rendre plus performant, plus rapide, moins lourd, et compatible avec les versions des moteurs de recherche.
    - Informations et contenus pertinents : votre contenu doit être à jour pour vos visiteurs. Faites le tri dans vos articles, pour ne garder que les plus utiles; gardez à jour votre catalogue de services et/ou produits, vérifier vos coordonnées au fil des ans, etc.
    - Respect de la règlementation : votre site a beau vous appartenir, il doit respecter la règlementation en vigueur concernant le numérique : pour la protection des données (le fameux RGPD) par exemple, mais aussi les mentions légales, l’affichage nécessaire ou non des conditions de vente ou d’utilisation sur le site et bien-sûr la sécurité du site de manière générale.

Alternatives à la création d'un site internet pour votre activité

Le site internet sera précieux pour proposer du contenu durable, interactif, et personnalisé. Vous n’êtes pas dépendant d’une plateforme tierce et pouvez organiser votre contenu et vos pages comme bon vous semble. Mais vous l’avez vu, sa création est un projet qui demande réflexion et préparation. Vous pouvez utiliser d’autres alternatives en attendant d’être prêt.e et d’avoir le budget nécessaire.

Réseaux sociaux et plateformes de partage

Les réseaux sociaux peuvent vous permettre d’acquérir de la visibilité, de te créer une audience et une communauté. Le tout est de bien cibler celui qui va être le plus intéressant pour répondre à vos objectifs, en fonction de votre audience mais aussi du type de contenus que vous partagez.

Pour partager les informations générales de votre activité (coordonnées, horaires d’ouverture, contact, liste de services…) vous pouvez créer une page Google My Business. Très simple à faire, mais assez efficace puisque vous serez directement référencé par les moteurs de recherche. À savoir que l’interface évolue pour proposer davantage de fonctionnalités et partager ainsi plus d’éléments. Cela vous permettra aussi de recueillir des avis clients, ou de pouvoir localiser votre entreprise très simplement ce qui peut-être particulièrement important selon votre activité.

Si vous souhaitez partager des documents et contenus plus variés, il existe aussi des applications permettant de générer des pages d’atterrissages très simples. Par exemple, Linktree, que l’on voit sur les comptes Instagram – le fameux “link in bio” – a été justement conçu pour répondre à la limite du partage d’un lien unique dans les biographies. Vous pourrez alors rediriger l’utilisateur vers différents liens : vidéos, article, abonnement à une newsletter, contact, document à télécharger, et j’en passe !

Landing page simples et tunnels de vente

Dans un autre genre, des outils comme system.io permet de créer des tunnels de vente et partager des contenus assez facilement. Il va être très pratique si vous vendez des formations en ligne par exemple, ou proposez des tutoriels, du coaching, des webinaires… Entre autres fonctionnalités, comme le blog.

Parfois, les solutions les plus simples sont les meilleures : si tu veux partager un contenu à télécharger, pourquoi ne pas partager un lien vers un dossier Cloud comme Google Drive ou Dropbox ? Si vous souhaitez simplement le diffuser, des applications comme Calameo font également très bien l’affaire !

Tu peux aussi créer des landing page toutes simples avec des outils comme Canva ou Notion. Bon alors ce ne sera pas forcément une solution adaptée pour du long terme, mais cela peut permettre de partager un lien vers une présentation et de consulter certaines informations :).

Marketplaces et boutiques en ligne

Enfin, si vous voulez créer une boutique en ligne, il est préférable de tester votre offre avant d’investir dans un site e-commerce. Heureusement, de nombreuses marketplaces peuvent vous permettre de vendre vos produits ou services : Etsy, RedBubble, ou Fait Maison pour ne citer qu’eux. Quelques recherches pourront vous donner des idées plus pertinentes en fonction de votre activité !

Elles vous permettent non seulement de vous confronter directement au marché, mais également de profiter d’une très large audience ! Le tout, évidemment, sera d’essayer de vous démarquer des autres car la concurrence est rude, il faut l’avouer. Mais ça peut vraiment valoir le coup avant de construire votre propre boutique en ligne. Quitte à continuer ensuite à vendre via ce canal pour toucher davantage de potentiels acheteurs. Sans compter que certaines personnes seront plus enclines à acheter sur une plateforme connue que sur un petit site indépendant…

L’article Avez-vous besoin de créer un site internet pour communiquer ? est apparu en premier sur Chickadee Blue - Studio graphique.

Intégrer son identité visuelle sur son site web en 4 étapes

Margaux AVERTY — Tue, 26 Jul 2022 11:23:05 +0000

Intégrer son identité visuelle sur son site web en 4 étapes

Que vous créez votre site web seul.e ou que vous fassiez appel à un.e prestataire, il vous faudra décider des axes créatifs majeurs pour l’aspect et l’univers de celui-ci. Voici 4 étapes incontournables pour décliner votre identité visuelle sur votre site internet.

Intégrer son identité sur un support papier VS sur une page web : quelques différences

Une page internet ne se parcoure par de la même façon qu’une brochure ou un flyer.

D’abord, parce qu’on ne découvre pas forcément son contenu dans un sens précis. Un.e internaute peut tomber sur votre site via sa page d’accueil, ou une page produit, une photo, ou la section « à propos ».

Votre identité visuelle doit donc être présente sur chaque page de votre site de façon cohérente. Mais on doit également comprendre rapidement sur quel genre de site on se trouve.

Ensuite, il faut prendre en compte que le format de lecture change en fonction de l’appareil utilisé par un visiteur. Mobile, tablette, ordinateur grand écran ou portable à la résolution plus réduite ?

Il faudra donc adapter votre mise en page et le design du site pour anticiper son aspect aux yeux de l’internaute. Ce qui peut nécessiter quelques concessions de design pour obtenir un affichage optimisé.

Enfin, l’interaction avec le site est différente d’un support papier : on scrolle, on clique, on parcoure le contenu très rapidement. Il est donc important de créer un dynamisme visuel pour arrêter l’œil du visiteur et l’inciter à continuer la lecture.

L’information doit être claire, succincte et précise, afin que l’internaute trouve rapidement ce qu’il cherche sur le site.

Étape 1 : Choisir les formats les plus adaptés de votre logo

Où placer votre logo sur le site ?

Votre logo doit être placé à des endroits stratégiques sur votre site internet. Généralement, le header (en haut, avec le menu) et le footer (tout en bas de votre site).

Il faut donc choisir les versions les plus adaptées de votre logo pour garantir sa lisibilité. On essaiera par exemple de ne pas avoir une entête de site trop haute afin de ne pas empiéter sur le contenu du site. Sélectionnez par exemple la déclinaison allongée ou simplifiée de votre logo.

Pour le pied-de-page, vous pouvez intégrer la version complète de votre logo ou sa version pictogramme. L’espace est plus libre car le footer d’un site peut être assez haut, en fonction des informations et des liens que vous allez y faire apparaître.

Pour en savoir plus sur les déclinaisons de votre logo...

Vous pouvez lire l'article suivant qui détaille l'ensemble des fichiers qui doivent vous être livrés quand vous faites créer un logo par un graphiste.

Ne pas oublier le favicon du site !

C’est la petite vignette ronde qui s’affiche à côté du nom d’une page ouverte sur internet. À la base, il sert à l’internaute pour identifier rapidement votre site dans sa barre de favoris, d’où la contraction des mots favorite et icon. Cela permet aussi de repérer rapidement un site parmi plusieurs dizaines d’onglets ouverts simultanément -hello à celles et ceux qui se reconnaissent ;)-.

Le favicon se télécharge dans un format image carré très petit (16×16 pixels, 32×32 ou 96×96). On privilégie donc là encore une déclinaison minimaliste du logo.

Si celle-ci ne convient pas, vous pouvez en créer un en reprenant les couleurs de votre logo et pourquoi pas, les initiales de votre nom de marque. L’important est juste que l’on associe à votre marque pour l’identifier rapidement.

Étape 2 : Décliner les couleurs de votre univers sur une page web

Créez un code couleur pour votre site internet

Si vous possédez déjà une palette de couleurs pour votre identité visuelle, c’est parfait ! Il s’agit surtout de sélectionner les plus appropriées pour la mise en page et le design du site.

Je vous conseille donc d’attribuer un rôle aux couleurs de cette palette que vous veillerez à conserver sur toutes les pages du site.

Concrètement, reprenez vos couleurs principales (celle du logo généralement) et associez-les avec quelques couleurs supplémentaires. Par exemple, une couleur d’accentuation pour les appels à action ou les liens hypertextes, une teinte plus neutre pour des encarts d’information ou un arrière plan, etc.

Sur votre site, la couleur va apporter clarté et dynamisme à votre contenu. Elle doit être utilisée plus comme un outil de lecture que comme un élément purement « décoratif ». N’hésitez donc pas à vous limiter dans le nombre de couleurs à utiliser afin de garder une cohérence sur vos pages. Le plus important est de guider la lecture de celles-ci et non pas de surcharger le rendu visuel.

Vérifiez les contrastes et la luminosité des couleurs

Pensez ensuite à vérifier que les couleurs fonctionnent entre elles et sur tous les supports (ordinateur, mobile…). En effet, le rendu visuel peut différer d’un écran à l’autre en fonction de sa résolution ou sa luminosité. Il existe aussi des paramètres pour réduire la lumière bleue qui peut jaunir quelque peu les couleurs.

D’ailleurs, de plus en plus d’applications, d’appareils ou de navigateurs proposent une option dark mode, qui permet un affichage sombre. C’est pourquoi sur certains constructeurs de site, vous pouvez paramétrer directement un thème de couleurs claires et un thème de couleurs sombres. Mieux vaut les paramétrer si vous voulez contrôler l’apparence de votre site jusqu’au bout.

Vous trouverez des sites gratuits pour générer des palettes de couleurs ou bien vérifier leurs contrastes entre elles dans l’onglet « Ressources >> Outils gratuits » du site.

Si vous n'avez pas encore de palette de couleurs pour votre identité visuelle...

Vous trouverez des idées et des conseils pour en créer une dans un article dédié à ce sujet !

Étape 3 : Quelle(s) typographie(s) pour votre site web ?

Prévoyez une police compatible avec le web

Auparavant, on retrouvait les mêmes polices d’écriture sur les sites internet : les polices dites web safe. Leur nombre était très limité et on les voyait donc partout.

Elles avaient cependant l’avantage d’être pré-installées sur tous les périphériques et systèmes d’exploitation. Et s’affichaient donc correctement sur tous les supports et navigateurs.

Aujourd’hui, on peut tout à fait personnaliser les polices d’écriture sur un site web. Mais cela ne veut pas dire qu’elles soient toutes adaptées pour cet usage.

En effet, si vous importez une police d’écriture personnalisée sur votre site internet, vous ne pouvez pas être sûre qu’elle s’affichera parfaitement sur le navigateur d’un.e internaute. Pour cela, il faut que son navigateur charge les éléments de la police, et parfois ce n’est pas possible : paramètres de sécurité, faible connexion, chargement lent, etc.

La meilleure solution pour éviter ce problème est d’utiliser des polices web fonts. À la différence des polices web safe, celles-ci sont hébergées directement sur votre serveur local ou par la plateforme qui les fournit. Les plus connues proviennent de Google Fonts. Vous pouvez y trouver des centaines et des centaines de polices téléchargeables gratuitement, et parfaitement adaptées pour un usage web.

Vous pouvez bien-sûr utiliser ces polices pour votre identité visuelle, car elles ne sont pas limitées à un usage digital.

Si votre police actuelle n'est pas compatible avec le web :

N’hésitez pas à définir une nouvelle police web, utilisée spécialement pour votre site internet. Elle peut être similaire à celle de votre identité visuelle, ou non. L’important est d’assurer une expérience optimale pour les visiteurs de votre site.

Si vous souhaitez utiliser votre police personnalisée :

Vous pouvez intégrer votre propre police, mais par précaution, pensez à paramétrer une police de substitution. Elle s’affichera si le téléchargement de la vôtre n’est pas possible pour une quelconque raison.

Avoir sous le coude une police de secours type Arial, ou Tahoma, qui sont installées sur tous les périphériques, est utile pour contrôler l’apparence de vos contenus dans toutes les situations.

Bien utiliser les polices sur vos pages web

Là encore, il s’agit de créer un fil rouge entre toutes les pages du site. Définissez à l’avance l’apparence de vos titres, des paragraphes standards ou d’accentuation, la forme de vos boutons, etc. Et tenez-vous à cette grille pour pour que votre contenu soit hiérarchisé et donc facilement reconnaissable.

Un autre point important concerne l’interlignage, c’est à dire l’espacement entre vos lignes de paragraphes, vos titres, etc.

Sur un site web, un interlignage aéré va faciliter la lecture. De la même façon, veillez à garder des marges suffisantes autour de vos paragraphes et à « découper » le contenu en petites portions. Des colonnes moins larges sont plus agréables à lire car l’œil n’a pas à parcourir toute la largueur de l’écran.

Enfin, keep it simple ! Sur le web, mieux vaut rester sobre et efficace. Pour vos textes, privilégiez une police sans sérif qui seront bien plus adaptée pour une lecture sur écran.

Les polices sérif peuvent être utilisées, mais privilégiez-les pour les titres ou les petites bulles d’informations courtes.

Certaines plateformes vous aident à trouver des combinaisons ou des inspirations de typographies pour ton site internet, par exemple : Web Font Inspiration ou Type Inspiration.
Vous pouvez aussi vous inspirer de sites qui vous plaisent ou que vous trouvez bien faits. Des extensions sur Chrome permettent de savoir quelle police a été utilisée sur une page web.

Étape 4 : Intégrer son identité à travers un habillage pertinent

Les éléments de base ont été définis, il s'agit maintenant de donner vie à votre site avec des éléments visuels ! Cette dernière partie va vraiment permettre de décliner votre univers graphique sur votre site, et le rendre plus personnel.

Les icônes, éléments visuels indispensables

Les icônes permettent de guider la lecture en arrêtant le regard sur des éléments visuels. Mais aussi, d’assimiler rapidement une information, grâce à l’association visuel / mot.

Grâce à eux, on peut par exemple repérer très facilement :

les catégories de services ou de produits que vous proposez,
les réseaux sociaux sur lesquels on peut retrouver votre entreprise,
les moyens de paiement disponibles, etc.

Vous pouvez également associer une icône à un bouton pour apporter un complément d’information qui incitera le visiteur à cliquer dessus.

Par exemple, si vous créez un bouton « contact », associé à un icône mail, on sait que l’on sera redirigé vers un formulaire de contact ou une adresse de messagerie, et non pas un numéro de téléphone ou une adresse. À vous de jauger si c’est nécessaire, et de veiller à être clair.e dans la formulation des appels à actions.

Vous pouvez utiliser des icônes fournies par votre constructeur de site, ou importez les vôtres. Pour ça, tu peux faire une sélection sur plateformes d’icônes. Assurez-vous qu’elles aient un style graphique similaire, et que celui-ci matche avec votre identité visuelle.

Le mieux reste évidemment de faire créer vos propres pictogrammes qui correspondent à votre secteur d’activité. Vous vous assurerez alors d’avoir des icônes précis et personnalisés pour décliner votre identité visuelle simplement !

Mon dernier conseil concernant les icônes, c’est évidemment de les utiliser de façon stratégique. Un icône sera d’autant plus efficace s’il apporte quelque chose à la compréhension du contenu. Il est donc inutile d’en placer à tout bout de champ sur vos pages au risque de minimiser leur impact visuel.

Les autres éléments illustrants : photos, illustrations, motifs...

Là encore, si vous n’avez pas d’illustrations ou de photos personnalisées, vous pouvez trouver votre bonheur sur des banques d’images.

Voici quelques conseils pour faire une sélection pertinente :

Définissez des critères de recherches concernant le style des photographies ou des illustrations (ex : couleurs pastels, ambiance rétro, dessin à main levé, noir et blanc…)
Si vous n’avez pas de budget pour acheter des licences, focalisez-vous sur les plateformes gratuites mais pensez bien à citer leur provenance quand vous les intégrer sur votre site
Veillez à les choisir de bonne qualité, et dans des formats adaptés au web : JPEG, PNG ou SVG
Redimensionnez-les pour réduire leur poids et leur chargement : vous pouvez le faire avant de les importer sur le site, ou grâce à des extensions prévues pour ça.

La question reste de savoir comment et où intégrer des images sur votre site ?

Définissez d’abord les éléments illustrants qui apportent une information ou de la valeur à l’internaute.

Sur une page à propos, une belle photo de vous ou de votre équipe sera appréciée, car cela met en confiance un potentiel client de mettre un visage sur un nom.
Si vous créez un site marchant, des photos produits seront évidemment recherchées par le visiteur car il veut voir ce qu’il achète.

Vous pouvez intégrer les images de différentes façons : tout simplement à côté du texte, mais aussi en arrière plan, ou en jouant avec la transparence.

Si vous ajoutez du texte par dessus une image, fais juste attention à ce qu’il reste parfaitement lisible. Ajustez la transparence ou ajoutez un encart de couleur sous le texte, choisissez une photo/illustration épurée pour mettre le texte en valeur.

Il faut aussi faire attention à leur taille d’affichage. Une image trop petite avec moult détails n’est pas forcément pertinente pour un affichage mobile. Trop grande, elle peut manger l’espace sur l’affichage de l’écran au détriment du contenu qui est peut-être plus important. Trop petit, elle n’apportera peut-être pas grand chose, surtout sur un écran mobile.

Laissez parler votre imagination, et déclinez votre univers à travers les différentes pages de votre site ! L'important est de garder une cohérence visuelle pour faciliter la lecture de son contenu et aider un visiteur à trouver l'information qu'il souhaite.

N'hésitez pas à vous créer une charte graphique web où vous rassemblez les règles d'apparence pour tous les éléments de votre site. Ainsi, vous pourrez vous y référer quand vous le développerez ou créerez de nouvelles pages.

L’article Intégrer son identité visuelle sur son site web en 4 étapes est apparu en premier sur Chickadee Blue - Studio graphique.

4 écogestes pour réduire votre impact sur le web

Margaux AVERTY — Wed, 27 May 2020 18:37:11 +0000

4 écogestes pour réduire l'impact numérique de vos requêtes web

Aujourd’hui on effectue une requête web sur les moteurs de recherche pour absolument tout et n’importe quoi. Quelques clics et une quantité gigantesque d’informations s’offre à nous. C’est tellement facile qu’on en oublie que chaque fois que l’on effectue une requête internet, on pollue… Car une seule recherche représente 10 grammes de CO2, soit 9,9 kilos de CO2 par an et par utilisateur en moyenne (Source : ADEME, 2019). Cela ne pèse pas bien lourd vu comme cela, 10 petits grammes. Sauf qu’en une heure, 140 millions de requêtes sont effectuées sur Google… Gloup !

Écogeste n°1 : Enregistrez les adresses de vos sites préférés

C’est certain, vous visitez régulièrement certains sites web ou plateformes en ligne : compte bancaire, magazine, réseau social, administratif… Limitez les recherches en les enregistrant, de la manière qui vous convient le mieux. Par exemple :

Créez des favoris dans votre navigateur

Personnellement, je crée différents dossiers par thème où je range ensuite des marque-pages de sites web. Ainsi, tous les sites que j'utilise quasi-quotidiennement tiennent en une ligne, juste sous ma barre de recherche. Vous pouvez aussi utiliser des marque-pages temporaires (je le fais notamment quand je travaille sur un sujet particulier, ou la rédaction d'un article).

Voici un tutoriel pour enregistrer vos sites favoris !

Créez un “document ressource” avec vos sites

J’utilise cette méthode pour des sites web que je découvre un peu par hasard et que je trouve intéressants, mais dont je n’ai pas besoin dans l'immédiat. Ça vous arrive aussi ? En les classant dans un fichier Excel tout simple, vous vous assurez de les retrouver le moment opportun sans avoir à refaire 36 recherches. Vous pouvez aussi utiliser un tableau Trello, ou toute autre solution qui vous conviendra le mieux.

Écogeste N°2 : Tapez directement l'adresse d'un site dans la barre de recherche

On n’y pense pas forcément, mais écrire le nom d’un site directement dans la barre de recherche permet d’économiser de l’énergie ! Pourquoi s’en priver ?

Écogeste N°3 : Soyez précis.e dans votre requête web

Ça peut couler de source, mais on peut devenir un peu paresseux face à l’efficacité des moteurs de recherches. Ajoutez des mots clés pour préciser votre recherche et améliorer ainsi vos chances de tomber directement sur les résultats qui vous intéressent.

De la même façon, réfléchissez à la bonne orthographe des mots ou expressions que vous tapez… Car cliquer sur la correction proposée par le moteur de recherche lance une seconde requête.

Écogeste N°4 : Utilisez un moteur de recherche éco-responsable

Bien que Google confirme être passé à des énergies verte pour alimenter ses très nombreux serveurs (environ 900 000 dans le monde), cela n’en fait pas un moteur de recherche éco-responsable pour autant. Il existe des alternatives à Google, Bing et Yahoo !

Que proposent ces moteurs de recherche ?

Tout d’abord, elles utilisent des data centers alimentés à l’énergie verte pour compenser leur émissions carbone ! Mais surtout, la plupart distribuent une partie de leur profits à des projets associatifs engagés. Voici quelques idées pour vous aider à sauter le pas !

Cliquez sur un moteur de recherche pour dérouler ses informations :

ECOSIA

LILO

ECOGINE

YOUCARE

OCEAN HERO

ECOSIA

LILO

ECOGINE

YOUCARE

OCEAN HERO

* Chiffres récoltés sur les sites respectifs des moteurs de recherche à la date du 26/05/2020

L’article 4 écogestes pour réduire votre impact sur le web est apparu en premier sur Chickadee Blue - Studio graphique.

Dark Pattern, design trompeurs : comment le web nous manipule

Margaux AVERTY — Wed, 22 Jan 2020 01:10:57 +0000

Dark Patterns, design trompeurs : quand le web nous manipule

Vous avez déjà été confronté.e à des Dark Patterns sans le savoir. Aujourd’hui renommés« deceptive designs », ou designs trompeurs, ces procédés manipulent le comportement d’un utilisateur sur un site web ou une application mobile.

Je me suis moi-même fait avoir à plusieurs reprises, car certains dark patterns sont très bien dissimulés.

Vous savez, cette newsletter qui arrive dans votre boîte mails dans savoir quand vous vous y êtes abonné.e ? Ou cette offre d’essai gratuite qui se transforme en abonnement payant sans que vous en soyez informé.e ? Quand ce n’est pas ce pop-up qui débarque sur une page et que vous n’arrivez pas à fermer ?

Il ne s’agit pas d’erreurs, mais bien de design trompeur. Il est donc important de les repérer pour mieux les éviter.

Dark Patterns : l'art de créer la confusion chez les utilisateurs web

De quoi parle-t-on exactement ?

On peut rapprocher les Dark Patterns de techniques marketing plus traditionnelles bien connues, qui s’appuient sur les biais cognitifs du consommateur. Les techniques du « prix psychologique » à X,99 euros en font partie, tout comme les packs économiques pas forcément plus avantageux quand on fait le calcul.

Dans les faits, ces designs trompeurs vont utiliser ces méthodes marketing en les adaptant aux supports web. Ainsi, ces astuces douteuses vont orienter les comportements utilisateurs afin de :

Récupérer des données personnelles (type e-mail, adresse, numéro de téléphone, etc.)
Augmenter le trafic de visiteurs sur un site ou le taux de clic sur une publicité
Faire grossir le panier moyen d’une commande

Les Dark Patterns, nouveau fléau du web ?

Il ne s’agit pas d’un phénomène récent, puisque dès 2010, Harry Brignull, un expert en design d’interfaces numériques, va répertorier ces procédés et les décrypter. Aujourd’hui, de nombreux sites web les utilisent, notamment des sites très populaires. Selon une étude de 2019 réalisée par l’Université de Princeton, 11,1% des sites d’achat en ligne utilisaient des Dark Patterns (résultats obtenus à partir de l’analyse de 11 000 sites web).

Le Dark Pattern, ou Deceptive Design, est donc l’utilisation de l’UX design dans un but purement commercial, même s’il est au détriment de l’expérience utilisateur, et frôle l’illégalité. Une pratique à bannir si vous souhaitez créer une relation de confiance avec vos futurs partenaires, clients ou collaborateurs.

Créer une expérience utilisateur fluide et simplifiée peut être un véritable atout pour votre activité, à condition de respecter une éthique et une transparence dans vos choix de design et de communication. Un discours clair et bienveillant renforcera votre image et le rapport qu'entretiendront les utilisateurs avec votre produit ou vos services.

Repérer les Dark Patterns pour mieux les éviter

Harry Brignull a identifié 12 types de designs trompeurs. en voici quelques uns, que vous avez très probablement déjà rencontrés.

🙈 Les frais cachés - Hidden Costs

Oups, on a oublié de mentionner les frais de livraison, de dossier, et d'inscription !

Un dark pattern chouchou des sites e-commerce ! L’utilisateur va sélectionner un produit ou un service à acheter en ligne. Seulement, ce n’est qu’à la finalisation de la commande que d’autres coûts viennent s’ajouter, comme des frais d’expédition ou de réservation, et qui rallongent la note très rapidement !

🚀 Les publicités déguisées - Disguised Ads

Le bouton surprise qui vous emmène vers l'infini et au de là

Il arrive que des boutons ou des liens cliquables s’ouvrent sur un contenu bien différent de ce à quoi l’utilisateur s’attendait. À moins de tomber sur une page d’erreur 404, il s’agit bien d’une publicité cachée !

Ce procédé est particulièrement utilisé par les sites de streaming ou on va trouver de nombreux boutons pour lire une vidéo. Les sites de téléchargement ne sont pas en reste, avec une multitude de liens dont la plupart vont conduire à l’ouverture d’une publicité invasive.

🕑 Le sentiment d'urgence - Fake Emergency

Machin et Truc Muche consultent la même offre que vous, réservez vite !

Une technique dont raffolent les sites de réservation en ligne, comme les logements touristiques ou les billets d’avion. Une petite notification va subtilement signaler qu’il ne reste plus qu’une chambre à ce prix, et que 10 internautes sont en train de consulter la même que vous. Un compte à rebours peut aussi se déclencher sur une page pour vous presser de finaliser l’action. Le but ? Jouer sur la peur de rater une bonne affaire, et la fausse satisfaction de l’avoir obtenue juste à temps !

Sur le screenshot que j’ai réalisé ci-dessous, sur un site bien connu de réservation en ligne, on trouve pas moins de 4 messages destinés à presser le visiteur pour réserver.

🙄 L'abonnement perpétuel - Forced Continuity

Zut, on aurait oublié de vous rappeler la fin de votre période d'essai gratuite ?

On vous a proposé de tester un service durant un mois, gratuitement et -à priori- sans contrepartie, c’est chouette non ? Ça l’est beaucoup moins quand à la fin du mois, votre compte est débité automatiquement sans aucune notification préalable. Quand bien même vous souhaitez y remédier dès que vous vous en apercevez, vous devrez batailler pour être remboursé.e. ou pour vous désabonner.

🧲 L'hôtel à cafards - Roach Motel

Vous souhaitez fermer votre compte ? D'accord, mais il vous faudra un tutoriel !

Rien que le nom n’annonce rien de bon ! Concrètement, on parle d’un service pour lequel il est très rapide de s’inscrire mais qu’il va être très difficile de quitter : informations bien dissimulées dans une sous-page de sous-page du site, formulaire à imprimer et à renvoyer par la poste (Si, si !), page de service client non traduite,… Tous les moyens sont bons pour vous décourager ou remettre au lendemain cette démarche compliquée et chronophage.

Heureusement, il y aura toujours des internautes bienfaisant.es qui prendront le temps d’apporter de l’aide sur des forums. Ou carrément, en créant des tutoriels pour résilier un compte ! Mais c’est un non-sens total pour des entreprises qui se targuent de faire de l’utilisateur une priorité.

😳 Le message culpabilisant - Confirmshaming

Vous êtes libres de refuser, mais on vous jugera un peu quand même...

Il s’agit ici d’un message formulé précisément pour culpabiliser l’utilisateur et le faire douter de son choix. Ils apparaissent généralement au moment de décliner une option ou de refuser d’adhérer à un service. Plaisanterie, pathos, sarcasme… le « confirmshaming » peut prendre de nombreuses formes, du moment qu’il provoque une réaction chez l’utilisateur.

En voici un exemple parfait déniché sur le compte Twitter @DarkPatterns (qui a été supprimé depuis), destiné à culpabiliser les propriétaires de chats qui ne souhaitent pas s’abonner à une newsletter.

Traduction :

« Vous ne savez pas quoi donner à manger à votre chat ? » L’option 1 (bien, bien, bien en évidence) : souscrire à la newsletter. L’option 2 (quasiment illisible) : « Non merci, je me fiche de ce que mon chat mange ».

🧐 La vie privé à l'ère Zuckerberg - Privacy Zuckering

Soyez les bienvenu.es et ramenez vos ami.es (et leurs données personnelles aussi)

Cette astuce tire son nom de Marc Zuckerberg, le patron de Facebook, vous l’aurez deviné. Son secret repose dans le fait d’emmener l’utilisateur à partager beaucoup plus de données personnelles qu’il ou elle souhaite. Par exemple, quand une application vous propose de vous connecter avec votre compte Facebook pour aller plus vite, ce n’est pas uniquement pour vous simplifier la vie. Cela permet de récupérer de très nombreuses infos personnelles dont le réseau social dispose grâce à votre compte.

Sauf si vous prenez le temps de dérouler les détails de l’inscription ou aller dans les paramétrages de votre application pour décocher manuellement une multitude d’options aux noms pas forcément déchiffrables (sinon c’est pas drôle…).

Pour exemple, la journaliste Judith Duportail avait demandé, par curiosité, de consulter l’ensemble de ses données personnelles liées à son compte Tinder. Elle a donc reçu un dossier de 800 pages… !!! Car si l’application de rencontre collecte d’elle même de nombreuses données sur ses utilisateurs, elle en récupère aussi grâce aux connections établies avec vos autres comptes comme Instagram, ou Spotify. Effrayant.

Cette liste de pratiques n'est pas exhaustive, je pourrais en énumérer bien d'autres. Qu'il s'agisse de manipuler par les messages douteux, les conditions ambigües, ou tout simplement le détournement de l'attention, les Dark Patterns sont partout sur le web. Cet article a surtout pour but de vous éclairer sur ces pratiques, afin d'être plus attentif pour vous même, et dans la façon dont vous pourriez construire votre site internet et son contenu.

Les Dark Patterns sont le contraire d'une communication éthique et responsable

Renforcez la confiance des utilisateurs dans les solutions numériques

Les premières cibles de pratiques abusives sont souvent les personnes qui n’ont pas l’expérience nécessaire sur le web pour appréhender ces pièges et s’en dépêtrer seules. On peut aussi mentionner les utilisateurs ne parlant pas anglais qui se retrouvent parfois vite perdus face à des foires à questions ou des services clients qui ne sont pas traduits.

Au delà de nuire à l’expérience utilisateur, le recours massif aux design trompeur génère de la déception et de la défiance envers le numérique. Vous aurez beau tenter d’être irréprochables, tant que les grandes entreprises continueront ces pratiques sans être sanctionnées, d’autres suivront.

Changeons la donne !

Nous, auto-entrepreneurs, TPME, associations, pouvons à notre niveau contribuer à améliorer le web. Prenons nos responsabilités vis à vis des utilisateurs en général (nous en faisons partie après tout), mais aussi évidemment pour nos clients, nos prestataires, nos collaborateurs, nos partenaires…

Si cet article a permis de sensibiliser certain.e.s d’entre vous sur les Dark Patterns afin de les repérer et éviter de tomber dans leurs pièges, c’est déjà une excellente chose. Mais allons plus loin !

Favorisez la communication respectueuse et éthique

Je parle ici de la communication au sens large. Car les Dark Patterns ont leurs équivalents ailleurs que sur le web. Chaque média, chaque supports, disposent de techniques pour recréer le même effet de confusion chez une audience.

Dans le cas des Dark Patterns, l’UX Design trinque au détriment de nombreux concepteurs web créatifs et engagés. Ceux qui mettent leurs compétences au profit de l’utilisateur en améliorant la convivialité, la fluidité, l’originalité, mais aussi l’accessibilité du web. Rien n’oblige à tromper le consommateur pour qu’il s’inscrive à une newsletter ou un abonnement quelconque.

Le rôle des acteurs économiques

Heureusement, de plus en plus d’acteurs de l’économie numérique ont bien compris ces enjeux et contribuent à rendre la communication plus vertueuse, et même plus respectueuse de l’environnement. Personnellement, ma conviction est faite concernant ce genre de pratiques, qui ne reflètent pas la vision que j’ai de la communication en général, et de mon métier.

Adopter une démarche transparente et éthique, qui remet les VRAIS échanges au cœur de la communication, est possible. Et je suis certaine de ses bienfaits, même si cela demande plus de patience, de persévérance et d’humilité.

Vous êtes de cet avis ?

L’article Dark Pattern, design trompeurs : comment le web nous manipule est apparu en premier sur Chickadee Blue - Studio graphique.