在加载实际内容时显示内容形状的网页设计模式的名称是什么?

平面设计 网站设计 术语
2022-01-05 04:03:41

单页应用程序 (SPA) 站点在加载其内容之前加载和显示站点布局是很常见的。最近,我注意到,许多这些网站不仅显示等待微调器或“正在加载...”消息,还显示了内容将填充的模板/布局,文本和图像填充了平面几何图形形状。

来自 Slack 的示例

这似乎是一个很好的模式,因为它比将一小行等待文本替换为一大堆消息或其他内容更不刺耳。我想阅读该模式,也许在我的网站上找到一个更容易做到这一点的库,但我不知道该怎么称呼它,而且我什至无法简洁地描述它以有效地搜索网络. 我能找到的最接近的例子是这篇旧文章,它没有给这种做法起一个特定的名称。

“占位符”是我能想到的第一件事,但当然<input>标签现在具有实际placeholdler属性,并且很多人询问填充文本或其他内容(Lorem Ipsum、Kitten Ipsum 等),因此结果往往没有帮助. 我希望业界已经就这种做法达成了一个独特的、描述性的名称,但我还没有找到它。

4个回答

我想到的第一件事是,您的示例中显示的类型建议肯定被称为greeking

搜索“加载屏幕中使用的 greeking”让我找到了多篇关于这种 UX 技术的文章,特别是这篇将概念称为内容占位符的文章。

和我想的一样好。

所以特别是在这里你有希腊图像占位符,整个事情可以被称为内容占位符。

这个神奇的词似乎是希腊语(谢谢!),但这帮助我找到了术语“骨架屏幕”,它看起来是指布置模拟内容以获得应用程序的一般形状的非常具体的做法。我猜这个理论是它可以减少对加载时间的焦虑

您的一些开发者朋友可能会将其称为Facebook 的微光效果,因为 Facebook 推广了带有轻微微光效果的内容占位符技术,并开源了他们的代码

微光效果的要点是表明实际内容仍在加载中,让用户不会认为页面卡住并刷新。

在此处输入图像描述

当我使用这种模式时,我们称它为骨架页面。对于生成动态内容的大页面非常有用。