Webflow est un outil no-code de conception de sites web révolutionnaire qui permet aux designers et développeurs de créer des sites web visuellement tout en générant simultanément du code HTML, CSS et JavaScript propre et prêt à l'emploi. Contrairement à d'autres outils, Webflow offre une flexibilité inégalée en permettant des designs personnalisés sans la contrainte des templates rigides.
Avec son système intégré de gestion de contenu (CMS) et ses capacités d'interaction et d'animation, il élimine la barrière entre la conception et le développement. Les professionnels peuvent ainsi visualiser en temps réel les changements apportés, rendant le processus de création plus fluide et intuitif. Webflow représente une nouvelle ère pour la conception web, combinant puissance et simplicité d'utilisation.
Au programme de ce tuto 3 heures pour apprendre Webflow
Dans cette formation en ligne, vous découvrirez :
- Les outils de base de Webflow,
- Les bibliothèques,
- L'interface,
- Les outils,
- L'exportation,
- Une mise en pratique grâce à 3 exercices
Je reste à votre disposition en entraide pour toutes questions, remarques ou besoin en vidéo complémentaire.
Un QCM vous permet de valider vos connaissances en fin de formation.
Pour en apprendre plus sur la création de site internet, vous pouvez également découvrir ma formation Figma, logiciel de prototypage incontournable.
Table des matières de cette formation Webflow (durée : 3h09m)
-
Introduction de la formation Webflow
- Introduction gratuit 00:01:00
- Avant-propos gratuit 00:02:26
-
Interface et espace de travail
- Introduction chapitre 1 00:00:55
- Interface sans connexion 00:02:07
- Interface dashbord 00:02:22
- Nouveau site 00:02:22
- Interface de création 00:02:02
- AIde et paramétrage 00:03:22
-
Les outils de Webflow
- Intro les outils 00:00:51
- Les pages 00:06:02
- Page ADD et les elements structure 00:04:29
- Element : Basic 00:05:24
- Element : Texte et connexion 00:02:40
- Element e-commerce et média 00:06:17
- Element de formulaire 00:03:01
- Element Avancé 00:03:49
- Layout 00:02:12
- Navigator 00:01:31
- Les différents styles 00:03:17
- Layout, flex et grid 00:04:50
- Spacing, Size, Position 00:07:18
- Typography 00:06:58
- Background et bordure 00:04:11
- Les effets 00:08:46
- Component 00:05:17
- Variable 00:02:53
- Style selector 00:02:33
- Asset 00:02:45
-
Les collections
- Intro CMS 00:00:57
- Les collections 1 00:08:15
- Création de vos propres collections 00:04:50
- Mise en place des CMS 00:04:50
- Logic 00:05:03
- Les utilisateurs 00:03:34
- E-commerce 00:05:14
-
Allez plus loin
- Introduction : allez plus loin 00:00:55
- Les apps 00:03:33
- Les intérations 00:04:13
- Editing 00:01:52
- Partage, publication et commentaire 00:03:23
-
Exercice pratique
- Introduction exercice pratique gratuit 00:01:15
- Header animé 00:09:42
- Formulaire de contact 00:15:25
- Mise en page de site 00:13:33
-
Conclusion
- Conclusion 00:01:14
- Fichiers sourcestélécharger
- QCMaccéder
- Certificat
Formateur : Olivier Krakus
-
Quel est le niveau requis pour suivre ce tuto ?débutant