Eventi classici (AOS)¶
Per molto tempo, WebAcappella ha offerto animazioni dell’aspetto tramite WOW.js. Ora è possibile scegliere di utilizzare la libreria AOS (Animate On Scroll) direttamente nelle Proprietà del progetto. AOS offre effetti di aspetto moderni e fluidi, facili da regolare, senza dover scrivere alcun codice.
Attivare AOS nel progetto¶
Aprite il vostro progetto WebAcappella.
Andare su Proprietà del progetto → Animazioni.
Applicare un effetto di aspetto a un componente¶
Selezionare un componente (testo, immagine, pulsante, blocco, ecc.).
Aprite il pannello Animazione sull’aspetto.
Scegliere un tipo di effetto (ad esempio, dissolvenza, diapositiva, zoom, leggera rotazione).
Le migliori pratiche¶
Meno è meglio Limitarsi a pochi effetti coerenti (ad esempio, sfumatura + leggera traslazione).
Concentratevi sul contenuto L’effetto deve essere facile da capire (evidenziate un titolo, una CTA, un passaggio chiave).
Prestazioni Evitare di animare troppi elementi contemporaneamente, soprattutto su mobile.
Coerenza visiva Armonizzare durata, tempi e tipi di effetti in tutto il sito.
Accessibilità / Comfort Preferire effetti brevi e moderati, piacevoli alla vista e non invasivi.
Compatibilità con i browser Alcuni effetti possono apparire in modo diverso nei diversi browser (in particolare Safari). Testate le vostre pagine su diversi dispositivi.
Casi d’uso consigliati¶
Titoli di sezione: leggera dissolvenza + discreto scorrimento verticale.
Blocchi visivi (mappe, miniature): leggerissimo zoom sull’aspetto.
CTA (pulsanti di azione): dissolvenza rapida e pulita per rimanere reattivi.
Elenchi di elementi: comparsa a cascata (brevi ritardi successivi).
Migrazione da WOW.js¶
I vecchi progetti configurati con WOW.js rimangono funzionali.
Per sfruttare AOS: 1. abilitare AOS nelle proprietà del progetto. 2. Tornare ai componenti chiave e riapplicare gli effetti di aspetto. 3. Allineare durate e ritardi per garantire la coerenza visiva.
Promemoria di marketing¶
Le animazioni ben scelte mettono in risalto i vostri messaggi (promozione, news, social proof) e attirano l’attenzione. Troppi effetti distraggono dal contenuto, stancano l’utente e possono danneggiare la percezione di qualità e velocità.