Eventos clásicos (A.M.)¶
Durante mucho tiempo, WebAcappella ofreció animaciones de apariencia a través de WOW.js. Ahora puede optar por utilizar la biblioteca AOS (Animate On Scroll) directamente en las Propiedades del proyecto. AOS ofrece efectos de apariencia modernos y fluidos que son fáciles de ajustar, sin tener que escribir ningún código.
Activar el AM en el proyecto¶
Abra su proyecto WebAcappella.
Vaya a Propiedades del proyecto → Animaciones.
Aplicar un efecto de apariencia a un componente¶
Seleccione un componente (texto, imagen, botón, bloque, etc.).
Abra el panel Animación en apariencia.
Elige un tipo de efecto (por ejemplo, fundido, deslizamiento, zoom, rotación ligera).
Buenas prácticas¶
Menos es más Limítese a unos pocos efectos coherentes (por ejemplo, desvanecimiento + ligera traslación).
Centrarse en el contenido El efecto debe ser fácil de entender (destacar un título, un CTA, un paso clave).
Rendimiento Evite animar demasiados elementos simultáneamente, especialmente en móviles.
Coherencia visual Armonizar las duraciones, escalas temporales y tipos de efectos en todo el emplazamiento.
Accesibilidad / Comodidad Prefiera efectos cortos y moderados que sean agradables a la vista y no intrusivos.
Compatibilidad con navegadores Algunos efectos pueden aparecer de forma diferente en distintos navegadores (especialmente Safari). Pruebe sus páginas en varios dispositivos.
Casos de uso recomendados¶
Títulos de las secciones: ligero desvanecimiento + discreto deslizamiento vertical.
Bloques visuales (mapas, miniaturas): zoom muy ligero en apariencia.
CTA (botones de acción): desvanecimiento rápido y limpio para mantener la capacidad de respuesta.
Listas de artículos: aparición en cascada (retardos cortos sucesivos).
Migración desde WOW.js¶
Los proyectos antiguos configurados con WOW.js siguen siendo funcionales.
Para aprovechar las ventajas del AOS: 1. active el AOS en las propiedades del proyecto. 2. Repase sus componentes clave y vuelva a aplicar los efectos de apariencia. 3. Alinee las duraciones y los retardos para garantizar la coherencia visual.
Recordatorio de marketing¶
Las animaciones bien elegidas resaltan sus mensajes (promoción, noticias, prueba social) y atraen la atención. Demasiados efectos distraen del contenido, cansan al usuario y pueden dañar la percepción de calidad y rapidez.