Uso de animaciones en tu sitio Website Builder
¿Quieres darle un impulso visual al contenido de tu sitio web? ¡Intenta agregar animaciones a tu sitio!
Con las animaciones, puedes dar vida a tu sitio Website Builder con atractivos efectos visuales. Simplemente abre la configuración de un componente, selecciona un efecto de animación y obtén una vista previa al instante. Cada componente puede tener su propia animación, que puedes personalizar para que coincida con tu estilo, dándote infinitas formas de añadir un toque personal y hacer que tu sitio web realmente se destaque.
- ¿Por qué usar animaciones en tu sitio web?
- Agregar animaciones a los componentes de tu Website Builder
¿Por qué usar animaciones en tu sitio web?
Las animaciones se pueden usar de muchas maneras y para muchos propósitos. Puedes usarlas para llamar la atención sobre elementos específicos o fomentar la interacción con elementos (como botones o enlaces de redes sociales). También puedes usarlas de forma creativa para que el contenido de tu sitio web sea más vívido y animado. No importa el enfoque, las animaciones son una forma poderosa de crear un sitio web con un aspecto personal y profesional.
¿Quieres ver algunos de los efectos en acción? Echa un vistazo al GIF a continuación. En este sitio, hemos agregado diferentes efectos a textos, botones y contenedores.
Agregar animaciones a los componentes de tu Website Builder
Puedes agregar animaciones a los siguientes componentes de Website Builder:
- Texto
- Imágenes
- Cuadros y contenedores
- Botones
- Íconos
- Íconos de redes sociales
- Logotipos
Puedes acceder a las configuraciones de animación haciendo clic en la pestaña Editar que aparece en la parte superior o inferior de un componente cuando haces clic en él.
Aquí hay un ejemplo en el que agregamos efectos de animación a un fragmento de texto:
- Selecciona el componente y haz clic en Editar texto en la parte superior o inferior del mismo.
- Haz clic en Animación en el menú flotante.
- Desliza el botón Añadir animaciones para activarlo.
- En Efecto de animación, puedes seleccionar un efecto en el menú desplegable. Elige entre Desvanecer de entrada, Deslizar hacia adentro o Rebote.
- Si seleccionas Desvanecer o Deslizar hacia adentro, también tienes la opción de elegir una Dirección de animación. Esta es la dirección desde la que la animación entrará en la pantalla. En el menú desplegable, puedes elegir entre centro, arriba, abajo, izquierda o derecha.
- Puedes elegir la velocidad de la animación. Puede ser rápida (300 ms), media (600 ms) o lenta (1000 ms).
- Elige si debe haber un retraso y, en caso afirmativo, cuánto tiempo debe durar el retraso elegido.
- Guarda tus cambios y revisa la animación en la Vista previa. No se reproducirá en el editor.
- Repite el proceso anterior con otros componentes en los que quieras agregar animaciones.
Nota: Una animación solo se reproducirá una vez por carga de página. Esto también significa que no se volverá a mostrar si un visitante del sitio web se desplaza hacia atrás en una página.
Artículos relacionados: