5 signes que tu auto-sabotes la visibilité de ton site auprès de Google
Tu veux du trafic. Tu veux que ton site soit trouvé. Tu veux que Google te remarque… mais pour l’instant, il t’ignore…
Tu fais peut-être partie de ces personnes qui se disent :
“Je ne comprends pas… Pourtant j’ai travaillé fort sur mon contenu, mes mots-clés, j’ai écrit des pages complètes et des articles… et ça ne bouge pas.”
Je vais être transparente avec toi :
Si tu veux être dans les 3 premiers résultats, il n’y a pas de secret, il ne faut rien négliger.
Tu as le contenu certe. Mais… si ton site est peut-être en train de saboter ton référencement naturel sans que tu ne t’en rendes compte, c’est peut-être parce que justement tu as tout donné sur le contenu et négligé le reste.
Parce qu’on t’a bassiné avec le SEO = mots-clés, articles, rédaction.
Sauf que le SEO repose sur 3 piliers. Alors certes, le pilier du “Contenu” fait partie des 3, mais il y en a 2 autres qu’il ne faut surtout pas oublier. Et toi aujourd’hui, tu n’en travailles qu’un.
LES 3 PILIERS DU SEO (dont celui que tu as ignoré jusqu’à aujourd’hui)
Alors, on reprend les bases : il y a 3 piliers au SEO, le contenu, la popularité et la technique.
- Pilier Contenu → ce que tu racontes sur ton site : articles, pages basé sur des mots-clés stratégiques pour te positionner au bon endroit. Mais, même le meilleur contenu du monde ne sert à rien si ton site n’est pas “ valorisé par d’autres.
- Pilier Popularité → ce qui prouve que ton site est fiable : liens, réseaux sociaux, recommandations d’autres sites. Plus ton site est reconnu et recommandé par d’autres, plus Google le met en avant, mais même le site le plus populaire va voir sa visibilité impacté s’il n’est pas techniquement irréprochable.
- Pilier Technique → la structure et les fondations de ton site : performance, accessibilité, version mobile, poids des pages. Si la technique est négligée, ta visibilité sur Google en sera impacté, peu importe la qualité de tes contenus ou de ta réputation.
Lire aussi : Techniques SEO : 3 piliers essentiels pour un site WordPress éthique et durable
Et devine lequel de ces 3 piliers est le plus ignoré par les entrepreneur·e·s et les petites organisations ?
Le pilier technique.
LES 5 SIGNES QUE TU T’AUTO-SABOTES (pilier technique)
Si tu te retrouves concerné dans au moins 2 des 5 signes, c’est normal de ne pas apparaître dans les 3 premiers résultats sur tes mots-clés.
1. Ton site pèse plus de 200 Ko
En effet, si ton site pèse plus de 200Ko, c’est qu’il est trop lourd. Et Google, il n’aime pas les sites lourds.
Pour connaître le poids, ne serait-ce que de ta page d’accueil, utilises Digital Beacon.
Lire aussi : Empreinte environnementale de son site : comment la mesurer et découvrir si son site est éco-responsable ou non ?
Si ton poids dépasse les 200 Ko, ça veut dire que ton site risque de :
- mettre trop de temps à charger ;
- les visiteurs vont donc repartir avant même qu’il s’ouvre
- Google te rétrograde dans le classement.
2. Score accessibilité < 90
En effet, si ton site obtient un score d’accessibilité (sur le plan technique encore une fois) inférieur à 90, c’est qu’il n’est pas assez accessible aux personnes en situation de handicap. Et Google, il pénalise les sites non inclusif.
Pour connaître le score d’accessibilité, ne serait-ce que de ta page d’accueil, utilises Page Speed Insights.
Lire aussi : L’accessibilité : mon chemin de designer pour sortir du “beau” et viser le juste
Si ton score est inférieur à 90, ça veut dire que ton site risque de :
- être pas assez lisible et compréhensible pour les personnes en situation de handicap ;
- les personnes concernés vont donc repartir sur le champ ;
- Google te rétrograde dans le classement.
3. Performance mobile < 90
En effet, si ton site obtient un score de performance mobile inférieur à 90, c’est qu’il n’est pas assez adapté à des petites tailles d’écrans et à l’usage en contexte de mobilité. Et Google, il pénalise les sites qui ne sont pas mobile-friendly.
Pour connaître le score de performance mobile, ne serait-ce que de ta page d’accueil, utilises Page Speed Insights (section mobile).
Lire aussi : Empreinte environnementale de son site : comment la mesurer et découvrir si son site est éco-responsable ou non ?
Si ton score est inférieur à 90, ça veut dire que ton site risque de :
- ne pas être facile à utiliser en contexte de mobilité ou depuis ta bio Insta ;
- les personnes qui vont se retrouver face à des bugs vont donc repartir sur le champ ;
- Google te rétrograde dans le classement.
4. Des images de plus de 200 Ko
En effet, si ton site possède des images qui font plus de 200Ko, c’est qu’elle ne sont pas assez adapté pour un site web (mais plutôt pour du print). Et Google, il pénalise les sites qui mettent trop de temps à s’afficher à cause d’images trop lourdes.
Pour connaître le poids de tes images, consultes tes images une à une dans ta médiathèque WordPress.
Lire aussi : 5 banques d’images inclusives et gratuites pour ton site web
Si leur poids est supérieur à 200Ko, ça veut dire que ton site risque de :
- ne pas charger assez vite (surtout si la connexion est mauvaise - milieux ruraux) ;
- les personnes qui vont se retrouver face à un site qui met 1000 ans à tout afficher vont le quitter ;
- Google te rétrograde dans le classement.
5. Ton site consomme + 0,3g de CO₂ par page vue
En effet, si ton site consomme +0,3g de CO2 par page vue, c’est qu’il n’est pas éco-conçu. Et Google, il ne pénalise pas encore les sites qui ne sont pas éco-responsable, mais ça ne saurait tarder (c’est le feeling qui parle). En tout cas la planète elle t’en sera reconnaissante.
Pour connaître l’empreinte carbone de ton site, ne serait-ce que de ta page d’accueil, utilises Website Carbon.
Lire aussi : Ma routine d’analyse de site : comment je mesure l’impact réel de ton site web
Si ton score est en-dessous de C, ça veut dire que ton site risque de :
- polluer bien plus qu’il ne devrait ;
- c’est donc vraiment dommage ;
- et saches qu’un site qui diminue son empreinte carbone, est forcément un site plus léger donc plus performant (en plus d’être plus éthique)
Et là, c’est le moment oùtu réalises peut-être que tu t’es concentré(e) sur les textes de ton site en priorité, mais pas sur ce qui permet à Google d’y accéder, de les lire.
Le mot de la fin...
Imagine que je te lance un défi. Celui de prendre 1h pendant 30 jours (pas plus, ni moins) pour arranger tout ça et faire de ton pilier technique un vrai atout pour ton référencement naturel. Et pas que, puisque cela rendra ton site également plus performant, éthique et éco-responsable.
C’est ce que je propose dans ma nouvelle offre, Pimp ton site : 30 actions en 30 jours pour bonifier ton site afin de le rendre plus performant, éthique et éco-responsable.
Le principe ? Pendant 1h par jour, tu suis une vidéo où je te donne exactement la marche à suivre sur ton site (une leçon + tutos), tu appliques tout ça sur ton site (clairement, tu passes à l’action), et tu vois ton site s’améliorer en temps réel de jour en jour. Tu observes des résultats concrets un peu plus chaque jour.
Et surtout tu reprends ton site en main, tu n’auras plus peur de mettre les mains dans WordPress (crois-moi, ça va devenir un vrai jeu d’enfants), tu arrêtes de subir la technique, tu prends le contrôle.
Tu passes de “je comprends rien à la technique, ni à WordPress” à “en fait c’était pas si compliqué, fallait juste me le montrer”.
Écriture inclusive sur ton site : un acte engagé… ou une fausse bonne idée ?
Tu as déjà utilisé quelques fois l’écriture inclusive dans tes posts ou dans ta communication et c'est un premier pas. Tu l'as fais parce que tu sais que c’est important et cohérent avec tes valeurs et que ça traduit ton envie d’un monde plus juste et plus respectueux. Mais laisse-moi te poser une question : est-ce que ton site aujourd'hui reflète la même intention ?
- Si la réponse est "oui" : la suite va t'intéresser pour savoir si oui ou non tu le fais de la bonne façon, notamment sans impacter ton SEO ou l'accessibilité de ton site pour les personnes en situation de handicap.
- Si la réponse est "non" ou "pas "forcément", c'est parfait, parce que tu es au bon endroit pour commencer dès maintenant, et surtout démarrer du bon pied. Un petit pas après l'autre.
Souvent, on applique naturellement l’écriture inclusive sur Instagram ou dans une newsletter… mais sur son site, elle disparaît, ou n'est pas uniforme sur toutes les pages (et je suis la première concernée). Ou alors, on l’a utilisée un peu à la va vite, avec de belles intentions de départ, sans mesurer les impacts sur la lisibilité, l’accessibilité ou même le référencement naturel (SEO).
Oui, parce que l’écriture inclusive est un bon engagement, mais à condition de bien l’appliquer sur son site (et c'est valable aussi pour tous ces autres supports de communication). Aujourd’hui, on va voir pourquoi elle est essentielle, comment l’adapter à ton site, et surtout, quelles actions simples tu peux poser dès maintenant pour le rendre plus inclusif, sans perdre en clarté ni en performance.
Et tu sais quoi, je vais moi aussi profiter de la publication de cet article pour me mettre un bon coup de pied au fesses et corriger également toutes les petites erreurs qu'il y a sur mon site et qui sont passées totalement à la trappe cette année.
1. L’écriture inclusive sur ton site doit être un marqueur d’éthique, de bienveillance et de cohérence
Quand tu portes un projet engagé, ton site n’est pas juste une vitrine : c’est le reflet de tes valeurs. L’écriture inclusive permet d’exprimer ton engagement de manière concrète. Elle inclut tout le monde : femmes, hommes, personnes non-binaires (aka : toutes les personnes concernées par ton message).
Mais attention : toute ta bonne intention ne suffit pas. Si ton site devient difficile à lire, ton message se perd. Et si certaines personnes ne peuvent pas comprendre ton contenu (personnes dyslexiques, personnes qui utilisent un lecteur d’écran, ou simplement des personnes pressées qui lisent en diagonal), ton éthique va se retourner alors contre toi.
Inclure, ça veut dire permettre à tout le monde (de ton audience) de lire ton contenu, de comprendre ton message afin de se sentir concerné pleinement par ce dernier, plutôt qu'exclu.
2. L'écriture inclusive sur un site peut vite devenir… une fausse bonne idée
En effet, l’écriture inclusive, mal appliquée sur ton site, peut te desservir sur plusieurs aspects : la lisibilité, l'accessibilité et le SEO. On va décortiquer tout ça ensemble puis je te montre comment faire pour pallier à ça.
2.1. Lisibilité
Sur un écran, surtout mobile, les phrases longues, les doublets à répétition ou les symboles (comme le point médian) compliquent la lecture et entraîne une fatigue visuelle pour ton audience. Et malheureusement, un texte “inclusif” mais fatigant à lire pour les yeux… finit par être ignoré.
2.2. Accessibilité
Le point médian quant à lui est un vrai enjeu d'accessibilité. Parce que malheureusement, il n’est pas toujours bien interprété par les lecteurs d’écran ou les outils de traduction.
Un lecteur d'écran sert notamment à des personnes malvoyantes ou non-voyantes d'avoir une lecture audio du texte inscrit sur ton site. Et malheureusement, un point médian, va se vocaliser par ces outils phonétiquement comme : "[les] [étudiant] [Point] [E] [Point] [S]". Ceci est un exemple (cela peut varier selon comment ils sont paramétrer ou selon les modèles) pour vous sensibiliser à des choses auquel on ne pense même pas, lorsqu'on est pas concerné directement.
Le point médian, n'est pas qu'un enjeu pour les personnes mal-voyantes ou non-voyantes, puisque c'est également un enjeu à la lecture pour les personnes DYS (dyslexiques, dysorthographies, etc), elles le perçoivent comme un obstacle, une difficulté en plus à la lecture.
2.3. Référencement naturel (SEO)
Google et les moteurs de recherche ne reconnaissent pas forcément le symbole point médian ou la lecture avec des doublets à rallonge (par exemple : "j'accompagne les entrepreneurs et les entrepreneures" - non, je n'ouvrirais pas maintenant le débat sur le féminin de : entrepreneuse ou entrepreneure).
Résultat : ton mot-clé principal peut être mal compris, ton référencement affaibli, et ta page moins visible.
Moralité : on dit oui à l'écriture inclusive sur son site. Mais adaptée à son site.
3. Alors, 4 règles pour utiliser l'écriture inclusive sur ton site sans lui nuire ?
L’idée, ce n’est pas de tout réécrire du jour au lendemain, mais d’adopter de bons réflexes et d'y aller petit pas, par petits pas. Voici mes conseils, les plus simples et rapide à mettre en place.
3.1. Privilégie les mots épicènes
Les mots épicènes sont ceux qui ne marquent pas le genre. Par exemple :
- “Les personnes clientes” au lieu de “les client.e.s”
- “L’équipe dirigeante” au lieu de “les dirigeants et dirigeantes”
C’est plus fluide, inclusif et SEO-friendly.
3.2. Utilise les doublets avec modération
Oui, tu peux écrire “les entrepreneuses et entrepreneurs”. Mais pas à chaque phrase et 3 fois dans le même paragraphe. Choisis les moments clés, les titres ou les phrases fortes. Sinon, ton texte devient répétitif et perd en impact.
3.3. Le point médian : pas interdit, mais à manier en conscience
Il peut être utile ou même inévitable dans certains contextes, mais pas systématiquement. Maintenant que tu connais son impact négatif sur d'autres aspects, utilise-le quand l’inclusion du mot est essentielle pour ton message, mais reformule-le ailleurs quand tu le peux. Par exemple :
- Avant : “Chaque participant·e est invité·e à…”
- Après : “Chaque personne participante est invitée à…” Le sens reste le même, mais la phrase est plus facile à lire.
3.4. Pense inclusif dès ta conception de contenu
L’inclusion ne s’arrête pas à l'écriture, comme elle ne s'arrête qu'au genre. Elle passe aussi par d'autres aspects, comme la forme : notamment par les visuels présents sur ton site. Diversifie les images, les profils représentés, les univers : c’est aussi ça, créer un site inclusif.
LIRE L'ARTICLE : 5 banques d’images inclusives et gratuites pour ton site web
Je le sais, cela reste une gymnastique du cerveau à avoir à chaque fois qu'on écrit et c'est normal qu'on passe à côté de certaine tournure de phrase. Mais rappelez-vous que "mieux vaut fait que parfait".
4. Voici 2 actions concrètes pour rendre ton site plus inclusif dès aujourd’hui
Pas besoin de refaire tout ton site. On se calme. On va commencer petit, parce que chaque petit pas compte :
- Relis les textes de ton site et repère les mots genrés. Corrige-les avec des alternatives neutres ou épicènes.
- Repère les points médians et reformule quand c’est possible. Allège ton contenu, simplifie-le car ton message gagnera en clarté et ton site, en accessibilité.
- En bonus : si tu veux aller plus loin, pense à varier tes visuels. Parce qu’un site inclusif, ce n’est pas qu’une question de mots. C’est une expérience globale.
LIRE L'ARTICLE : 5 banques d’images inclusives et gratuites pour ton site web
Le mot de la fin...
Inclure, sans exclure. J'en dirais pas plus.
Est-ce bien utile d’avoir des couleurs éco-responsable sur son site ?
Aujourd’hui, on va parler couleurs. Pas juste de “goûts” ou de tendances, mais de l’impact réel que tes choix de couleurs peuvent avoir sur les visiteur·euses de ton site ainsi que sur l'environnement. Toutes les combinaisons de couleurs ne se valent pas. Tou·tes tes client·es idéaux·ales n'auront pas la même vision de ton site web, ni la même expérience de ce dernier.
La plupart du temps, on choisit une palette parce qu’on "aime" bien le rendu. Mais en réalité, les couleurs jouent plusieurs rôles clés :
- Elles transmettent un message émotionnel (apaisement, énergie, sobriété…)
- Elles représentent ton entreprise ou ton activité, la vibe que tu veux renvoyer auprès de ta cible
- Elles installent un univers graphique, un style spécifique en fonction de leurs combinaisons
- Elles vont avoir un impact écologique plus ou moins important
- Elles conditionnent surtout la lisibilité de ton site et donc son accessibilité
Ce n’est donc pas juste une question de goût. C’est une question de responsabilité et de choix.
Les couleurs éco-responsables sont-elles alors qu’un détail ?
Oui et non. On va mettre les pieds dans le plat et résumer tout ça en 2 points :
- Sur le web, les couleurs sombres (proches du noir) consomment moins d’énergie sur certains écrans (OLED notamment).
- En print, c’est l’inverse : plus ta couleur est claire, moins tu utilises d’encre.
Alors on fait quoi Jamie ? Un site en dark mode et des cartes de visite toutes blanches ? NON, non, non et non ! Surtout pas.
Le conseil que je donne à l'intégralité de mes client·es et potentiel·les futur·es client·es est toujours le même : sur un site web, il y a de nombreux facteurs polluants, certains plus que d'autres. Contrairement à ce qu'on pourrait croire, les couleurs font partie des facteurs les moins polluants. Cela reste donc un impact minime comparé au reste des éléments de ton site web.
Nota bene : les couleurs, c'est environ moins d’1 % du poids total d’une page web. Donc, tu n’auras pas un site éco-responsable juste parce que tu choisis des éco-couleurs web. C’est surtout ton hébergement, l'optimisation de ton code, le poids de tes images, l'optimisation de tes vidéos, etc., qui feront toute la différence.
Tandis que sur le print, l'impact est beaucoup plus important ! Alors si on réfléchit deux minutes, il vaut mieux privilégier une charte graphique avec des couleurs éco-responsables pour le print plutôt que pour le web.
Mais ne nous arrêtons pas en si bon chemin.
Tant qu'à être dans le respect du vivant et de ce qui nous entoure, prenons en considération ++ les êtres humains qui vont venir visiter ton site et leurs déficiences visuelles possibles. Parce que sur le web, comme sur le print, le vrai combat à mener, c'est l'accessibilité des couleurs entre elles.
Ce serait quand même dommage d'appliquer une charte graphique sur son site qui rendrait toutes tes pages, articles, boutons, formulaires, etc., illisibles et donc incompréhensibles et inutilisables pour certaines personnes.
Le vrai combat ? Utiliser des couleurs qui matchent entre elles #MatchyMatchy
Des couleurs qui matchent entre elles, c'est tout simplement des combinaisons de couleurs qui ont un assez bon ratio de contraste entre la couleur du texte et la couleur de l'arrière-plan.
Au-delà d'avoir des couleurs éco-responsables pour le print, il faut donc surtout vérifier qu'on ait bien des combinaisons de couleurs accessibles : assez lisibles entre elles, pour tout le monde. Aka : exit la palette de couleurs full pastel !
Comment vérifier l'accessibilité de ses couleurs ?
Avec des outils spécifiques et surtout pas en les regardant simplement de loin ou de près. La phrase que j'entends systématiquement lorsque je dis à mes client·es que les couleurs de leur charte graphique ne sont pas accessibles entre elles :
“Ben pourtant moi je les vois bien, j'arrive à lire.”
Sauf que… iels ne sont pas tout le monde, et tout le monde ne perçoit pas les couleurs comme iels.
Je leur demande alors s’iels ont pensé aux personnes qui sont daltoniennes, par exemple. Ou bien à celleux qui ont une vision réduite de leur champ de vision, de la fatigue visuelle, ou utilisent même des lecteurs d’écran pour les aider à lire l'écran. C'est dans ces cas précis que, si le taux de contraste entre tes couleurs est trop faible, ton contenu devient carrément illisible pour iels.
Les outils spécifiques que je vais te présenter maintenant ne sont pas n'importe lesquels : ils sont basés sur les normes WCAG et RGAA, qui sont celles de la réglementation officielle de l'accessibilité numérique dans le monde (WCAG) et spécifiquement en France (RGAA).
Ces outils te diront donc avec exactitude si la combinaison de deux de tes couleurs entre elles a un ratio de contraste assez fort (entre la couleur d'arrière-plan et la couleur de ton texte) pour être lisible par le plus grand nombre.
Mes 3 outils préférés pour tester tes couleurs
Coolors Contrast Checker : tu colles deux des codes couleurs de ta marque, celui de ton arrière-plan et celui de ton texte, et tu vois si l’association match ou pas en termes d'accessibilité.
Color Review : très utile si tu n'as pas encore de palette de couleurs pour ton activité ou ton site et que tu veux voir en live le rendu de cette combinaison de couleur sur du texte, des boutons, des illustrations, etc.
Adobe Color Contrast : c'est mon préféré car il me donne plus de détails en m'indiquant exactement si les couleurs sont accessibles entre elles pour des gros titres uniquement, ou seulement des illustrations, ou bien pour les gros titres + corps de texte + illustrations.
Recommencer avec toutes les combinaisons de couleurs possibles avec ta palette de couleurs.
Nota bene
Il y a vérifier puis ajuster sa palette de couleurs
Partons d'un cas concret : celui de mes dernier·es client·es avec qui j'ai réalisé ce travail d'ajustement de la palette de couleurs de leur site pour la rendre plus éthique et éco-responsable. C'était dans le cadre de l'optimisation de leur site web au complet. Et qui dit optimisations, ne dit pas refonte. Le but n'était surtout pas de tout refaire à zéro, ni de changer la charte graphique au complet. L'objectif était simplement d'ajuster certaines nuances de couleurs pour les rendre plus accessibles entre elles.
C'était d'autant plus important que ces client·es avaient deux enjeux majeurs par rapport à ça :
- Iels sont une référence dans leur domaine, donc beaucoup de gens les connaissent et les identifient depuis toujours avec leur charte graphique de base. Donc il était essentiel de conserver l'ADN de cette dernière afin de ne pas perturber leur audience actuelle.
- Iels avaient une couleur dominante très marquée qui était le reflet de leur identité, mais qu’iels utilisaient avec parcimonie car parfois trop forte justement. Le problème, c'est que tous les endroits de leur site où cette couleur était utilisée rendaient alors la lecture très compliquée pour certaines personnes, car pas accessible du tout avec aucune autre couleur de leur charte graphique.
Résultat : on a bel et bien gardé leur identité visuelle, mais on a ajusté légèrement les teintes, comme tu peux le constater ci-dessous, pour que tout le monde puisse accéder à leur contenu. Mon conseil sera donc le suivant pour toi : pas besoin de tout révolutionner, juste d’ajuster intelligemment (teinte, nuance, contraste, etc.) jusqu'à obtenir la bonne combinaison.
Petite astuce en plus : comment bien définir les couleurs spécifiques de chaque élément de son site web ?
Sur le web, la clé mystère est la suivante : c’est la règle du 60/30/10. Elle signifie que chacune des couleurs présentes dans ta charte graphique va être amenée à être plus ou moins tartinée sur ton site. Aka : toutes les couleurs de ton site ne vont pas être utilisées à parts égales. Tu n'auras jamais sur les pages de ton site exactement 20 % de rouge, 20 % de bleu, 20 % de blanc, 20 % de noir et 20 % de gris. Pour que ce soit le plus harmonieux, en webdesign, on utilise la règle du 60/30/10, soit :
- 60 % : la couleur dominante (souvent neutre ou sombre, utilisée pour les fonds, l'arrière-plan du site), ici le crème
- 30 % : une teinte intermédiaire (souvent utilisée pour marquer uniquement certains blocs et les mettre en avant), ici le rose Barbie
- 10 % : la couleur d’accent (celle qui attire l’œil sur les boutons, les liens, les appels à l’action), ici le fuchsia
Si tu veux faire le point sur tes couleurs rapidement et facilement afin de vérifier que ta palette reflète tes valeurs sans sacrifier ni la planète, ni l’accessibilité, j’ai préparé un guide pratique à compléter, rien que pour toi : Comment bien préparer la refonte de ton site éthique et éco-responsable.
À l’intérieur, tu trouveras des exercices simples et concrets pour poser les bases d’un site aligné avec tes valeurs. Tu peux le télécharger gratuitement dès maintenant.
Le mot de la fin...
Et si ta palette devenait un acte militant ? Au final, l’impact écologique des couleurs est limité. Mais leur pouvoir sur l’accessibilité et l’expérience utilisateur·ice est immense. Et si tes couleurs devenaient plus qu’un choix esthétique ? Et si elles devenaient un signe fort de ton engagement : un site beau, lisible, accueillant… pour tou·tes ?
Parce qu’un site éthique, ce n’est pas juste une question de design. C’est surtout une question de valeurs et d'engagement.
Bonus : si tu veux savoir si une couleur est “plus éco-responsable” sur le web, additionne les valeurs de son code RVB (rouge, vert, bleu). Si le total est ≤ 255, c'est une couleur qui consomme peu d'énergie sur le web. Tu peux vérifier ça sur Color-Hex.
5 banques d’images inclusives et gratuites pour ton site web
Tu tapes “femme entrepreneure” dans une banque d’images classique comme Unsplash, Pexels, Pixabay, ou autres et tu tombes toujours sur la même scène : un bureau minimaliste, un ordi dernier cri, une nana en tailleur noir avec un sourire Colgate. Franchement, c'est réaliste ? Non, c'est tout sauf authentique et naturel. Et tes client.e.s idéaux.ales risquent de ne pas se reconnaître là-dedans...
Résultat : des sites qui se ressemblent tous, qui sonnent creux et qui invisibilisent la diversité.
Pourquoi les banques d'images inclusives, ça change tout
La plupart des personnes que j’accompagne sont souvent dans l'une de ces deux situations :
- Elles piochent par défaut sur Unsplash ou Pexels et se retrouvent avec un site qui a les mêmes photos que tout le monde.
- Ou bien elles sentent que “quelque chose cloche”, qu’elles ne se reconnaissent pas dans ces images trop stéréotypées… mais elles n’ont pas conscience que d’autres alternatives existent.
Et pourtant, tes visuels ont un poids énorme auprès de tes visiteurs car ils transmettent eux aussi : tes valeurs.
L’inclusion, ce n’est pas que dans le texte : c’est aussi dans ce que ton site montre. Choisir des images plus diverses et représentatives, c’est un acte éthique fort.
Alors voici mon top 5 des banques d’images inclusives à utiliser sans modération
1. Nappy
- Ce que tu y trouves : des photos de personnes noires et brunes, dans des contextes du quotidien, naturelles et non stéréotypées. Idéal pour sortir du moule “tailleur noir + ordi blanc + sourire Colgate”.
- Licence : gratuite, libre d’utilisation pour usage personnel et commercial. Attribution non obligatoire (mais recommandée pour soutenir les créateur·ices).
2. Gender Spectrum Collection
- Ce que tu y trouves : une banque d’images axée sur la représentation des personnes trans et non-binaires, dans des contextes variés (travail, famille, santé, loisirs).
- Licence : gratuite, mais attention : c’est une collection sur Vice → l’utilisation est possible pour usage éditorial et commercial, mais il faut bien vérifier les conditions spécifiques de chaque image.
3. Disabled and Here
- Ce que tu y trouves : des photos et illustrations mettant en avant des personnes en situation de handicap, créées par et pour les personnes concernées.
- Licence : libre et gratuite, sous licence Creative Commons Attribution (CC BY 4.0) → tu peux les utiliser, modifier, partager, même commercialement, tant que tu crédites la source.
4. Society Pix
- Ce que tu y trouves : une banque inclusive, qui met en avant la diversité des corps, des âges, des origines et des situations. Les visuels sont modernes, frais et proches du quotidien.
- Licence : gratuite, utilisation libre à condition de respecter la licence Creative Commons indiquée sur chaque image et de mentionner l'auteurice de la photo.
5. Une dernière banque d'image inclusive : TONL (payante)
- Ce que tu y trouves : une banque d’images premium qui met en avant la diversité culturelle, générationnelle et identitaire. Chaque collection raconte une histoire, avec une approche narrative (storytelling visuel).
- Licence : abonnement payant, usage commercial illimité selon la formule choisie. Pas de revente des visuels, évidemment.
- Pourquoi je l’aime : les images sont d’une qualité incroyable, hyper professionnelles, et tu as la certitude d’avoir des photos uniques, très loin des banques d’images gratuites qu’on retrouve partout.
Le mot de la fin...
Ton site raconte une histoire à travers tes mots, ton design… et tes images. Alors autant que ce soit la tienne, pas celle des clichés recyclés.
Si tu veux aller plus loin que les visuels et préparer ton site au complet à être aligné avec tes valeurs (éthique ET éco-responsable), j’ai créé un guide gratuit pour t’aider à bien préparer la création de ton site. Tu peux le télécharger ici : Télécharge ton guide complet
