Day 07 · Skeleton Screen：内容加载时的占位幽灵

界面在加载，但用户还没走——骨架屏做的就是这件事：用和真实内容同形的灰色占位结构，让等待本身变得有意义。

Skeleton Screen（骨架屏）是 Loading Spinner 的进化版本。Spinner 只告诉用户「系统在转」，骨架屏进一步告诉用户「即将出现的是什么形状的内容」。两者都在等，感受却截然不同。

三者最常被混用，核心区别只有一句话：

适合 Skeleton Screen 的场景，是那些你知道要加载的是「一组卡片」「一个列表」还是「一篇文章」——内容形态可预知，骨架才能和真实内容匹配上，加载完成瞬间才不会「跳」。

参考规范：Material Design · Skeleton screens

不是所有内容都用同一套骨架，根据真实内容结构来：

骨架的结构越接近真实内容，加载完成时的视觉「接力」就越顺滑。

判断口诀：能量化 → Progress Bar，不能量化 → Spinner，加载内容列表 → Skeleton Screen

参考规范：Apple HIG · Loading | Ant Design · Skeleton

交互反馈类 7 个组件，今天讲完了最后一个。明天起换表单组件类：Input、Checkbox、Toggle……那一块的「边界感」问题其实更多。