菜单 关闭

锚地好吗?在页面链接中重新评估

通过 艾米谢德5月7日,二千零一十七

总结:虽然跳转链接在过去造成了问题,它们可以成功地用于将用户向下移动到长页面并直接移动到内容,任何屏幕尺寸。


页面链接(也称为锚链跳转链接)是引导用户访问同一网页,而不是网站的另一页。过去,用户体验的建议是避免这些类型的链接。在过去几年的网页设计中,网页内链接的使用有所增加,manbetx官方网站手机版对这种设计元素的优缺点作一个更深入的评价是值得的。manbetx官方网站手机版

为什么页面中的链接令人困惑

正如我们过去讨论过的那样,页面内链接最大的可用性相关问题是不满足用户的要求心智模型对于链接.通常情况下,链接指向另一页。当这种期望没有得到满足时,用户可能会迷失方向。

为什么页面内的链接有用

这个可用性问题可以通过页面内链接的可用性相关好处来平衡。页面内链接通常用于帮助用户浏览页面内容.链接到页面下方的信息可以:

  • 作为目录,帮助用户形成页面的心理模型
  • 提供直接存取到感兴趣的内容
  • 提高需要长时间滚动才能发现的内容的可发现性和参与度

页内链接的常见用法

页面内链接有三种常见用法:

  • 目录:在页面中,链接可以用作较长内容的目录,允许用户直接访问感兴趣的内容。
  • 回到顶部:返回顶部链接将用户从页面的另一部分引导到页面顶部。虽然这些链接复制了滚动条的功能,在长页面上,单击一次可以节省多个滚动的时间,这一点非常有用。这样的链接不会伤害不使用它们的用户(除非它们包含内容,即使这样,它们也不会造成巨大的问题)。帮助用户。
  • 索引和常见问题:字母或数字索引或列表常见问题可以从页面内链接中获益。页面顶部的链接列表可以节省用户浏览大量项目的工作量,或物品的屏幕,这对他们没用。当用户可能需要某个特定的内容时,这些链接非常有用,而不是从浏览所有选项中获益。
saks.com提供了一个字母索引,允许用户直接导航到设计师列表中的一个字母。manbetx官方网站手机版这里的a-z列表允许直接访问感兴趣的设计师。manbetx官方网站手机版

屏幕尺寸的影响

当我们最初写锚链接时,我们都在相似的屏幕上浏览网页。我们设计的不是微型移动屏manbetx官方网站手机版幕,中型平板电脑屏幕,或大,高分辨率桌面显示器。

当我们设计更多manbetx官方网站手机版多样的装置,每个都有自己的屏幕大小,这个使用跳转链接的好处随着屏幕大小的减小而增加.考虑一下你网站上的一页内容:几段文字可能会填满桌面上的一个屏幕,但是可以在移动设备上扩展到多个滚动页面。同样的内容,即使简短,只需在小屏幕上显示就可以大大扩展长度。

在一台13英寸的笔记本电脑上观看mayoclinic.org文章,可以在一页内显示4段文字和一段视频。在手机上查看的同一篇文章只显示两个段落。

如何在网页链接中负责任地使用

所以,如果我们知道页面中的链接会令人困惑,但是我们也知道他们可以帮助用户找到信息,尤其是在更长的时间里,滚动,移动页面,我们如何权衡使用它们的相对利弊?在实施它们时,我们需要记住哪些细节,以确保它们的好处大于缺点?

考虑内容长度

为了所有用途,只有当页面上的内容很长时,页面内链接才有用。任何冗长的内容都可以从添加中获益:页面越长,值越高。然而,我们知道用户不要在网上仔细阅读.他们略读内容。所以,在添加页面链接以使较长的内容更易于管理之前,首先考虑内容是否可以缩短,重新组织或重写。深思熟虑的编辑可以减少不必要的细节,缩短内容,可能会导致页面内链接不必要。

也考虑一页要显示多少信息.在一个页面上显示大量信息可以最大限度地减少用户的工作量,或交互成本,但只有当用户可能阅读完整的内容时,以其呈现的确切顺序。然而,如果页面包含4或5个相关页,但主题不同,最好将内容分成不同的页面,特别是如果任何给定的用户只可能阅读其中的一些主题。

最后要考虑的是每个单独内容部分的长度。一个包含许多内容的页面简短章节不需要太多的滚动工作。在这种情况下,添加页面链接可能是不必要的,甚至是有害的,因为这些链接本身,当出现在页面顶部时,添加到页面长度并向下推内容。

switch.which.co.uk:如果内容部分简短,每页上有多个节可见,不需要页面内链接。

使用清晰的链接和标题

长内容从多个章节结构和清晰的标题中获益,充当什么讨论内容的路标在页面的每个区域。将标题视为框架(或迷你IA)页面:用户可以通过滚动标题获得内容概述,如果这些标题清晰且对其所标注的文本具有描述性。

但是,用户可以滚动,也可以不滚动,尤其是当一个页面有许多内容部分时。用户有理由时滚动:他们评估页面是否可能包含他们需要的内容,如果他们认为页面可能存在,则滚动页面。只有当用户看到标题时,标题才有用。

在页面链接中帮助解决该问题。它们可以出现在页面顶部,充当页面的目录。因为链接出现在一起,用户通常不需要滚动查看其中的大部分,他们是比标题更有效显示页面内容时。

这个usa.gov页面顶部的链接清楚地标识了页面包含的内容。

页面链接中的标签

页面内链接需要与其他链接不同在页面上,这样用户就可以了解他们将领导的方向。这可以通过视觉指示或标签来完成,例如在这个页面上在这篇文章中.

本EPA.gov页面顶部的页面内链接标有在这个页面上 明确链接的功能。

最好使用标签,为了清晰和方便,仅仅依靠放置或视觉处理。屏幕阅读软件,向用户朗读网页文本,在阅读锚定链接时,经常添加单词“in page link”,以用户为导向。但是人们使用屏幕放大镜,一次将网站缩放到一个区域,没有此音频反馈。页面内链接列表可能与指向其他页面的链接列表相同。

使用屏幕阅读器或屏幕放大镜时缺少上下文与使用移动设备时缺少上下文类似。一个移动屏幕只能向用户显示一个小的视区到内容中,因此,小屏幕用户很容易丢失他们在页面上的位置以及他们正在查看的链接类型的上下文。

确认跳转

页面内链接的文本应与链接指向的页面标题匹配,到让用户放心它们已移动到页面上的相应内容。标题用作标识用户位置的路标。

当用户单击页面内链接时,相关内容应滚动到屏幕顶部,以便于用户尽可能多地阅读本节内容。然而,帮助用户确定自己的方向,并了解他们仍然在同一个网页上,在屏幕顶部显示一点前面的文本或少量空白。如果所选标题太靠近页面顶部,用户有时会忽略它。

如果您的页面有粘性元素(例如,导航,社交分享链接,广告)保持在页面顶部,确保它们不覆盖标题,强制用户滚动以查找感兴趣的内容或使用户失去方向感。

在一篇关于WebMD的文章中,网页内链接到是什么引起诺沃氏菌感染的? 指向顶部屏幕截图中的视图,标题和初始文本被粘性导航遮蔽的位置。第二个屏幕截图显示滚动页面以查看适当的内容。

注意页面上的最后一节内容。如果最后一段内容很短,并且页面上的链接或元素很少,它可能出现在页面的中间而不是顶部。如果可能的话,尽量确保最后一节的内容足够长。

考虑将页面内链接设置为粘性

在移动屏幕上,页面内链接应始终显示在内容的顶部。但是有了更大的屏幕,设计人员可以使用更多选项。manbetx官方网站手机版

目录可以出现在主内容左侧或右侧的列中。这些链接,放置在主要内容区域旁边,最初可能不太明显,因为用户关注的是网站的中心内容区域。如果用户滚动时这些链接保持在内容旁边,他们有保持可见的好处给用户。虽然页面顶部的静态目录最初可能对用户更为明显,当用户滚动页面时,它将很快从用户的视图中消失。

美国红十字会网站上的页面内链接会跟踪用户。

粘性链接集的优势取决于实现。如果页面在视觉上是干净的,几乎没有竞争用户的注意力,与页面上杂乱的图像和广告等图形元素相比,链接更容易被注意和使用。

页面内链接的另一个常见模式显示通常用于导航的区域中的链接。例如,页面内的链接可能显示为页面顶部的粘性导航。然而,我们建议不要这样做。页面内链接最大的可用性问题是它们破坏了用户对链接将要做什么的心理模型。将链接放在通常用于导航的区域会使这个问题变得更糟。用户希望导航能引导到新页面。

在“世界野生动物基金”页面的页面链接中,当用户滚动页面时,会显示为粘性导航。

粘性链接:显示用户的位置

如果页面内链接的列表将在用户滚动时保持不变,它应该显示用户的当前位置。例如,在上面的WWF示例中,当前部分(世界自然基金会正在做什么)在粘性页面导航栏中以略浅灰色标记。

这种类型的指示器用于定位页面上的用户,并且确实如此,在页面级别上,什么你在这里导航整个网站都有。

那呢?背部Button?

如果页面内链接导致用户访问同一页面内的内容,浏览器后退按钮应该做什么?将用户带到页面上的上一个位置,还是到以前查看过的页面?换言之,是否应返回撤消上一个操作?

这取决于用法:

  • 对于目录,索引或常见问题解答背部应充当“撤消”并将用户带到页面上的上一个位置。这种行为几乎允许用户忘记有两种类型的链接(页面链接和跨页面链接),并以相同的方式处理所有链接。
  • 用于返回顶部链接背部应将用户带到浏览器历史记录中的上一页。回到顶部更像是命令而不是链接。按下后,用户可能希望返回上一页,不在当前页的中间或结尾。

手风琴VS页面链接?

手风琴也可以用来实现目录,常见问题或索引。它们提供了页面的概述,并让用户直接控制在哪个内容上同时查看桌面可移动的.此设计模式允许manbetx官方网站手机版用户展开或折叠内容部分。当内容节关闭时,它们充当页面的目录。

在决定网页链接或手风琴时,考虑如何使用页面.如果人们可能按顺序阅读所有内容(就像他们阅读杂志文章或书籍章节一样)。重复打开手风琴将导致高交互成本。

有页面内链接,如果用户滚动,就可以看到页面的全部内容,以及在页面链接中充当增强:用户不必使用它们。另一方面,手风琴需要用户输入以显示内容。这意味着手风琴背后的内容不太容易被发现,也更容易被忽视——看不见的是思想。

相比之下,基于手风琴的目录的优点是,与使用页内链接实现的某些内容表相比,用户更容易看到它。如果页面内链接只出现在页面顶部,用户必须返回页面顶部才能导航到其他分区。(这不是在页面目录中有粘性的情况,不过)手风琴设计,manbetx官方网站手机版当用户滚动到一个公开内容的顶部或底部时,其他内容区域的链接立即可见。

所以,好还是坏?

如果页面内链接实现良好,如果在一页纸上写下冗长的内容是必要和有用的,这些链接可以帮助用户直接导航到感兴趣的内容并改善用户体验。在衡量用户体验的页面内链接的好处时,实现的细节至关重要。如果有疑问,使用可用性测试来评估页面链接的有用性和必要性。度量和A/B测试还可以帮助验证它们是否提高了页面内容的可用性。