Le chargement en web design, exemples et tutoriels
Vous souhaitez mettre votre solution en avant en haut de cet article ? Contactez-nous
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.
Ressources web pour gérer des chargements et loading facilement
CodePen – A Pen by Yane Frenski
Progress Button Styles
Load info – Gif generator
Tutoriel vidéo HTML-CSS : Loader Animé
SpinKit | Simple CSS Spinners
Creative CSS Loading Animations
Le Blog Du Webdesign booste l'inspiration des intégrateurs #12