菜单 关闭

网络阅读的F型模式:误会,但仍然相关(即使在移动设备上)

通过 卡拉佩尼斯11月12日,二千零一十七

总结:眼球跟踪研究显示,人们以不同的模式扫描网页和手机屏幕,其中一个是字母F的形状。在发现这种模式11年后,我们重温今天的意义。


在NN/G对UX世界的贡献中,万博官网manbetx下载也许引用最多的是F型阅读模式对于Web内容,我们在2006年发现的。这些年来,很多人提到了这项研究,有时是正确的,在许多其他情况下,误解了它。在本文中,我们的目的是报告最近的研究,重新审视它,并澄清一些与F-模式有关的误解。特别地:

  1. 在网上扫描并不总是呈F形。还有其他常见的扫描模式。
  2. F模式对用户和企业都是负面的。
  3. 好的设计可manbetx官方网站手机版以防止F型扫描。
这是我们在2000年代早期研究的第一个F-模式的例子。这股热浪聚集了45多人的目光,他们试图了解1900年在德州加尔维斯顿发生的事情。顶端,heatmap(用红色表示)的大部分阅读部分类似于大写字母“f”。

F形图案

在F型扫描模式中,许多固定点集中在页面的顶部和左侧。明确地:

  1. 用户首先在水平移动,通常在内容区域的上部。这个初始元素构成了F的顶栏。
  2. 下一步,用户将页面向下移动一点,然后在第二水平通常覆盖比上一个移动短的区域的移动。这个附加的元素形成了F的下条。
  3. 最后,用户扫描内容的左侧垂直运动.有时这是一种缓慢而系统的扫描,在眼睛跟踪热图上显示为一条实条纹。其他时候,用户移动更快,创造出一个更具斑点的热图。最后一个元素形成了F的茎。

这种模式的含义是:

  • 第一行一页上的文本比同一页上的后续文本行接收更多的注目。
  • 前几句话在每行文本的左侧,收到的固定内容比同一行的后续单词多。

因此,在文本的第一行,人们会扫描更多的单词在右边,而不是在下面的行。这种扫描模式相似字母F的形状,但它很少是很完美f.例如,在某些情况下,人们可能会对这一页下面的一个段落感兴趣,可能会关注更多的单词,再往右边看,所以这个图案看起来像一个E。

F形图案适用于用户阅读内容区网页的。因此,它描述人们访问网页并评估其内容时的行为,当他们在网站的一个新的部分中并检查导航栏(通常在页面的顶部和/或左侧)来决定下一步要去哪里时,他们的行为就不是这样了。所以,在F模式中,凝视左边落在左边内容区的,不是在整页最左边的部分,如果左列被导航轨占用。

我们最近的眼睛跟踪研究表明扫描在当今世界,无论是在台式机上还是在移动设备上,这种模式都非常活跃。一个典型的例子用户体验发现的寿命万博官网manbetx下载这更多地取决于人类的行为而不是技术。

tigerincrisis.com:这是我们新研究的一个热点,收集了47个人的数据,他们试图了解有多少苏门答腊虎生活在野外。这个热天图上的红色是F形图案的一个例子——今天和11年前一样。

这种凝视回放显示了一个移动用户在研究人像相机镜头时,正在以F-模式进行扫描。红色的空心圆圈代表他固定的位置。(在大多数浏览器中,将鼠标悬停在视频上方以显示控件(如果控件尚不可见)。

另一个手机上的F模式的例子来自一个研究参与者,他使用http://bacnyc.org来学习Mikhail Baryshnikov在哪里学习舞蹈。文本列比屏幕宽,所以她在看书的时候横着刷卡。(在大多数浏览器中,将鼠标悬停在视频上方以显示控件(如果控件尚不可见)。

我们最近一轮的眼球跟踪研究也表明,在阿拉伯语等从右到左的语言中,人们以翻转的F形模式阅读(正如我们所预测的,但在这项研究之前没有见过)。

F模式以从右到左的语言进行镜像,比如阿拉伯语,如图所示,这是一个用户在一个阿拉伯语新闻网站上阅读一篇关于双向飞碟射击比赛的文章。(在大多数浏览器中,将鼠标悬停在视频上方以显示控件(如果控件尚不可见)。

F形图案不是唯一的扫描图案

除了F形图案外,还有许多其他可能的扫描模式,包括下列内容:

  • 层饼图案在眼睛扫描标题和副标题并跳过下面的正常文本时发生。这种行为的凝视图或热图将显示水平线,让人想起蛋糕,蛋糕和糖霜交替出现。
  • 斑点状包括跳过大块文本并像查找特定内容一样进行扫描,比如A链接数字,一个特定的词或一组具有独特形状的词(如地址或签名)。
  • 标记模式当鼠标滚动或手指滑动页面时,需要将眼睛集中在一个地方,就像一个舞者在旋转的时候固定在一个物体上保持平衡。标记在移动设备上比在桌面上发生得多。
  • 旁路模式当列表中的多行文本都以同一个单词开头时,如果有人故意跳过该行的第一个单词,则会发生此情况。
  • 承诺模式包括关注页面上的几乎所有内容。如果人们对内容有高度的动机和兴趣,他们将阅读一个段落甚至整页的所有文本。(别指望这种事经常发生,不过。假设大多数用户将进行扫描。)

为什么人们会以F形模式扫描

当所有这3个元素都存在时,人们会以F形扫描:

  1. 页面或页面的某一部分包含的文本很少或没有用于Web的格式。例如,它有一个“文本墙”,但没有加粗,子弹,或副标题。
  2. 用户正试图在该页面上实现最高效率。
  3. 用户没有那么投入或感兴趣,所以他不愿意读每一个字。

最后两个基本要素概括了所有的网络行为:绝大多数的网络用户宁愿以最小的工作量尽可能快地完成他们的任务;他们访问一个页面是因为他们想找到一个快速的答案,而不是读一篇关于这个主题的论文并自学。

当作者和设计师没有采取任何措施将用manbetx官方网站手机版户引向最相关的用户时,有趣的,或者有用的信息,然后,用户将找到自己的路径。在没有任何引导眼睛的信号的情况下,他们会选择最省力的方式,并且会把大部分的注意力放在他们开始阅读的地方(这通常是一页文本中最左上角的单词)。并不是说人们总是以F的形式扫描页面。尽管多年的阅读可能训练人们认为更重要的内容比不重要的内容重要,没有用户真正感觉到内容已经被安排好,所以最重要的事情出现在一个F形。当没有强有力的线索来吸引人们注意有意义的信息时,F模式是默认模式。

人们倾向于最小化交互成本最大化他们从工作中获得的利益。为了他们的眼睛,这意味着花费很少的固定装置,同时仍在收集他们需要的信息;富有成效,已订婚的,成功地从这些固定装置中获得了什么。节约时间意味着更少的固定——看更少的单词。

在某些情况下,人们在浏览文本时会感到无聊或疲劳。其他时间,他们读到的词只提供了一个弱者信息线索,这可能足以满足继续扫描的需要,但不足以阅读更多的文本。

F形不利于用户和企业

当人们以F形扫描时,他们只根据文本在列中的流动方式错过大量的内容。跳过的短语和单词通常和那些阅读的单词一样重要,甚至更重要。但用户不会意识到这一点,因为根据定义,他们不知道自己看不到什么。

历史杂志研究参与者的F形注视情节,当她扫描一页包含大量散文和很少的格式(每个蓝点表示一个固定。点之间的线表示用户移动眼睛的扫视,实际上是盲人。这些线条帮助我们更容易地遵循固定。较大的点代表较长的固定,数字表示顺序。)

响应设计manbetx官方网站手机版,或任何液体文本布局就这点而言,根据窗口大小,文本流动方式不同。所以,一个在手机上扫描F形图像的用户,例如,如果他在桌面上扫描同一个页面,就不会固定在同一个词上——这仅仅是因为内容以不同的视区大小流动。

别犯错,F形扫描模式对用户和企业都不好:这意味着用户可以跳过重要内容,因为它出现在页面的右侧。良好的网页格式可以减少f扫描的影响。如果你的页面有大块未格式化的文本,人们会把它扫描成F形。

如果以F模式扫描对用户不利,为什么他们经常这样做以致于他们在网络上的主导行为?因为从他们的访问中获得最大利益的能力来看,这真的是“不好的”你的网站。然而,用户不希望从单个网站获得最大利益。他们的目标是通过使用整体网络.与整个互联网相比,你的网站就像沙滩上的一粒沙子。建造一座漂亮的沙堡——用这个比喻来形容——你不能浪费时间去寻找特别光滑的沙粒。你得用桶把沙子舀起来。同样地,用户通过浏览多个网站并在每个网站上花费很少的精力,从网络中获得价值,经常使用页面停车使许多站点同时打开。

F形图案的最佳解毒剂

为用户做这些工作,而不是强迫他们付出努力,走不好的捷径。排定文本的优先级和格式,以将用户引导到您希望他们看到的内容,你知道他们想看到什么。一些简单的提示:

  1. 包括最多的前两段的要点在页面上。
  2. 使用标题以及副标题。确保它们看起来更重要,更明显的是,比普通文本更容易区分。
  3. 以包含最多信息的单词开头标题和副标题:如果用户只看到前2个字,他们仍然应该了解下一节的要点。
  4. 可视地将少量相关内容分组-例如,用边框或不同的背景包围它们。
  5. 大胆的重要词汇和短语。
  6. 利用不同的链接格式,并确保链接包括含有信息的单词(而不是一般的“go”,“单击此处”或“更多”)。这项技术也提高了可达性对于听到链接的用户,大声朗读而不是以视觉方式扫描内容。
  7. 使用项目符号和数字在列表或过程。
  8. 切割 不必要的内容.

总结

在网络上扫描由以下因素决定:

很难控制人们的动机或目标,但您可以优化内容和演示文稿,以便用户快速找到他们需要的内容。特别地,使用良好的网络格式技术来吸引人们对最重要的信息的注意,而不是依赖于人们在以F形扫描时可能关注的任意单词。

有关F形图案和其他扫描图案的详细信息,看我们的: