f for.快速地。这就是用户读取贵重内容的方式。在几秒钟内,他们的眼睛在网站上的令人惊叹的速度下,以你在学校所学到的那种模式中的模式中的速度。

在我们的新东西中眼镜学习,我们录制了232名用户如何看待数千个网页。我们发现用户的主要阅读行为在许多不同的网站和任务中相当一致。这主导阅读模式看起来有点像F并有以下三个组件:

  • 用户首先阅读水平运动,通常跨越内容区域的上半部分。该初始元素形成F的顶部栏。
  • 接下来,用户向下移动页面,然后在A中读取第二个水平运动通常覆盖比以前的运动更短的区域。该附加元件形成F的下层。
  • 最后,用户扫描内容的左侧垂直运动。有时这是一个相当缓慢和系统的扫描,看起来是眼镜热图上的坚固条纹。其他次用户移动更快,创建Spottier Heatmap。最后一个元素形成f的茎。

显然,用户的扫描模式并不总是由三个部分组成。有时,用户将读过内容的第三部分,使模式看起来更像是一个e而不是f。其他时候他们只会读一次,使模式看起来像倒立的l(顶部的横梁)。然而,通常,读取图案大致类似于F,尽管顶部和下巴之间的距离变化。

eyetacking Heatmapapap,具有3个不同的F-Templic示例,用于读网页
来自三个网站的用户眼镜研究的热量。用户看起来最多的区域是彩色的;黄色区域表示较少的视图,其次是最小的蓝色区域。灰色区域没有吸引任何固定。

上面的热量表显示了用户如何阅读三种不同类型的网页:

如果您眯着眼睛并专注于红色(最常见的)区域,所有三个热带都显示了预期的F图案。当然,存在一些差异。这F观察模式是粗糙,一般的形状而不是统一,像素完美的行为。

在电子商务页面(中示例)上,由于介入产品图像,F的第二横杆低于常用。用户还将显着的固定时间分配给找到的页面右上部分的框,其中找到了价格和“添加到购物车”按钮。

在SERP(正确的例子)上,F的第二横杆比顶部横杆长,主要是因为第二个标题比第一条更长。在这种情况下,两个头条新闻都被证明对用户同样有趣,尽管用户通常读取他们在页面上查看的第二个区域的较少。

F模式的含义

F模式对Web设计的影响是明确的,并显示了以下的重要性写作Web的指导方针而不是重新调整打印内容:

  • 用户不会彻底读取您的文本以字词逐个方式。详尽的阅读是罕见的,特别是当潜在客户正在进行初步研究以编制供应商的候选人的初步研究时。是的,有些人会阅读更多,但大多数人不会。
  • 前两个段落必须说明最重要的信息。有些希望用户实际上将读到这种材料,尽管他们可能会阅读比第二段更多的更多。
  • 以信息携带的单词启动副标题,段落和项目符号在其F行为的最终词干中扫描您内容的左侧时,用户会注意到。他们会比前两个单词更少地读取第三个词。

详细扫描行为

在页面上读取和扫描时,观看用户的眼睛运动的慢动作重放是令人着迷的。每个页面都在这里讨论的占优势F模式的读数问题。例如,当您正在寻找价格或其他数字时,用户扫描不同,更具指针的方式,并且有趣的热处理行为决定了用户如何看一下搜索引擎广告的列表。我们还有很多关于人们如何看待网站图像的结果。

内容可用性最大的决定因素是用户在线阅读的方式 - 而且因为人们读取了不同,你必须用不同的方式写入。

完整的报告

满的关于用户在网上阅读的eyetaching报告可用于下载。

另见:我们的11年后的新眼科研究确认了这些发现。