Webflow spiegato
I concetti dietro Webflow — classi, posizionamento, flexbox, struttura del CMS, variabili e altro — spiegati in modo semplice, così gli strumenti hanno finalmente senso.
11 lezioni
La maggior parte della frustrazione con Webflow non riguarda i pulsanti — riguarda le idee che ci stanno sotto. Perché le classi si propagano nel modo in cui lo fanno? Quando conviene usare flexbox invece di grid? Come struttura davvero i contenuti il CMS? Questo corso rallenta e spiega i concetti, così il Designer smette di sembrare un tirare a indovinare.
Ogni lezione prende un’idea — classi, posizionamento, pattern flexbox, cartelle CMS, variabili e alcune tecniche che vi si appoggiano — e ne rende chiaro il modello mentale. Niente gatekeeping, niente “fidati e basta”: una volta capito perché una cosa funziona, puoi applicarla ben oltre l’esempio.
In questo corso
- Padroneggia le classi in Webflow: combo, global e oltre Capisci come funzionano davvero le classi in Webflow — rinominare, duplicare, combo class, global class e come Webflow riscrive i nomi delle classi in pubblicazione.
- CSS Positioning in Webflow: tutto quello che serve Padroneggia position in Webflow — static, relative, absolute, fixed e sticky — più come si comportano davvero offset, stacking e container di riferimento.
- Flexbox: pattern di layout in Webflow Costruisci tre pattern di layout Flexbox riutilizzabili in Webflow — colonne uguali, un layout grid-ish fluido e content + sidebar — e capisci perché ognuno funziona.
- Animazioni Split-Text con Stagger in Webflow (GSAP) Fai comparire i titoli parola per parola o lettera per lettera in Webflow con il pannello GSAP nativo — stagger, origine From, Split Text, maschere ed easing.
- Testare viewport landscape nel Designer di Webflow Simula un viewport landscape (basso) direttamente nel Designer di Webflow con una variabile number e un'altezza in calc() — niente pubblicazione, niente dev tools.
- Annida le categorie CMS sotto /blog in Webflow Usa un piccolo glitch di Webflow per annidare una collezione CMS sotto un percorso già esistente — come /blog/categories/… — per una struttura di contenuti più pulita e intenzionale.
- Un hover da avanzato in Webflow (solo CSS) Costruisci un'interazione hover per card in Webflow — bordo più scuro, immagine che scala, sibling desaturate — senza Interactions, solo hover state, variabili e un po' di CSS.
- Bordi Interni alla Griglia in Webflow: Responsive e Accessibili Crea bordi interni puliti tra gli elementi di una griglia in Webflow usando solo gap e background — responsive e accessibili, anche con il CMS.
- Slider 3D con CMS in Webflow (nativo + Finsweet) Costruisci uno slider 3D premium in Webflow con lo Slider nativo, un riflesso CSS, un'interazione Slider Change, poi rendilo dinamico dal CMS con Finsweet.
- Effetto Neon Glow Parametrico in Webflow Ricrea il neon glow retro di Webflow all'hover con un sistema parametrico basato su variabili CSS, color-mix() e variable modes intercambiabili — senza scegliere colori a mano.
- Workspace plan e site plan di Webflow, spiegati Capisci finalmente i workspace plan, i site plan, i seat e i client seat di Webflow — spiegati con una storia semplice così la documentazione ufficiale smette di confonderti.