Les écrans squelettes remplissent une fonction similaire aux filateurs et autres animations de chargement: un repère visuel que l'utilisateur doit attendre un peu de contenu pour charger. Contrairement aux filateurs, cependant, les écrans squelettes créent une illusion de progrès.
- Quand ne devriez-vous pas utiliser le chargement du squelette?
- Pourquoi utiliser le chargement du squelette?
- Qu'est-ce qu'un chargeur de spinner?
- Comment implémenter le chargement du squelette?
Quand ne devriez-vous pas utiliser le chargement du squelette?
Un chargeur squelette ne doit pas être utilisé en combinaison avec un spinner, choisissez celui qui correspond le mieux au cas d'utilisation.
Pourquoi utiliser le chargement du squelette?
Un écran squelette est un espace réservé animé qui simule la disposition d'un site Web pendant que les données sont chargées. Ils ont fait savoir à l'utilisateur qu'un contenu se charge et, plus important encore, fournit une indication de ce qui se charge, qu'il s'agisse d'une image, d'un texte, d'une carte, etc.
Qu'est-ce qu'un chargeur de spinner?
Un spinner de chargement est généralement un élément de marque avec une animation en boucle qui indique que le chargement est en cours et où il apparaîtra. Évitez de montrer plusieurs filateurs de chargement sur une seule page.
Comment implémenter le chargement du squelette?
Créer un nouvel index de fichiers. HTML et écrivez du HTML pour la disposition à l'intérieur d'un parent <div> avec class = ”Profile-Container". Ajouter une classe = "squelette" à chaque élément afin d'appliquer l'effet de chargement d'écran du squelette. Vous supprimerez cette classe lorsque le contenu est chargé à l'aide de JavaScript.