Las animaciones en el sitio Web

Las imágenes animadas son un recurso muy utilizado en los sitios web, aunque ultimamente se tiende hacia diseños enfocados más en el contenido que en este tipo de recurso de impacto visual. Las animaciones dejaron de ser un atractivo que genere interés en el visitante, tal vez un poco saturado de estos recursos de los que se hizo uso y abuso.

Que es Flash y para que sirve

Flash® es, a la vez, una herramienta de dibujo y un editor de películas, algunas de las herramientas de dibujo de Flash son similares a otras aplicaciones gráficas, aunque otras posiblemente no. La aplicación Flash se llamaba originalmente FutureSplash. En 1997, Macromedia adquirió la pequeña compañía, la cual, actualmente pertenece a Adobe.

Los gráficos vectoriales generados por Flash pretendieron ser la alternativa para los mapas de bit, debido a que los programas de gráficos vectoriales crean gráficos con instrucciones mientras que las imágenes de mapa de bits lo hacen píxel por píxel.

Escribir un sitio web con Flash no es una buena estrategia para lograr un buen posicionamiento en los buscadores ni para que el sitio sea encontrado por estos. Los robots de Google y demás buscadores no reconocen muchos elementos que generalmente pueden verse en algunas páginas web, como animaciones y botones escritos en Flash, si todo el sitio es Flash, simplemente su contenido no será reconocido.

Nota: La empresa Adobe dejó de dar soporte a Flashplayer en diciembre de 2020, tal como había anunciado en 2017, y recomienda desinstalar el producto, con lo cual, para cualquier sitio que contenga animaciones de Flash, estas ya no serán visibles. Incluso, si se intenta instalar el producto, el sitio web de Adobe redirige a una página con la advertencia del anunciado "EOL" (fin de la vida) del mismo.

Animaciones con HTML5 y CSS

Además de las características con las que contaba HTML4, la versión 5 de HTML introdujo nuevas etiquetas semánticas que permiten estructurar de una mejor manera los sitios Web, entre ellas se encuentran las que representa a los elementos header, nav, section, article y footer.

En CSS3 además, se incluyen nuevas características para trabajar con texto, cajas y maquetado. Desde el sombreado hasta la posibilidad de trabajar con múltiples columnas y también con cajas flexibles (flexible box). De la mano de Media Queries también se incorpora un nuevo paradigma: "Responsive Web Design", es decir, el diseño que se adapta al medio o dispositivo donde es visualizado.

HTML5 introduce tags destinados a trabajar con audio y video, sin necesidad de plugins adicionales. Para estos casos, los navegadores que cuenten con soporte nativo ofrecen la posibilidad de reproducir esos archivos de medios sin problemas. Para resolver problemas de compatibilidad, puede ser necesario disponer de los archivos en más de un formato. En audio es recomendable MP3 y OGG y en video WebM y MP4 (con codec H.264), entre otros formatos. Existen bibliotecas de programas que ayudan a lograr compatibilidad, entre ellas Audio.js y video.js.

En HTML5 se destacan las posibilidades que brinda "Canvas" para crear gráficos y animaciones, y funciones interactivas. CSS3 introdujo nuevas características de transición, transformación y también para crear animaciones mediante "keyframes".

En AJAX, hoy en día, las bibliotecas Java son las grandes estrellas. jQuery es probablemente la más famosa y la que permite realizar efectos sorprendentes, sin necesidad de trabajar sobre funciones de bajo nivel. Para asegurar aspectos de compatibilidad es recomendable utilizar bibliotecas como Modernizr, que permiten detectar las características del navegador, a fin de mostrar una opción alternativa en caso de que no sea compatible alguna característica de HTML5.

© Copyright 2000-2024 RI5.com.ar