【经验之谈】用户体验之如何设计网页链接打开方式

在绝大多数情况下，如果一个用户界面像希区柯克的小说一样充满悬疑色彩，那它很可能会是一个笑话。一个好的用户界面设计师应该让用户很容易猜到接下来会发生什么，而不是为他们去制造“惊喜”。

当我在网页中想点击一个链接时，往往会犹豫，因为有时候我不想离开现在这个页面而打开一个新的标签页或者一个新的窗口。于是我每当我要在网页中点开一个链接时，我都会右键，选择打开新标签或者新窗口或者使用快捷键（按住Command点击链接, Windows用户按住Ctrl点击链接）。如此，我终于感觉我在界面中有点存在感了，但对我来说，我还是感觉这种方法过于粗暴了。

我们需要一个说明icon，当光标移至一个链接上的时候可以告诉用户这个链接（a）会在一个新的标签页打开，还是（b）一个新的窗口打开，或者是（c）当前页面打开。新窗口打开现在几乎很少见到了，但还是让我们把它视为一个选项。

猜猜我是a, b 还是c

先来做个小游戏，看看你能不能不借助以下文字说明，一眼就可以识别三个icon分别代表a,b，c哪一项？

公布答案，最左边的icon表示链接会打开一个新标签页，中间那个表示在新窗口打开，最右则表示会在当前页面打开。让我来解释一下最右边那个icon，大家可以注意下，前两个icon都有一个明显的箭头，而这个却唯独没有。事实上中间那个圆点就是那个箭头，只不过它正对着你，那它所表达的意思也显而易见了。

以下是三个icon的一些改版：

改版一

接下来我加强简化了三个icon，以圆形，三角形和正方形来分别表示当前页面，新标签和新窗口。

改版二：简化后的三个icon

那接下来的问题就是在哪里去放置这些icon呢？大家可以一起来想一下。在否定了一开始的几个想法后，我有了一个自觉不错的主意。当用户把光标移至链接上时，提示icon会出现，告诉用户这个链接会以何种方式打开。不仅如此，如果把光标移至提示icon上时，另外两个icon也会随之出现，提供给用户更多的链接打开方式，请看以下gif。

想法

我正在做一个与此相关的Chrome插件，并且已经放到GitHub上了。不知道你们是否和我一样，觉得这是一个值得探讨的问题，我很想听听你们的想法，欢迎在评论区留言。

感谢阅读！