F式布局是什么?如何合理的利用它
发布时间:2018-10-09
·接下来用户会将视线移到屏幕左侧,继续向下浏览。
我们浏览内容的方式被训练为从左上角开始水平浏览,回到左侧向下扫视找到兴趣点,继续横向浏览。
NNGroup 的眼动跟踪研究证明了这一点,红色的部分是用户感兴趣的区域,黄色的区域次之,不感兴趣的则为蓝色的区域,灰色的区域是用户直接忽略不作停留的部分。
显然,用户的浏览过程并不全是分为三个部分,但是它的模式是沿用下来的。
为何要使用F式布局?
F式布局能让你创造出更加富有层次感的设计,这样的设计更容易为用户浏览和获取信息。对于世界范围内绝大多数的国家和地区而言,F式布局是非常符合阅读习惯的。这种规则使得它可以广泛运用在UI和网页设计上。
什么时候使用F式布局?
诸如新闻和博客这种重文本内容的网站是适合F式布局的,它主要适用于文本的阅读。
CNN 就是使用F式布局的
如何运用F式布局?
F式布局让设计师能够更好控制内容的可见性。
1、确定内容的优先级
如果你对于页面中内容的轻重缓急有着足够的了解,那么就可以结合用户的浏览习惯,将重要的内容排布在用户视线时常停留的位置。让这些呈现重要内容的“热点区域”承载核心的交互。
2、设置初始预期
文本的前几段内容是非常之重要的。尽量让核心、重点的内容放置在页面的顶端,这也是为什么标题、引言和导航栏是如此的重要的原因。
用户能够在几秒钟之内快速读取内容。
3、为速读而设计
用户通常不会一个字一个词地阅读文章,而是通过意群来获取内容,所以,你需要将可能包含用户感兴趣内容的意群按照F式布局来排布,这样可以尽可能高效地呈现内容:
·段落以新鲜有趣、关键核心的词汇开头。
·用户会优先查看优先级高的元素(也就是视觉重量重的区域)。因此,在文本为主的网站中,你应该突出文本本身的重要性(比如关键词),并且借助配色等元素,强化按钮等涉及关键交互的元素的存在感。
·每个段落陈述一件事情,并尽量有针对性地陈述。
·将重要的元素(诸如CTA按钮等)置于左侧或者右侧,也就是用户阅读的起始部分。这个时候,用户通常会有阅读的停顿,而这个时刻可以让他们有额外的时间来考虑并且选择下一步的交互。
4、善用侧边栏
侧边栏通常可以帮助用户深入到下一个层级,用户的交互也更加的深入:
·提供用户想要看到的内容,而不是广告、相关文章和小控件这样的东西。
·将它设计成为用户找到特定内容的工具。常见的设计是目录列表,标签云和“多点击”文章列表。
5、避免无聊的布局
F式布局大的问题是它会让整个页面看起来比较无聊。相似而重复的内容出现在整个页面的不同位置,用户很可能在相似的布局中快速感到疲倦。所以,你需要创造一些和打破尴尬格局的元素,让用户不断调整注意力,持续的阅读。
后大连网站建设新图闻科技小编总结:当然,F式布局是遵循人类浏览信息的趋势和习惯的,它能帮你优化布局与结构,你并不一定非得这么用。有趣的设计和良好的可读性同等重要,有的时候兼顾两者并不难。
多年互联网服务经验
大连网站制作团队
中小型企业互联网供应商
服务行业领域超过70个
品牌传播与互联网技术并重
网站建设、品牌推广品牌公司:大连新图闻科技有限公司是一家互联网服务提供商, 企业网络服务品牌,也是企业邮箱品牌“盈世”的大连地区代理商。公司成立于2007年, 致力于为企事业单位及个人提供互联网解决方案。公司服务项目包括网站建设、网络营销推广、 宣传册设计、商业摄影、企业邮箱等,帮助客户高速应用互联网技术,提高企业综合竞争能力。

咨询热线:186-0984-0880

市场部 : 8001@newtwowin.com 业务联系,业务需求请发到此邮箱.

QQ咨询: 94091176

客服部:xxz@newtwowin.com

地址:大连市沙河口区西安路罗斯福B座3109
在我们的对手消耗大量的时间停留在碎片化的互联网设计或者程序实现的时候,我们已经开始把数 字化品牌建设和网络传播进行了整合。只有通过整体的互联网品牌分析,帮助客户进行互联网品牌 建设,并传播企业品牌,并围绕品牌树立品牌价值,提升企业与用户的互相交流,与用户品牌交互,让 用户能找对的方法去解决问题。传播品牌,激起消费者品牌意识,在这过程中创造价值,这是我们成 功的秘诀,也是我们帮助用户成功的诀窍,更是成就好的品牌的一条直达线。