“…”图标的起源

“…”图标在文本中很常见——这三个不起眼的点代表着更深层次的选项。你有没有想过这个图标的起源，以及为什么三个点代表“更多”？

省略号的起源可以追溯到古代的手稿。在古代手稿中，抄写员常常使用不同的符号来表示文本的省略。例如，在希腊语和拉丁语的手稿中，有时会使用一组点或者特殊符号来表示省略或不必要的重复。随着印刷术的出现，省略号作为一种标点符号逐渐发展起来。在早期印刷书籍中，省略号的形式和使用并不统一，印刷工匠根据文本需要使用一系列点、破折号或其他符号来表示省略部分。现代省略号的标准化出现在19世纪到20世纪之间。英语中，省略号通常由三个连续的点（...）组成，而中文省略号则由六个点（……）组成，表示语句或思维的省略或未完结。

如今的在线内容采用了同样的原则。在博客和文章中显示省略号，提示“需要阅读更多”。就像书面省略号一样，三个点在视觉上传达出“附加文本”的含义。这牢固地确立了省略号暗示延续或扩展的地位。因此，当 GUI 图标出现以压缩菜单和选项时，使用三个点表示“更多”具有自然的吸引力。它提供了即时的熟悉感，已经与显示更多内容相关联。

为什么“…”图标在现代界面设计中如此重要

乍一看，它们似乎很简单——只有三个点。但这个不起眼的图标在紧凑的形式中隐藏着巨大的实用性。

“更多”图标意味着选项更多，但又不会占用额外空间。它们充当导航指南，让用户放心的轻点一下，即可获得更多功能。通过遵循平台标准，它们可在各个应用之间实现即时识别。

仅需几个像素，“更多”图标就可促进灵活性和探索性。它们的简洁性通过优雅的克制赋予复杂性力量。规模虽小，但影响巨大。

随着我们的数字之旅不断展开，我们发现这些不起眼的“…”图标蕴藏着解锁无限可能性的钥匙。

为什么横向“…”图标占据主导地位

在设计界，人们总是在两种“更多”图标之间做出选择——水平和垂直。有趣的是，大多数平台和设计师都倾向于水平版本。为什么偏爱水平版本呢？水平版本看起来比垂直版本更具视觉吸引力吗？还是有更深层次的原因？令人惊讶的是，当涉及到方向联想和这些图标的选择时，人类心理学在影响我们的偏好方面发挥着重要作用。

横向图标在设计中的流行源于文化、心理和用户习惯等多种因素。当我们看到从左到右的运动（如横向图标的移动）时，会感到积极和进步。这是因为许多文化都是从左到右阅读，并且还有许多其他因素与我们从根本上联系在一起，我们的大脑将这个方向与前进联系起来。另一方面，向下的运动可能会让人感觉有点消极或结束。我们的大脑从上到下获取信息的习惯，通常用在我们以上下滚动来快速浏览网站和应用程序上的内容。

许多设计师和产品团队的成员更喜欢水平的“更多”图标，因为用户更熟悉它们，而且它们符合用户的期望。

相同的场景，选择很重要

想象一下一个数据密集的界面——一排排的文字和图标，各列在狭窄的边距中争抢空间，而这些边距本来就很宽敞。现在做一个微妙的变化：将“更多”图标从水平变为垂直。这似乎是一个很小的变化，但它的影响会波及整个界面，显著改变视觉感观。水平“更多”图标排列的图标组（图左）显得杂乱，而垂直“更多”图标排列的图标组（图右）则传达出一种精确的感觉。从水平到垂直的“更多”图标的转变明显减轻了视觉负担。这是用小改变产生大影响的艺术。

这是另一个视觉示例，在比较两个选项时，水平图标看起来更好。原因是最左侧的位置拖动图标看起来与垂直的更多图标非常相似，因此在视觉上它们可能会令人困惑。确定使用哪个图标取决于特定的上下文，并考虑每个图标与周围元素的对齐程度。水平图标与垂直的更多图标有更大的区别，在这种情况下更清晰。

最后一个示例，也是 Chrome 浏览器领域中值得注意的一个示例。在这里，设计师选择在菜单栏中使用垂直的“更多”图标。想象一下，同一个菜单带有一个水平的“更多”图标。它要么需要更多的水平空间，将内容拉长，要么如果被挤进相同的尺寸，就会产生拥挤感。值得注意的是，谷歌在其大多数应用中始终使用垂直的“更多”图标，这是一个明智的选择，正如这里所展示的那样。

弥合认知差距

设计师和用户对界面元素的感知不同。当用户扫描界面时，他们只会注意到元素明显存在的视觉部分。他们完全不了解相关的尺寸，例如 16x16 像素图标。用户根据图标在屏幕上的外观在脑海中塑造图标 — 水平的更多图标被视为水平矩形，而垂直的更多图标被视为垂直矩形。

因此，关键考虑因素不仅仅是元素在设计文件中占据的空间，还包括用户如何直观地处理和与其交互。垂直省略号图标通过使用垂直空间来创建更简洁的外观，但当界面在视觉上嘈杂时，可能会引起对可用空间和点击功能的担忧。

我们可以看看苹果 Mac OS 图标更新的例子。在之前的版本中，Mac OS 使用了一个简单的水平省略号图标。但在后来的操作系统更新中，更多图标被重新设计为带有圆形外线，清楚地指示更大的触摸目标。这表明设计师如何改进图标以传达可交互性以及视觉风格。

细微的设计选择同样影响用户体验。图标、文本大小、对齐方式 — 这些细微的决定看似微不足道，却共同影响着美观和可用性。细节很重要，所以要仔细考虑哪怕是细微的细节，对细节的关注可以创造出有凝聚力的设计。

关键点在于设计师需要考虑界面元素的视觉呈现和隐含的用户交互模型。设计师认为清晰易懂的内容，用户可能会有不同的看法。设计应以符合用户期望的方式传达可供性和可交互性。

在这个主题的最后，我想添加来自真实产品中的案例，即它们如何在界面设计中使用“更多”图标。

探索顶级数字产品如何利用“更多”图标

让我们看看一些领先的数字产品如何优雅地使用更多图标来增强其界面。

Slack 在其主要左侧导航栏中策略性地采用了水平“更多”图标，并在正在进行的对话中采用了垂直“更多”图标来执行其他操作。这种方法为“更多”图标建立了清晰的层次结构，区分了其主要和次要用例。

TickerTap 巧妙地在其底部导航中同时使用了垂直和水平“更多”图标，并赋予它们不同的用途。垂直“更多”图标专用于股票页面，简化了导航，而水平“更多”图标则作为主要导航工具。TickerTap 有效地为“更多”图标建立了层次区分，指定了其主要和次要功能。

浏览 YouTube 时，将鼠标悬停在视频缩略图上会显示一个垂直的“更多”图标，从而在左右两侧留出足够的空间。这种安排在标题和“更多”图标之间创造了一个视觉上令人愉悦的空白。想象一下，如果用一个水平的“更多”图标代替它，就会让外观更加拥挤。然而，在视频播放过程中，屏幕会显示一个水平图标，由于其水平表示，与其他分组操作（如喜欢、不喜欢、分享和下载）保持一致。

- END -