Comment Webflow a élevé la collaboration au rang d’art ?

Comprendre les outils Webflow qui facilitent le travail collaboratif

Axel Courtine

Publié le

August 18, 2025

Webflow
Webflow
Webflow
Webflow
Webflow

Qui mieux que des experts Webflow pour entretenir votre Webflow ?

30 minutes

Pour discuter de votre projet, c’est ici

Nous contacter

Dans un précédent article, nous avions commencé à introduire les différences de fonctionnement (et d’objectifs d’utilisation) entre le mode designer et le mode editor de Webflow.

Nous avions vu comment le mode designer permet de donner accès au design et au développement du site d’un point de vue graphique et fonctionnalités, en donnant notamment accès au custom code. Et comment le mode editor donne uniquement accès à la gestion du contenu du site ainsi qu’à la gestion des éléments dynamiques comme les articles de blog.

Le legacy editor

Le premier outil collaboratif mis en place par Webflow est aujourd’hui connu sous le nom de legacy editor.

La logique était la suivante. Lorsqu’un projet Webflow est terminé et en ligne, les intervenants au quotidien sur le site peuvent être de deux sortes :

- les intervenants dans l’editor qui peuvent accéder au site sans avoir besoin de créer un compte Webflow ;

- les intervenants dans le designer qui doivent pour cela disposer d’un vrai accès Webflow.

Vous pouvez encore aujourd’hui utiliser l’ancienne version de l’editor tant que Webflow n’aura pas fait de mise à jour en ce sens.

Pour ajouter un nouvel accès editor, il suffit de vous rendre dans les settings de votre projet sur l’onglet “site access”

Vous trouverez alors ici toutes les options nécessaires pour la gestion des utilisateurs sur votre site.

Vous pouvez bien sûr voir qui a accès, de quels droits ils disposent et, évidemment, ajouter un nouveau collaborateur à l’aide du bouton “add to Editor”.

Attention cependant : le nombre de sièges utilisables varie en fonction du plan d’hébergement auquel vous avez souscrit.

Par exemple, avec le plan CMS vous avez droit à 3 sièges.

Les personnes invitées peuvent alors accéder au site via l’url : https://votrenomdedomaine.com?edit

Ils sont invités à créer un mot de passe afin de pouvoir accéder aux données du site de manière sécurisée et, ensuite, ils disposent alors d’un accès limité, permettant de gérer le contenu mais sans casser quoi que ce soit parce qu’ils ne peuvent pas toucher au CSS 😛

Cependant, ce paradigme est en train de changer. En 2025, Webflow a officiellement annoncé que le mode editor que nous avions connu jusque là passait en mode Legacy pour laisser place à la nouvelle manière de collaborer au sein de Webflow : l’edit mode.

Edit mode de Webflow

L’edit mode, c’est la nouvelle solution qu’a imaginée Webflow pour rendre le travail collaboratif sur ses sites le plus efficient possible.

Bien sûr, il présente les mêmes avantages que l’ancienne version ; à la différence que les designers et les editors travaillent désormais dans le même environnement. À savoir dans le designer de Webflow.

Comprendre les workspaces

Pour cela, on doit d’abord commencer par définir la notion de Workspace dans Webflow.

Lorsque vous créez un compte sur Webflow, cela vous crée automatiquement votre premier Workspace afin de vous laisser la possibilité de créer votre premier site.

En effet, un site va obligatoirement appartenir à un Workspace. Par contre, vous devez certainement commencer à comprendre qu’un compte Webflow peut posséder plusieurs Workspace pouvant eux-mêmes contenir plusieurs sites. Et il est bien sûr possible de vous faire inviter à collaborer dans d’autres workspaces détenus par d’autres personnes, comme nous le verrons plus loin dans cet article.

Pour vous aider, voici un tutoriel de Webflow sur le fonctionnement des Workspaces :

Ajouter des collaborateurs

La notion de workspace est essentielle parce qu’il faut comprendre que le changement de paradigme de Editor vers Edit mode implique que le niveau à partir duquel les droits d’accès se font change aussi.

Le partage d’accès pour un utilisateur de l’editor se faisait au niveau du site internet en lui-même, dans les settings.

Cependant, pour l’edit mode, l’accès se fait au niveau du workspace en lui-même. Par conséquent, un collaborateur du workspace aura accès à tous les projets présents dans ce même workspace.

Pour accorder un nouvel accès, vous devez donc aller dans votre dashboard Webflow dans l’onglet Team à gauche.

Vous devriez alors voir apparaître les membres de votre équipe en premier, et en dessous les agences et freelancers avec qui vous travaillez.

En effet, cet endroit permet de centraliser la gestion de vos intervenants internes et externes !

Si vous cliquez sur inviter un membre, cette fenêtre va alors apparaître :

On vous demande d’indiquer l’adresse mail du compte Webflow que vous souhaitez ajouter à votre workspace, mais aussi et surtout de choisir le rôle que va occuper cette personne.

Il existe trois rôles distincts, ce qui va influer sur le prix du siège :

Full seat : 45$

Le full site va correspondre à un utilisateur qui dispose de droits de design et de développement.

- l’admin : possède tous les droits ;

- site manager : possède le droit de design et de gestion de la facturation ;

- designer : possède tous les droits relatifs au développement du site internet.

Limited seat : 19$

Un limited seat correspond à un utilisateur qui dispose de droits relatifs à la gestion du contenu statique et dynamique mais qui n’a pas le droit de toucher au code du site.

- marketer : il a le droit de créer de nouvelles pages et d’utiliser les components créés par les développeurs ;

- content editor : peut uniquement modifier le contenu statique et dynamique et laisser des commentaires.

Free seat : 0$

- reviewer : un utilisateur qui a le droit de consulter le site sans apporter de modifications directement, mais qui a le droit de laisser des commentaires à travers le mode commentaire que l’on va détailler juste après.

Pour en savoir davantage sur le fonctionnement de l’edit mode pour les éditeurs, nous conseillons l’article de Webflow sur le sujet.

Webflow Help Center - Edit mode

Mode commentaire

Le mode commentaire est l’une des dernières friandises imaginées par les ingénieurs de Webflow. Et probablement par leurs équipes produit aussi !

Et comme son nom l’indique, attention suspens… C’est un mode qui permet de laisser des commentaires ! Et oui, pas évident de s’en douter de celle-là ;)

C’est une fonctionnalité qui est accessible par tous les rôles d’utilisateur dans votre workspace simplement en cliquant sur la petite icône de commentaire en haut à droite du canva.

Cela vous transfère alors dans un mode où vous pouvez laisser des commentaires n’importe où dans le canva afin de pouvoir indiquer précisément ce à quoi vous faites référence.

Il va de soi que cette fonctionnalité est extraordinaire, tant pour les développeurs que pour les clients, puisqu’elle permet de travailler beaucoup plus efficacement, tout en améliorant la communication entre tous.

De plus, ce système permet au développeur, ou à n’importe quelle équipe à laquelle le commentaire s’adresserait, de pouvoir répondre au commentaire. Ce qui crée des sortes de fils de discussions spécifiques pour chaque point directement au sein du designer. Mais en plus de noter l’état d’avancement de chaque commentaire / retour, afin de garder une traçabilité de ce qui a été fait et de ce qu’il reste à faire.

Custom code en preview

J’ai arrêté de compter le nombre de fois où pendant que j’étais en train de développer des sites quelqu’un passait au dessus de mon épaule et me dit : euuuuuh pourquoi tel bidule il bouge pas, il était censé bouger, non ?

Et moi, obligé de leur expliquer que le javascript ne s’exécute pas en preview mode et que c’est pour ça que ça bouge sur le site en production mais pas dans le designer… Autant lui parler de métaphysique, il savait même pas ce que c’était le javascript…

Eh bien j’imagine que Webflow a entendu la frustration de tous ces développeurs et que pour leur éviter de reperdre du temps à l’avenir à devoir expliquer la base des technologies web, a ajouté une option permettant de faire s’exécuter le custom code aussi en preview mode.

Pour l’activer, il suffit de cliquer sur le petit toggle que vous trouvez en bas à gauche dans le preview mode.

L’utilité de ce mode, surtout dans le cadre de la collaboration, est donc qu’il est possible de faire apparaître le site comme il sera réellement post-production, avec toutes les petites fonctionnalités javascript en plus que cela peut comporter. Et donc pouvoir utiliser la fonctionnalité des commentaires avec beaucoup plus de précision et d’efficacité.

CMS

Fut un temps que les moins de 4 ans ne peuvent pas connaître. En ce temps, toutes les modifications que vous vouliez apporter à un élément dynamique, comme un article de blog ou une page service qui serait construite à travers le CMS, toute la gestion du contenu devait se faire directement depuis l’interface de gestion du CMS. Dans le designer ou dans l’editor mais en tout cas dans le CMS.

Aujourd’hui, ce temps n’est plus, le monde continue à progresser et Webflow avec. Si vous souhaitez modifier un contenu, un titre ou même une image d’un élément qui à vocation à être dynamique, vous n’avez qu’à faire un double-clic directement depuis le designer, écrire, et la modification sera automatiquement répercutée en base de données côté CMS. Plutôt pratique pour éviter les allers/retours.

Pratique certes, mais, par conséquent, le comment mode doit lui aussi s’adapter à cette nouvelle réalité.

Vous avez désormais la possibilité de commenter directement au sein du canva des pages dynamiques, appelées pages templates. Le commentaire sera alors attaché à la page dynamique sur laquelle vous avez apposé ce dernier, et non pas sur toutes les autres pages du même template - cela va de soi. Ce système permet donc de faciliter grandement le travail collaboratif au sein des pages de contenus dynamiques. Ce qui, vous le constaterez, va s’avérer particulièrement utile, notamment dans le cadre de la création de contenu pour votre stratégie SEO, par exemple. Ou bien pour peaufiner les performances de pages de conversion dynamiques !

Automation

Les webhooks natifs de Webflow peuvent parfois être un peu limités pour des cadres d’utilisations plus avancées ; par exemple, pour faire remonter certaines informations de tracking sur-mesure. Dans ce cas, il est nécessaire de mettre en place des infrastructures plus sophistiquées. Probablement que l’on rédigera bientôt un article qui aborde le sujet plus en profondeur !

Toutefois, Webflow sait aussi s’adapter à tout utilisateur disposant de différents bagages techniques et a donc choisi d’inclure les commentaires comme nouvel événement natif pour le déclenchement de vos Webhooks.

Grâce à cette fonctionnalité, à chaque fois qu’un collaborateur postera un nouveau message avec le comment mode, vous pouvez décider d’être alerté directement sur votre canal slack préféré, de vous envoyer un whatsapp, ou alors de lancer une automation pour vous servir un café automatiquement, à condition que vous disposiez d’une cafetière connectée.

Si vous souhaitez savoir automatiser votre cafetière connectée à l’aide de Webhooks, n’hésitez pas à faire appel à Octolio :)

Realtime

Real time, c’est une des dernières friandises que nous propose Webflow. Peut-être que certains d’entre vous connaissent la fonctionnalité real time de Figma qui vous permet de voir en temps réel où se trouve la souris des autres utilisateurs sur un même projet et donc de “regarder” au même endroit qu’eux en temps réel.

J’imagine la réunion des projects managers chez Webflow qui ont dû se dire que c’est là une fonctionnalité de Figma super utile au travail collaboratif et que ce serait génial de pouvoir implémenter la même chose au sein du Designer Webflow. J’imagine aussi la tête des devs qui ont dû se coltiner les sprints de développement !

Toujours est-il après de longs mois de développement et de tests unitaires, voici cette fonctionnalité lancée en production pour le plus grand bonheur des utilisateurs de Webflow.

Le mode agency

Jusqu’à présent, toutes les fonctionnalités que nous avons évoquées ont été conçues pour vous permettre de travailler en équipe de manière fluide et efficace pour la réussite de votre développement sur internet, à l’aide des outils mis en place par Webflow.

Cependant, il reste un acteur central dans la réussite de vos projets web que nous n’avons pas encore évoqué.

En effet, lorsque vous allez vouloir sauter le pas et engager une agence Webflow pour développer votre tout nouveau site Webflow avec Octolio 😉, il va bien falloir nous donner accès à votre workspace afin que nous puissions travailler sur votre projet.

Evidemment vous vous en doutez, Webflow a pensé à tout !

En effet, du point de vue d’un professionnel de Webflow comme nous, il est essentiel d’adopter une organisation militaire pour gérer l’ensemble des projets clients et des fonctionnalités sans oubli, sans retard, et en conservant de façon constante le niveau d’exigence qui fait notre réputation.

Guest role

Guest role, c’est le nom que porte la solution conçue par Webflow pour fluidifier et améliorer le travail collaboratif entre agences et clients.

Au début de chaque projet que vous pourriez souhaiter confier à une agence, il y a deux solutions.

Soit le projet peut être développé directement au sein du workspace de l’agence, et ensuite être transféré une fois terminé. Ou alors, il peut être construit au sein du workspace du client et l’agence peut donc avoir accès à ce workspace grâce à guest role.

En fonction des équipes qui seront alors amenées à travailler sur votre projet, il nous est possible d’accorder spécifiquement des droits aux personnes de nos équipes qui devront intervenir. Et vous avez bien sûr, en tant que propriétaire, la possibilité de modérer ces accès en coordination avec votre chef de projet Octolio.

Chez Octolio, nous souhaitons toujours, et en fonction de vos attentes, nous positionner comme des partenaires de confiance pouvant intervenir tout au long de la vie de vos projets webs qui doivent logiquement accompagner la vie de votre entreprise.

Nous préférons donc toujours travailler au sein de votre environnement, d’une part pour vous garantir l’entière propriété du produit pour lequel vous nous aurez mandaté, mais aussi et surtout pour garantir une collaboration efficace au sein de l’écosystème mis en place par Webflow. Le tout en garantissant une sécurité accrue.

Plus besoin de transférer des sites d’un workspace à l’autre voire pire, de partager des mots de passe 🙅

Faites-vous accompagner pour votre projet Webflow

30 minutes

Pour discuter de votre projet, c’est ici

Nous contacter

Nous pouvons tous tomber d’accord sur le fait que la gestion d’un asset digital tel qu’un site internet en 2025 (et pour les années à venir) est devenu une tâche grandement collaborative. Entre pouvoir laisser intervenir les équipes marketing, les designers ou tout simplement les développeurs, tout ce petit monde doit pouvoir travailler en harmonie et, surtout, en limitant les erreurs possibles.

Je vous propose donc à travers cet article un petit guide dans le monde merveilleux des fonctionnalités (poussées) de collaboration mises en place Webflow.

Vous en voulez plus ?

Le registre du No Code

Toutes les actus
Webflow
4 MIN
de lecture

Comment Webflow a élevé la collaboration au rang d’art ?

Comprendre les outils Webflow qui facilitent le travail collaboratif

Lire l'article
Webflow
4 MIN
de lecture

Wappalyzer : comment analyser les technologies derrière un site Webflow ?

Comment utiliser Wappalyzer pour décrypter la stack technologique d’un site Webflow

Lire l'article
Webflow
4 MIN
de lecture

Créer des animations Lottie dans Webflow : guide complet

Comment exploiter toute la puissance de Lottie dans Webflow et sublimer vos projets.

Lire l'article
Webflow
3 MIN
de lecture

GSAP vs Interactions Webflow : quel outil pour animer vos pages ?

Webflow Interactions ou GSAP : Lequel choisir ? Pour quel usage ? Avec quelles limites ?

Lire l'article