Skeleton Screens 101

A skeleton screen is used as a placeholder while users wait for a page to load. This progress indicator is used for full page loads and reduces the perception of a long loading time by providing clues on how the page will ultimately look like.


This content originally appeared on NN/g latest articles and announcements and was authored by Samhita Tankala

Summary: A skeleton screen is used as a placeholder while users wait for a page to load. This progress indicator is used for full page loads and reduces the perception of a long loading time by providing clues on how the page will ultimately look like.



A skeleton screen is a design pattern used to indicate that a page is loading while providing users with a wireframe -like visual that mimics the layout of the page. This specific type of progress indicator is used exclusively for full-page loads.

What Are the Different Types of Skeleton Screens?

There are 3 main types of skeleton screens:

These are the most common skeleton screens and look like wireframes, in which the light gray boxes represent content and images. The structure of the gray boxes mimics the structure of the final page with content. The skeleton screen helps users build a mental model of what will be on the page and even gives some clues as to the underlying information hierarchy.



Read Full Article


This content originally appeared on NN/g latest articles and announcements and was authored by Samhita Tankala


Print Share Comment Cite Upload Translate Updates
APA

Samhita Tankala | Sciencx (2023-06-04T16:00:00+00:00) Skeleton Screens 101. Retrieved from https://www.scien.cx/2023/06/04/skeleton-screens-101/

MLA
" » Skeleton Screens 101." Samhita Tankala | Sciencx - Sunday June 4, 2023, https://www.scien.cx/2023/06/04/skeleton-screens-101/
HARVARD
Samhita Tankala | Sciencx Sunday June 4, 2023 » Skeleton Screens 101., viewed ,<https://www.scien.cx/2023/06/04/skeleton-screens-101/>
VANCOUVER
Samhita Tankala | Sciencx - » Skeleton Screens 101. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2023/06/04/skeleton-screens-101/
CHICAGO
" » Skeleton Screens 101." Samhita Tankala | Sciencx - Accessed . https://www.scien.cx/2023/06/04/skeleton-screens-101/
IEEE
" » Skeleton Screens 101." Samhita Tankala | Sciencx [Online]. Available: https://www.scien.cx/2023/06/04/skeleton-screens-101/. [Accessed: ]
rf:citation
» Skeleton Screens 101 | Samhita Tankala | Sciencx | https://www.scien.cx/2023/06/04/skeleton-screens-101/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.