Skeleton Screen
スケルトン・スクリーン / 2013– / 技法 / 界面风格
加载时不出旋转图标，而是先把内容进入之前的空画面显示出来，再把信息一点点灌进去的做法。Luke Wroblewski 在2013年以自制应用 Polar 的反思为由，用这个名字介绍了它。它展示的不是让人等待这件事，而是事情正在推进。
加载过程中不出现旋转图标和进度条 / 正文和图片要落入的位置上，先放着同样尺寸的素面色块 / 内容到达之前版面就已确定，到达后元素也不移动 / 信息不是一次全出，而是按区域依次填满
辞典词条
- 适用场景
- 列表或时间线首次加载时，想去掉旋转图标以提升体感速度时；内容到达瞬间元素就错位的画面，想通过先确定位置和尺寸来修正时
- 字体
- 不放文字。标题和正文要进入的位置上，排入与真实行高和行长一致的素面色块。
- 版面
- 直接沿用正式画面的骨架。先把元素的位置和尺寸定下来，内容进来后也不移动。
- 材料
- 用与底色只差一级的无彩色块。圆角和尺寸都对齐实物，不增加颜色。
- 注意
- 如果排入的色块与实物尺寸不一致，内容到达的瞬间整个画面就会错位，比被它取代的旋转图标还要让人不安。
- 延伸阅读
- why the 2013 article attacked the spinner, and how it defines progress / what change in user reaction it reports for Polar / cases where the dimensions of the blank blocks do not match the actual content
相关词条
引用此条目
这部辞典就是用来被链接的。请取用适合你写作场合的那一种形式。
- Link
- https://indexstyle.org/zh/styles/skeleton-screen
- Markdown
- [Skeleton Screen — IndexStyle](https://indexstyle.org/zh/styles/skeleton-screen)
- HTML
- <a href="https://indexstyle.org/zh/styles/skeleton-screen">Skeleton Screen — IndexStyle</a>