怎样让网页页面可读性更强?善用F式合理布局设

2021-03-16 13:45 admin

  尽管网页页面排版方法千姿百态,可是合理布局方法一般都遵照着几种普遍的标准。在众多合理布局方法之中,F式合理布局是能用性较强,且可用范畴较广的1种。今日的文章内容同你来讨论F式合理布局在网页页面中的应用。

  F式合理布局的设计方案基本是客户环顾內容的情况下,完成的健身运动运动轨迹和字母F类似,而合理布局配对这类这类阅读文章方法可让客户更快(Fast)地获得信息内容,因而得名为F式合理布局。

  F式合理布局从何而来?

  F式合理布局源于NNGroup的1项眼动科学研究新项目,她们追踪了超出200名客户访问各种各样网页页面时的眼动运动轨迹,发现客户的目光迅速访问网页页面时,特别是在迅速访问文本內容的情况下,目光的健身运动运动轨迹相近字母F,而且全部健身运动全过程遵照下面3个一部分:

  ·客户先会沿着水平方位访问,优先选择访问內容块的上部,这个情况下的眼动组成了字母F 最上面1横。

  ·接下来视野会沿着显示屏左边向下竖直环顾,找寻段落中能引发兴趣爱好点的內容,当她们发现引发她们兴趣爱好的內容之时,再次横向细心访问,而一般这些內容对应的视野范畴会比第1次横向访问的范围要更小1些,而这个视野运动轨迹则组成了字母F 正中间的1横。

  ·接下来客户会将视野移到显示屏左边,再次向下访问。

  大家访问內容的方法被训炼为从左上角刚开始水平访问,返回左边向下环顾寻找兴趣爱好点,再次横向访问。

  NNGrou的眼动追踪科学研究证实了这1点,鲜红色的一部分是客户感兴趣爱好的地区,黄色的地区次之,不感兴趣爱好的则为蓝色的地区,灰色的地区是客户立即忽视不作滞留的一部分。

  明显,客户的访问全过程其实不都是分成3个一部分,可是它的方式是延用下来的。

  为什么要应用F式合理布局?

  F式合理布局能让你造就出更为颇具层级感的设计方案,这样的设计方案更非常容易为客户访问和获得信息内容。针对全球范畴内绝大部分的我国和地域而言,F式合理布局是是非非常合乎阅读文章习惯性的。这类标准使得它能够普遍应用在UI和网页页面设计方案上。

  何时应用F式合理布局?

  诸如新闻和blog这类重文字內容的网站是合适F式合理布局的,它关键可用于文字的阅读文章。

  CNN 便是应用F式合理布局的

  怎样应用F式合理布局?

  F式合理布局让设计方案师可以更好操纵內容的可见性。

  1、明确內容的优先选择级

  假如你针对网页页面中內容的轻重缓急拥有充足的掌握,那末便可以融合客户的访问习惯性,将关键的內容排布在客户视野经常滞留的部位。让这些展现关键內容的“网络热点地区”承载关键的互动。

  2、设定原始预期

  文字的前几段內容是是非非常之关键的。尽可能让最关键、最关键的內容置放在网页页面的顶端,这也是为何题目、前言和导航栏栏是这般的关键的缘故。

  客户可以在几秒钟以内迅速载入內容。

  3、为速读而设计方案

  客户一般不容易1个字1个词地阅读文章文章内容,而是根据意群来获得內容,因此,你必须将将会包括客户感兴趣爱好內容的意群依照F式合理布局来排布,这样能够尽量高效率地展现內容:

  ·段落以新鮮趣味、重要关键的语汇开始。

  ·客户会优先选择查询优先选择级最高的元素(也便是视觉效果净重最重的地区)。因而,在文字为主的网站中,你应当突显文字自身的关键性(例如重要词),而且依靠配色等元素,强化按钮等涉及到重要互动的元素的存在感。

  ·每一个段落阐述1件事儿,并尽可能有对于性地阐述。

  ·将最关键的元素(诸如CTA按钮等)置于最左边或最右边,也便是客户阅读文章的起止一部分。这个情况下,客户一般会有阅读文章的间断,而这个時刻可让她们有附加的時间来考虑到而且挑选下1步的互动。

  4、善用侧面栏

  侧面栏一般能够协助客户深层次到下1个等级,客户的互动也更为的深层次:

  ·出示客户要想看到的內容,而并不是广告宣传、有关文章内容和小控制这样的物品。

  ·将它设计方案变成客户寻找特殊內容的专用工具。最多见的设计方案是文件目录目录,标识云和“数最多点一下”文章内容目录。

  5、防止无聊的合理布局

  F式合理布局最大的难题是它会让全部网页页面看起来较为无聊。类似而反复的內容出現在全部网页页面的不一样部位,客户极可能在类似的合理布局中迅速觉得疲惫。因此,你必须造就1些和摆脱难堪布局的元素,让客户持续调剂留意力,不断的阅读文章。

  结语

  自然,F式合理布局是遵照人类访问信息内容的发展趋势和习惯性的,它能帮你提升合理布局与构造,你其实不1定非得这么用。趣味的设计方案和优良的可读性同样关键,有的情况下兼具二者其实不难。