.png){kind=small}
.svg){kind=small}
%20(29)%20(1).jpg)
Webflow s’est rapidement imposé comme une référence dans le monde du no-code. En effet, il offre à tous l’opportunité de créer des sites web professionnels et fonctionnels, même sans maîtriser de code.
Si sa prise en main reste accessible, ce logiciel peut paraître impressionnant. Ses fonctionnalités sont nombreuses, et certains concepts méritent qu’on y consacre du temps.
Pour vous aider à débuter sur l’outil, nous avons sélectionné les 5 meilleurs tutoriels Webflow.
#1 Tuto pour apprendre Webflow en 30 Minutes par Ritch Rivia (Vidéo)
Richard est l’auteur de la chaîne YouTube Ritch Rivia. Consacrée à Webflow, vous y trouverez des tutoriels, des vidéos explicatives et des présentations de site pour maîtriser cet outil no-code.
Ce tuto vidéo dédié à Webflow dure 30 minutes et se présente comme une introduction au logiciel. En effet, impossible de présenter autant de fonctionnalités en 30 minutes qu’en plusieurs heures de vidéo.
Toutefois, ce tutoriel plaira aux débutants sans aucune notion de code. En effet, Richard prend le temps de présenter des concepts fondamentaux comme le fonctionnement d’une page web ainsi que les notions de HTML et CSS.
Vous suivrez le développement d’une section bannière d’un site web. D’ailleurs, Richard propose le fichier Figma en description de la vidéo afin que vous puissiez reproduire l’exercice. Vous découvrirez alors les bons réflexes pour aborder ce type de projets, des astuces et des raccourcis bien utiles.
#2 Tutoriel pour créer un Site Web pro sur Webflow par Kevin Palombo (Vidéo)
Ce tuto Webflow est présenté par Kevin Palombo. Contrairement aux autres tutoriels présentés précédemment, la chaîne de Kevin est davantage axée sur l’entrepreneuriat que sur l’utilisation d’outils. À travers ses vidéos, Kevin a pour ambition d’aider son audience à
« transformer leur passion en profit pour devenir des entrepreneurs à succès ».
D’ailleurs, il annonce la couleur : ce tutoriel se destine à des professionnels qui souhaitent élargir leur offre de services. Ainsi, il s’adresse principalement à des graphistes et designers
qui veulent développer davantage leur activité, ou encore aux développeurs qui voudraient gagner du temps.
Ce tutoriel Webflow organisé sous forme de playlist Youtube regroupe 8 vidéos et dure au total 2h30. Vous retrouverez les notions suivantes :
- La vision
- La structure
- Le design
- Le développement
- La création d’une partie blog
- La mise en place d’une version mobile
- La mise en ligne
Dans ce tuto, Kevin montre pas à pas le développement d’un projet sous Webflow.
Cela comprend la partie réflexion, l’utilisation de Figma pour les maquettes, tout en abordant les options pour monétiser ses connaissances grâce à l’outil.
Pédagogue, méthodique, Kevin partage des astuces et méthodes afin de monter en compétences sur Webflow.
#3 Tutoriel Webflow, le guide du débutant absolu par Webflow (Article)
Cet article fait partie des nombreux tutoriels créés par Webflow afin de débuter sur l’outil.
En effet, la Webflow University propose un certain nombre de ressources pour vous aider à prendre en main l’outil et à maîtriser certains concepts.
Dédié aux débutants, il permettra de découvrir l’interface et de s’approprier le vocabulaire. Les explications sont claires et avec le juste niveau de détail pour vous aider à débuter sans vous décourager.
Ainsi, vous retrouverez des explications sur des notions indispensables à maîtriser sur Webflow :
- Le concept de grid
- La notion de class
- La notion d’héritage
- Le concept de box model
Illustré, des animations et vidéos viennent compléter les instructions. D’ailleurs, nous recommandons vivement le visionnage de la vidéo consacré aux typographies.
Détrompez-vous si vous avez l’impression que ce niveau de détail n’est pas nécessaire à cette étape de votre formation. En effet, cette vidéo bien conçue vous permettra de gagner un temps fou par la suite. Par ailleurs, elle vous donne de précieux conseils pour développer un site professionnel, inclusif et accessible.
Si Webflow vous propose un tuto structuré et abordable, il vous faudra toutefois maîtriser l’anglais.
#4 Tuto pour créer une landing page de niveau 1 par Funnel Lab (Vidéo)
Funnel Lab est l’auteur de ce tuto vidéo consacré à Webflow. Cette agence Webflow est spécialisée dans le développement de landing pages, de tunnel marketing et de conversion, le tout en utilisant Webflow.
Ce tutoriel de 22 minutes est le premier d’une série de 3 organisée en niveaux (niveaux 1, 2 et 3). À chaque niveau, Funnel Lab vous accompagne dans le développement d’une page plus ou moins complexe.
Consacré au niveau 1, ce tuto présente les notions suivantes :
- Le concepts de blocs HTML et CSS
- Les class
- Les différentes positions
Sur un ton humoristique, le tout en restant pédagogue et abordable, ce contenu s’avère parfaitement adapté aux débutants.
En effet, toutes les actions y sont décrites, ce qui rend le tout dynamique.
De plus, nous apprécions l’évocation des bonnes pratiques et des raccourcis, l’idéal pour maîtriser cet outil de no-code particulièrement complet.
#5 Tutoriel pour créer un site de A à Z sur Webflow par Alex Tournis (Vidéo)
Alex Tournis de la chaîne También nous présente ce tuto vidéo pour débuter sur Webflow.
También est une chaîne Youtube consacrée à Webflow, Notion et autres outils de design. Vous y trouverez de nombreux tutoriels pour monter en compétences sur Webflow.
Ce tuto organisé sous forme de playlist YouTube est composé de 32 vidéos, le tout sur une durée de 30h. Ainsi, nous suivons Alex dans le développement d’un projet mis en place pour un client. Il s’agit de développer un site web documentaire comportant une partie e-commerce. Commandé par deux champions de glisse, ce site présente leur travail consacré à l’exploration et à la sensibilisation écologique.
Nous suivons le développement de ce projet pas à pas, qui s’étale en réalité sur environ un an. Alex y aborde notamment :
- La création de pages
- La construction d’une architecture
- Le contenu dynamique
- La partie CMS
- La création de slider
- La création de collections
- L’ajout d’animations
- Le développement d’une partie e-commerce
- La mise en ligne
Nous noterons la rigueur d’Alex et son organisation minutieuse, notamment grâce à l’utilisation de Notion. D’ailleurs, notons que Webflow et Notion se révèlent particulièrement complémentaires pour ce type de projets. Pour en savoir plus sur Notion, nous vous invitons à découvrir notre liste des 5 meilleurs tutoriels Notion.
Enfin, nous apprécions la vaste étendue des fonctionnalités abordées. En effet, en plus des éléments de conception basiques sont également passés en revue la gestion des redirections, le SEO, ou encore le paramétrage avec Google Analytics.
Bien que Webflow s’avère un outil puissant et impressionnant à première vue, les ressources disponibles pour se l’approprier se révèlent nombreuses. En effet, il existe de nombreux tutoriels structurés et gratuits pour débuter sur cet indispensable de la révolution no-code. Enfin, Webflow lui-même offre des contenus particulièrement bien réalisés et illustrés pour vous aider à créer vos propres sites web, même sans solides notions de code.