Webflow Basics
Webflow est un outil no-code qui permet de créer des sites web en partant de zéro.
La maîtrise des bases est essentielle avant d’aborder le CMS, les animations ou l’intégration 3D.
Interface
Section intitulée « Interface »- Canvas : zone centrale de construction.
- Navigator : hiérarchie des éléments (semblable au DOM).
- Panneaux latéraux :
Add: ajouter des éléments (textes, images, boutons, containers).Style: classes, marges, paddings, couleurs, typographies.Settings: paramètres des éléments.
Styles & classes
Section intitulée « Styles & classes »- Classes réutilisables → appliquer et garder une cohérence visuelle.
- États (hover, focused, pressed) → définir des comportements interactifs.
- Responsive design : styles hérités du desktop vers mobile (approche desktop-first).
Responsive
Section intitulée « Responsive »- Breakpoints par défaut : desktop, tablette, mobile landscape, mobile portrait.
- Possibilité d’ajouter des breakpoints personnalisés.
- Option “masquer/afficher selon appareil” pour ajuster le design.
Tip
Toujours vérifier l’accessibilité : textes alternatifs sur les images et contraste des couleurs selon WCAG.