Les 7 outils indispensables du développeur Webflow en 2024

Il existe des centaines d'outils no-code, mais en tant que développeur Webflow, si je ne devais choisir que 7 outils pour ma stack en 2024, ce seraient les suivants :

Short version ↓

1. Relume Library (IA) : Accélération de votre processus de développement
2. Finsweet Chrome Extension : +80 fonctionnalités tech spécialement conçues pour repousser les limites de Webflow.
3. Midjourney (IA) : Utilisation de l'IA pour générer des images comme alternative aux banques d'images traditionnelles.
4. ChatGPT (IA) : Ai-je vraiment besoin d'expliquer ? 😉
5. Figma : L'outil parfait pour allier design et collaboration.
6. Squoosh.app : Outil gratuit et efficace pour reformater vos images.
7. Detailed SEO extension : Un outil utile et tout-en-un qui permet d'auditer facilement le SEO d'un site.

Long version ↓

1 — Relume Library (IA)

Avec ses nombreuses fonctionnalités ;

• Bibliothèque de composants responsives à copier/coller pour Figma et Webflow
• Génération de sitemaps et/ou de wireframes via l'intelligence artificielle
• Génération de copywriting via IA sur wireframe web
• Bibliothèque d'icônes SVG
• Extension Chrome pour l'interface Webflow

La Relume Library est l'outil qui accélère le plus considérablement mon processus de développement.

💶 Prix : À partir de 38$ par mois

💡 Il est important pour vous de voir ce prix comme un investissement : si cet outil vous permet de développer 2x plus de sites par an, les 38$ par mois seront très très vite rentabilisés.

J'essaie la Relume Library →

2 — Finsweet Chrome Extension

Avec plus de 80 fonctionnalités développées spécialement pour améliorer votre workflow, Finsweet Chrome Extension est de loin la meilleure extension technique pour Webflow.

Mise à part les attributs Finsweet, qui ne sont plus à présenter, la fonctionnalité ‘Unbind CMS’ permettant de déconnecter une collection CMS d'un ensemble d'éléments, est probablement ma fonctionnalité préférée.

💶 Prix : Gratuit

J'essaie l'extension Chrome de Finsweet →

3 — Midjourney (IA)

Midjourney est une intelligence artificielle qui vous permet de générer de superbes images, uniques et personnalisables, en quelques minutes seulement, sur la base d'un prompt.

C'est une alternative idéale pour remplacer les placeholders vides lors de la livraison d'un projet (si le contenu du client n'est pas prêt) ou pour ajouter une touche plus personnalisée que les images bien connues et beaucoup trop vues des banques d'images gratuites comme Pexels ou Unsplash.

💶 Prix : À partir de 8$ par mois

J'apprends à utiliser Midjourney gratuitement sur la Digidop Académie →

4 — ChatGPT (IA)

Ai-je vraiment besoin d'expliquer ? 😉 Les cas d'utilisation de cette intelligence artificielle sont nombreux :

• Correction de code erroné,
• Génération de code JavaScript,
• Édition rapide de code CSS personnalisé,
• Copywriting pour le site internet du client (Ex : Titles et Meta Tags, remplacement de Lorem Ipsum, etc.)

💶 Prix : Gratuit

J'essaie ChatGPT →

5 — Figma

Figma est un puissant outil de design à la fois intuitif et collaboratif. C'est un outil no-code indispensable à maîtriser pour tout développeur Webflow, afin de :

• Créer des formes en SVG à intégrer dans le développement de son site,
• Recadrer des visuels à intégrer dans un projet ou layout spécifique,
• Échanger avec les clients ou les designers en charge du projet (Test & itérations, feedbacks, questions ?) depuis une interface unique,

et dans bien d'autres cas d'utilisation...

💶 Prix : Gratuit

Je me forme gratuitement à Figma avec la Digidop Académie →

6 — Squoosh.app

Squoosh est un outil simple et intuitif, développé par Google, qui vous permet de redimensionner et de compresser vos images dans différents formats : WebP, MozJpeg, etc. Il suffit de glisser-déposer vos visuels et de choisir les transformations que vous souhaitez leur apporter dans le panneau de fonctionnalités.

C'est un véritable plus, pour intégrer les images dans votre site Webflow en suivant les meilleures pratiques. Cela permet d'assurer un chargement rapide de l'ensemble du site une fois mis en ligne.

Bonus : Vous pouvez gérer le niveau de qualité et de compression, afin de conserver un rendu net.

💶 Prix : Gratuit

J'essaie Squoosh.app →

7 — Detailed SEO extension

Cette extension Chrome gratuite vous permet d'auditer, en quelques clics et depuis une seule interface, le respect des bonnes pratiques SEO des pages du site une fois mises en ligne (fonctionne aussi sur la version webflow.io) :

• Title Tag SEO
• Meta Tag SEO
• Alt Text
• Structure de headings (H1, H2, H3, etc.)
• Données structurées
• Etc...

💶 Prix : Gratuit

J'essaie gratuitement Detailed SEO extension →

🎁 Bonus — Le tee-shirt du développeur Webflow

Le tee-shirt Webflow Builder est l'équipement incontournable de tout bon développeur Webflow. Avec ses différentes caractéristiques :

• 100% coton
• 240 g
• Oversize
• Flocage identitaire

Le port de ce t-shirt vous met dans les conditions idéales pour créer des sites web avec l'outil no-code Webflow 💜

J'achète mon t-shirt Webflow Builder →

Envie d'en apprendre plus sur l'utilisation des outils no-code ?

Découvrez une variété de ressources gratuites sur Webflow, le Webdesign et le no-code en général sur :

• Le blog de Digidop (+500 articles)
• La chaîne Youtube de Digidop (+200 vidéos en français)
• La Digidop Académie (+5 heures de formations gratuites)