Animaciones en tu web sin usar flash

flash

¡Flash!

En muchas situaciones los diseñadores web se ven en la situación de que algún cliente les pide que en su página haya animaciones o recursos de movimiento. Hace unos años si la animación requerida implicaba cierta complejidad, lo habitual en este tipo de situaciones era recurrir a Flash.

Pero la agonía en la que se encuentra Flash desde hace unos años parece que ya en 2015 se ha acelerado hasta encontrarnos probablemente con su desaparición total del entorno web dentro de muy poco.

Pero qué sucede si además al cliente en cuestión “un amigo de un amigo” le ha comentado que no use Flash en su página web porque no se ve en los iphones, ipads… y además es malo para el posicionamiento de la página. En una situación así un diseñador web se verá obligado admitir que lo que le contó “el amigo del amigo” es cierto y tendrá ofrecer otro tipo de soluciones en las que no sea necesario el uso de Flash (cosa por otro lado altamente recomendable a día de hoy).

 

flash jquery

JQuery

Para este tipo de situaciones tenemos una serie de plugins de JQuery que nos permitirán crear animaciones para nuestras páginas web de forma eficaz y sencilla sin vernos en la necesidad de usar Flash.

Con estos plugins no podremos generar animaciones con un nivel de complejidad muy, muy elevado, cosa que sí podía hacerse con Flash, pero pueden resultar muy eficaces para solventar recursos en un sitio web animado. Y en definitiva es cuestión que el diseñador web le haga ver al cliente que una cosa por otra.

Recursos

Por una parte existe Spritely, que nos permite agregar movimiento a elementos de nuestra página web. El plugin es de código abierto y compatible con los principales navegadores, además está optimizado para dispositivos móviles. En su web tenemos toda la documentación y nos presentan un ejemplo gracioso de su funcionamiento:

http://www.spritely.net

Textualizer nos permite agregar animaciones a los textos de nuestra página web. El plugin tiene varios efectos distintos, se puede definir la duración y el tipo de transición. También es compatible con los principales navegadores. En su web viene perfectamente explicado su funcionamiento e implementación:

kiro.me/textualizer

El vídeo de textualizer está en alemán, pero tienes opción de activar el traductor de subtítulos 😉

Existen infinidad de plugins basados en JQuery. No obstante Spritely y Textualizer, pueden llegar a cubrir gran parte de las necesidades de animación que habitualmente se requieren en una web.

 

Conclusión

En cuestión de animación para una página web realmente hoy por hoy con Javascript y HTML5 están cubiertas el 90 % de las necesidades demandadas para el entorno del diseño y desarrollo web.

Lógicamente para cuestiones básicas en banners y demás puedes seguir utilizando gifs animados. El progrma Fireworks de Adobe es una buena herramienta para ello. Más detalles sobre Fireworks aquí.

¿Qué plugins para animar usas tú?

 

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s