Développement Web
Formation Webflow : création de sites professionnels sans code
Cette formation permet de concevoir, structurer et publier des sites professionnels avec Webflow dans une logique de production sans code.
Format
Intra-entreprise
Durée recommandée
≈ 21 à 35 heures
Démarrage
Sous 15 jours
Sur-mesure
Programme co-construit avec le formateur
Mis à jour le
Pour qui ?
- ›Webdesigners, chargés de communication, créateurs de contenus ou responsables digitaux souhaitant produire des sites professionnels sans développement avancé.
- ›Intégrateurs, chefs de projet web, indépendants ou profils marketing amenés à concevoir, mettre à jour et faire évoluer des sites vitrines ou éditoriaux.
- ›Équipes communication, digital, branding ou production intervenant sur la création d’interfaces web cohérentes, responsive et administrables.
Prérequis
- ›Maîtriser les usages courants de l’outil informatique et de la navigation web.
- ›Avoir une culture générale du web, de la mise en page et des contenus numériques est recommandé.
- ›Une première sensibilité au design d’interface ou à la structuration de contenus constitue un atout.
Objectifs pédagogiques
- ›Comprendre l’environnement Webflow et son positionnement dans une chaîne de production web sans code.
- ›Concevoir des pages et des gabarits professionnels en structurant correctement les sections, composants et styles.
- ›Créer des interfaces web cohérentes, responsives et maintenables dans le respect des bonnes pratiques de design et d’ergonomie.
- ›Gagner en autonomie dans la gestion des contenus, des collections CMS, des composants réutilisables et des paramètres de publication.
- ›Intégrer les bonnes pratiques de qualité visuelle, d’accessibilité, de performance, de référencement naturel et de maintenance courante.
- ›Faire évoluer un site Webflow de manière durable en articulant design, contenu, structure et logique de production.
Programme détaillé
8 modules, construits autour de vos cas réels.
Durée recommandée ≈ 21 à 35 heures, modulable selon le rythme du groupe et vos contraintes intra-entreprise.
01Prendre en main Webflow et comprendre sa logique de production
Chapitres- Découvrir l'interface Webflow, le Designer, le panneau Navigator et les zones de paramétrage du projet.
- Comprendre l'articulation entre le canvas visuel, la structure HTML générée, les classes CSS et les interactions.
- Identifier les différences concrètes entre pages statiques, composants, collections CMS et contenus dynamiques.
- Repérer les réglages de projet, les options de publication et l'organisation générale du site dans les Project Settings.
- Adopter une méthode de travail pour concevoir, prévisualiser, corriger et publier une page.
- Situer Webflow dans une chaîne de production web sans code et low-code.
02Structurer des pages professionnelles avec les éléments de mise en page
Chapitres- Construire une page à partir de sections, conteneurs, divs, blocs et grilles.
- Comprendre la hiérarchie des éléments dans le Navigator et organiser l'information de façon lisible.
- Utiliser correctement les balises de base : titres, paragraphes, liens, images, listes et boutons.
- Gérer les espacements, alignements, dimensions et comportements via le panneau Style.
- Réaliser une mise en application encadrée sur une page vitrine ou institutionnelle.
03Maîtriser les classes, styles et composants réutilisables
Chapitres- Comprendre la logique des classes Webflow et leur impact sur la cohérence visuelle du site.
- Créer et organiser des classes réutilisables pour textes, boutons, sections et cartes.
- Exploiter les combo classes et les classes globales pour mutualiser le style sans casser la structure.
- Structurer une base graphique homogène avec les Style Guide et les variables.
- Convertir des éléments récurrents en composants et propager les mises à jour.
- Définir des conventions de nommage simples pour préserver la maintenabilité du projet.
04Concevoir des interfaces responsive sur tous les écrans
Chapitres- Comprendre le fonctionnement des breakpoints Webflow et leur cascade descendante puis ascendante.
- Ajuster mises en page, tailles, espacements et comportements pour desktop, tablette et mobile.
- Prioriser contenus et actions selon le confort d'usage de chaque support.
- Tester la cohérence visuelle et fonctionnelle des pages dans les différents contextes d'affichage.
- Repérer et corriger les erreurs fréquentes de responsive design liées au box model et au flux.
05Gérer les contenus dynamiques avec le CMS Webflow
Chapitres- Comprendre le rôle des collections CMS dans la production de contenus structurés et réutilisables.
- Créer des collections de type actualités, projets, équipes, services ou témoignages.
- Définir les champs de collection adaptés à une publication claire et durable.
- Concevoir des Collection Pages et des Collection Lists pour automatiser l'affichage.
- Filtrer, trier et relier les contenus CMS aux composants et aux pages.
- Réaliser une mise en application encadrée sur une structure de contenus dynamiques courante.
06Intégrer médias, interactions et navigation
Chapitres- Importer et organiser les médias en tenant compte de la qualité d'affichage et de la performance.
- Construire menus, liens internes, appels à l'action et parcours de navigation clairs.
- Configurer des interactions Webflow déclenchées au scroll, au survol ou au clic.
- Animer des éléments de façon sobre et pertinente selon le contexte de communication.
- Contrôler la cohérence entre intention graphique, usage réel et comportement du site.
07Appliquer les bonnes pratiques SEO, accessibilité et qualité web
Chapitres- Structurer les pages avec une hiérarchie de titres cohérente et des contenus lisibles.
- Renseigner les éléments de référencement : balises title, meta description, slugs et Open Graph.
- Améliorer l'accessibilité : contrastes, textes alternatifs, clarté des liens et structure des contenus.
- Optimiser les médias et le poids des pages pour limiter les impacts sur les performances.
- Repérer les erreurs courantes qui nuisent à l'indexation ou à l'expérience utilisateur.
- Mettre en place une routine de contrôle qualité avant chaque publication.
08Publier, administrer et faire évoluer un site Webflow
Chapitres- Maîtriser les options de prévisualisation, de mise en ligne et de gestion de domaine personnalisé.
- Gérer les mises à jour de contenus, de composants et de structures dans la continuité.
- Identifier les points de vigilance liés à la maintenance et à la gouvernance éditoriale.
- Prévenir les erreurs liées aux modifications de classes, de structure ou de contenus dynamiques.
- Inscrire l'usage de Webflow dans une démarche durable d'autonomie et d'amélioration continue.
Moyens & supports pédagogiques
- Accueil des stagiaires
- Supports de formation projets
- Apports théoriques et pratiques
- Études de cas concrets
- Auto-positionnement
- Accès en ligne aux ressources
Évaluation & suivi des acquis
Feuille de présence
Émargement des stagiaires en présentiel ou à distance, via support papier ou signature électronique.
Émargement sécurisé
Signatures électroniques collectées en ligne et conservées dans un coffre-fort numérique sécurisé par Dendreo.
Auto-positionnement
Évaluation du niveau des stagiaires en début et en fin de formation pour mesurer la progression.
Évaluations pédagogiques
Validation des acquis par des questions orales ou écrites tout au long de la formation.
Mises en situation
Exercices pratiques et cas concrets pour ancrer les compétences dans la réalité métier.
Attestation de fin de formation
Remise d'une attestation officielle à l'issue de la formation.
Délai d’accès
Sous 15 jours après validation du devis
Accessibilité PSH
Adaptations possibles en situation de handicap. En savoir plus
Prochaine étape
Construire votre formation Webflow : création de sites professionnels sans code
Un échange de 20 minutes suffit pour cadrer vos enjeux et la session. Devis personnalisé sous 48h, démarrage sous 15 jours.
- Réponse sous 24h ouvrées
- 01 85 71 00 29
Pour aller plus loin
