Las animaciones pueden hacer que una página se sienta viva, pero es fácil pasarse. Un poco de movimiento llama la atención sobre lo importante. Demasiado hace que la página se sienta cargada y frena la lectura.
Actualizado el
Selecciona un bloque y abre la pestaña Animación. Elige un disparador y un efecto.
Al aparecer reproduce la animación cuando el bloque entra en pantalla por primera vez.
Al hacer scroll ata la animación a la posición del scroll. El bloque cambia poco a poco mientras sube por la pantalla.
Al aparecer es la opción más segura para la mayoría del contenido. Al hacer scroll funciona mejor para una sola imagen principal o una secuencia corta, no para cada sección.
Los efectos incluyen desvanecer, deslizar hacia arriba, deslizar hacia abajo, deslizar a la izquierda, deslizar a la derecha, zoom, desenfoque, rotar, voltear y cortinilla.
Elige un efecto que vaya con la dirección del contenido. Una tarjeta que sube desde abajo se siente natural. Un párrafo que rota al entrar normalmente no.
Rápida va bien para cambios pequeños de interfaz.
Normal es un valor por defecto seguro.
Lenta y Muy lenta van bien para imágenes grandes y secciones principales.
El suavizado cambia cómo arranca y cómo frena el movimiento. Suave es un buen valor por defecto. Resorte añade un rebote juguetón. Lineal es lo mejor para movimiento ligado al scroll.
La intensidad controla cuánto se mueve el bloque. Sutil suele ser suficiente. Fuerte puede funcionar para una imagen principal, pero también puede sentirse pesado.
El retardo espera antes de que empiece la animación. Úsalo para crear una secuencia: primero el encabezado, luego el texto y luego el botón.
El escalonado reparte la animación entre los hijos de un bloque. Funciona bien para una fila de tarjetas o una lista de características.
No hagas esperar a los visitantes. Un retardo de más de medio segundo empieza a sentirse como si la página fuera lenta.
Una vez se reproduce la primera vez que el bloque entra en pantalla.
Cada vez se reproduce de nuevo cuando el bloque sale y vuelve.
Usa Una vez para la mayoría del contenido. Cada vez puede distraer si el visitante sube y baja.
La pestaña Animación tiene un control para volver a reproducir. Úsalo para revisar el efecto sin tener que bajar y volver a subir.
Revisa también la página en un teléfono. Un movimiento que se siente suave en escritorio puede sentirse más fuerte en una pantalla pequeña.
Los visitantes que piden a su dispositivo reducir el movimiento no ven estas animaciones. Es intencionado. No dependas de una animación para revelar información esencial.
Si el contenido está oculto hasta que se reproduce una animación, asegúrate de que igualmente aparezca para alguien que tenga activada la reducción de movimiento.
Para una fila de características:
Construye la fila y sus tarjetas.
Selecciona la fila y añade una animación.
Elige Al aparecer, Deslizar hacia arriba, Sutil y Una vez.
Añade un pequeño escalonado para que las tarjetas lleguen una tras otra.
Mantén el retardo corto.
Después revisa la página en el móvil y con la reducción de movimiento activada, si puedes.
Un creador de sitios web que funciona como un documento. CMS, formularios y alojamiento en la UE incluidos.
© 2026 Remake. Todos los derechos reservados.
