Le chargement en web design, exemples et tutoriels

07/03/2014

Webdesign

Pour terminer cette semaine, nous vous proposons un petit article qui fait le tour des chargements ou niveau des web design avec une sélection d'exemples et de tutoriels à découvrir dans la suite de l'article.

Un petit retour sur le chargement

Il y a quelques années, nous avions l'habitude de voir des chargements originaux avec la plupart des sites réalisés en Flash. On trouvait beaucoup de diversités dans les systèmes de navigation et dans les animations, puis on avait la patience d'attendre le chargement de tout le site. Au fil du temps les sites en Flash ont commencé à se faire de moins en moins nombreux et les sites en HTML/CSS, en grande majorité n'avait plus besoin de chargement.

Aujourd'hui la tendance change et on voit apparaître de plus en plus de site en HTML5 et CSS3 qui demandent une étape de chargement. Cela provient des derniers effets comme le parrallaxe ou les sites en scroll dynamique qui demandent beaucoup d'éléments à charger au même moment.

Pour les nostalgiques voici un petit article sur les chargements en flash, certains exemples ne doivent plus fonctionner : "33 Amazing Examples of Flash Preloaders"

Des exemples et tutoriels

Dans une première partie, nous avons choisi quelques exemples afin d'illustrer des chargements qui ont attiré notre attention par leur design et leur originalité. Dans une seconde partie vous pourrez découvrir une petite sélection de tutoriels afin de vous faciliter le travail pour vos projets. Bonne découverte à tous.

Anorak Moncler

SNCF – Défi Ingénieur

Volkswagen | Sports Cars

Dunlop Winter Maxx

Fremtidenshoder.no

Yours

Make Your Money Matter

Heart of the Arctic

Cyclemon

Il était une forêt – l'Expédition

Une petite sélection de tutoriels

Pour compléter notre article, nous vous proposons une série de tutoriels autour du chargement et loading afin de vous aider pour vos prochains projets. Vous trouverez divers liens avec des ressources, des générateurs ou des articles plus techniques.