L’animation web

Autrefois considérés comme lents et peu maniables, les sites animés voient depuis quelques années leur popularité à la hausse grâce à l’évolution d’Internet. En rendant le site interactif et dynamique, l’animation web permet à l’entreprise de se distinguer de la concurrence et de lui apporter de la crédibilité sur la toile. De plus, une animation originale et bien réalisée laisse une bonne impression dans la mémoire de l’utilisateur, pour qui l’apparence d’un site représente l’une des raisons principales d’y retourner.

L’arrivée du GIF animé

L’une des grandes innovations dans l’histoire d’Internet a été la capacité d’intégrer des illustrations et du texte sur une page web. C’est ainsi que, très rapidement, le GIF animé est venu envahir la toile du web. Résultat d’une série d’images fixes, le GIF animé a été le premier moyen d’intégrer de l’animation sur un site Internet. Incroyablement simple d’utilisation, le GIF animé connaît cependant des désavantages. Limité à 20 images fixes afin que la taille du fichier soit supportée, l’animation est à la fois très courte dans la durée et fortement saccadée (comparativement, le cinéma utilise 24 images… par seconde !)

Possibilités infinies avec Flash

Pour contourner ce problème, Adobe Systems a crée Flash, un logiciel permettant d’ajouter à un site Internet des animations dont la créativité peut être sans limite, tout cela grâce à un système vectoriel. Apportant une interactivité alors impossible avec le GIF animé, Flash connaitra une popularité immédiate. Compatible avec tous les serveurs web grâce au plugin Flash Player, on le retrouve sur de nombreux sites sur lesquels il permet d’intégrer de l’animation, de la publicité ou encore de la vidéo en streaming.

De nouvelles technologies pour de nouveaux supports

Malgré les nombreuses possibilités offertes grâce à ce logiciel, l’animation Flash a été supplantée par des technologies plus souples et évolutives telles que le HTML5, le CSS3 ou encore le jQuery, qui ne connaissent pas de contraintes de support et de taille d’écrans, leur permettant ainsi d’être compatibles avec les tablettes et les Smartphones.

Voici quelques exemples de sites Internet utilisant l’animation web de façon créative et originale :

Dotmick

Animation artistique pour dynamiser la navigation

Piccsy Playground

Transitions fluides pour ce site « one single page »

Atlantis World’s Fair

Un CSS au service de l’originalité pour ce site « one single page »

NY Times

Site changeant de couleur au fil de la lecture.

 

 

En permanente évolution, l’animation web n’a pas terminé de s’enrichir de nouvelles technologies et, comme le prouve le retour en force du GIF animé sur la toile, cela ne signifie pas que les anciennes disparaîtront. Effectivement, après avoir longtemps été jugé comme démodé, le GIF animé est désormais utilisé afin d’apporter un esprit contemporain à un site. Enfin, en attendant de voir apparaître de nouveaux outils, le plus important à savoir est que, peu importe la technologie que l’on choisit, le tout est de savoir utiliser l’animation selon le contexte de son site et, surtout, avec le bon dosage !
Depuis que CSS3 a été déployé dans les principaux navigateurs et appareils, nous avons assisté à une évolution majeure de l’animation technique. En plus de bibliothèques d’animations JavaScript interminables, le panorama devant nous est vraiment spectaculaire ; des technologies permettent des animations de plus en plus intéressantes grâce à Canvas , SVG , CSS3 , WebGL … La dernière étape est l’unification des animations déclaratives et impératives via des API d’animation web qui fusionneraient les fonctionnalités de SVG et CSS .