广州总部电话:020-85564311
广州总部电话:020-85564311

广州网站建设-小程序商城开发-广州小程序开发-企业微信开发公司-网站建设高端品牌-优网科技

19年
互联网应用服务商
请输入搜索关键词
网页设计必须知道的首屏设计技巧
发布日期:2017-08-14 09:25:07
浏览次数:2358

      网站建设中网站首页充当着门面的作用,很多时候用户了解一家企业或者品牌就从首页开始,所以说首页的网页设计起着至关重要的作用,尤其是高端企业网站建设,从设计排版、模块设置到交互动效等等各部分都需要设计师认真考究,从行业、企业、品牌的特性出发,考虑目标人群的用户需求,综合方方面面更好地展示企业的形象,更能有效地向受众人群输出信息,起到品牌传播的作用。而网页设计中首屏的设计十分关键,让人眼前一亮的首屏设计能增强用户对品牌的好感和印象,今天优网科技设计师就为大家讲讲网页设计中有哪些技巧能让首屏设计给人眼前一亮的感觉。

1、使用惊艳的图片

网页设计必须知道的首屏设计技巧

      相当一部分的网页首屏是使用图片作为视觉传达的主体,而无论是选择图片、视频、动画还是其他的视觉化的元素,每个Banner或者说带有标题的内容区块好是带有漂亮、惊艳的视觉化元素作为支撑。当然,常用的还是图片。

      首图在首屏中的重要性无疑是巨大的,它不仅要漂亮,还要同网站内容深入地结合搭配起来。所以,它的设计还可以更加深入一些。单独的图片表现力是有限的,通过排版设计,将它同其他的元素结合起来使用会有不错的效果:

     ·文字与标题

     ·LOGO 和品牌标识

     ·按钮和行为召唤语句

     ·导航元素

     ·搜索框

      在进行排版设计的时候,应该注意几点:锐利搞分辨率的图片和标题文本之间应该保持良好的对比度;人们希望看到脸和表情,这会更容易传递情绪和感情;注意引导用户和网站首屏进行互动。

 

2、强化导航元素的运用

网页设计必须知道的首屏设计技巧

      在首屏当中,元素与元素之间是相互配合构成整体设计的,而导航是首屏当中无法忽略的一个重要组成部分,无论你喜欢的是完整展开的导航,还是为了干净的布局而将导航隐藏在汉堡菜单中,导航的设计应该和首屏的整体设计合而的。

      导航的目的是将用户引导到他们想去的不同页面,所以,推荐使用置顶悬浮式导航,这样用户不论浏览到页面哪个地方都能够轻松跳转。

      导航元素在首屏当中,和其他的元素组合使用的时候,它们会和其他的元素构成对比,还能形成层次感,而这种层次感的构建和整个设计方案息息相关,应该根据具体情况具体安排。

 

3、清晰的信息传达方式

网页设计必须知道的首屏设计技巧

     视觉传达是一项系统工程,单靠一张图片是不够的。所以,你需要系统的考虑整个首屏的信息传达:

    ·首屏是否告诉了用户可以做什么,或者用户能从中获得什么内容?

    ·首屏是否向用户传达了的、清晰的、易于理解的信息?

    ·首屏是否为用户提供了直观可交互的控件(按钮、输入框、跳转链接等)?

    ·用户能否从首屏跳转到下一个页面/步骤?

     这些问题能够帮你梳理出整个首屏的细节设计思路。

 

4、试试超大字体元素

网页设计必须知道的首屏设计技巧

     想要让首屏更加醒目,超大的字体总是有效的办法。即使文字内容很简单,当用户打开首屏的时候也会一眼就注意到它们,在阅读其他内容之前,只会注意这些内容。尽管字体和排版千变万化,但是在字体的选取和首屏设计上尽量遵循下面的的两个规则来进行:

     ·首页首屏上的展示性的内容采用更加引人注意的字体,和其他地方截然不同

     ·其他页面的正文和主要文本部分,选用统一的、简约耐看的字体,甚至整体排版框架也保持一致

 

5、遵循基本的阅读模式

网页设计必须知道的首屏设计技巧

      用户研究领域的先驱 Nielsen Norman Group 曾经针对这一用户行为进行了深入的研究,为设计师和可用性设计专家们提供了更好的素材和设计依据。

      简而言之,当人们访问某个网站的时候,尤其是初次访问网站的时候,他们通常不会特别仔细的查看所有的内容,而是快速的扫视,找到能够吸引他们注意力的信息,这些内容就是他们继续停留在这个网站上的理由。通过眼动测试和不同实验,他们发现访问者的视觉浏览模式,可以归结为几种典型的模式。设计师 Steven Bradley 在自己的文章中,总结了这三种常见的模式:古腾堡式,Z图模式和F图模式。

     古腾堡式:对于信息结构层次并不那么分明的网页,用户常常会使用古腾堡式的浏览模式,用户大范围扫视页面内容,整个视线路径是一个大号的Z,其中开始的两个视觉驻留点就在页头上。

     Z图模式也不难理解,用户从上到下,视线沿着Z字形来回扫视,用户会左右快速扫视,视线的起点首先是左上角,行跨顶部一栏到右上角,然后向下延伸。

     F图模式,或者说是F式布局,我们就更加熟悉了。在Nielsen Norman Group 的研究当中,这种阅读模式为典型:

    ·用户先会沿着水平方向浏览,优先浏览内容块的上部,这个时候的眼动构成了字母F 上面一横。

    ·接下来视线会沿着屏幕左侧向下垂直扫视,寻找段落中能引起兴趣点的内容,当他们发现引起他们兴趣的内容之时,继续横向仔细浏览,而通常这些内容对应的视线范围会比次横向浏览的范畴要更小一些,而这个视线轨迹则构成了字母F 中间的一横。

    ·接下来用户会将视线移到屏幕左侧,继续向下浏览。

    所以,将关键的元素置于用户的浏览路径上,让用户可以更轻松地消化信息,也能高效地执行交互。

 

6、引入可点击的元素

网页设计必须知道的首屏设计技巧

      你的网站首屏能够吸引用户去操作么?它是否包含有可点击的元素?

      想要引导用户,首屏几乎是完美的存在。在这里,你可以使用行为召唤按钮来引导用户点击跳转到特定的地方,可以用来吸引用户邮件订阅,但是无论如何,尽量让整个首屏集中执行特定的任务,而不要因为过多的可操作选项让用户分心。

      不知道想要在首屏当中包含哪些元素?选择你希望用户执行的操作,所有的元素都围绕着它来设计。

 

7、简单的图层设计

网页设计必须知道的首屏设计技巧

      想要将上面提及的技巧都融会贯通、呈现在你的网页首图当中?那么你需要让所有的元素高效、合理地整合在一起,用简单的几个分层,将它们收纳到一起。

      分层对象能够帮你搞定这个问题。在确定需要呈现哪些元素以及各个部分的功能之后,将不同功能的元素用不同的分层来承载。分层尽量简单,这样不仅更加易于控制,也是让设计更加专注于核心的视觉和功能。多尝试几次,找到真正高效的搭配,让用户打开首屏的时候真正被惊艳到。

 

      结语:首屏的网页设计往往处于整个设计流程当中靠前的位置,随后在设计其他子页面的时候,设计师难免会松懈。其实这些子页面和首屏是同样重要的,两者要协调统一,才能让用户打开网页的时候始终保持一致的体验。

优网科技,优秀企业首选的互联网供应服务商

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!

优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。


责任编辑:优网科技

版权所有:http://www.uweb.net.cn (优网科技) 转载请注明出处

网页设计必须知道的首屏设计技巧

日期:2017-08-14 09:25:07 发布人:优网科技

      网站建设中网站首页充当着门面的作用,很多时候用户了解一家企业或者品牌就从首页开始,所以说首页的网页设计起着至关重要的作用,尤其是高端企业网站建设,从设计排版、模块设置到交互动效等等各部分都需要设计师认真考究,从行业、企业、品牌的特性出发,考虑目标人群的用户需求,综合方方面面更好地展示企业的形象,更能有效地向受众人群输出信息,起到品牌传播的作用。而网页设计中首屏的设计十分关键,让人眼前一亮的首屏设计能增强用户对品牌的好感和印象,今天优网科技设计师就为大家讲讲网页设计中有哪些技巧能让首屏设计给人眼前一亮的感觉。

1、使用惊艳的图片

网页设计必须知道的首屏设计技巧

      相当一部分的网页首屏是使用图片作为视觉传达的主体,而无论是选择图片、视频、动画还是其他的视觉化的元素,每个Banner或者说带有标题的内容区块好是带有漂亮、惊艳的视觉化元素作为支撑。当然,常用的还是图片。

      首图在首屏中的重要性无疑是巨大的,它不仅要漂亮,还要同网站内容深入地结合搭配起来。所以,它的设计还可以更加深入一些。单独的图片表现力是有限的,通过排版设计,将它同其他的元素结合起来使用会有不错的效果:

     ·文字与标题

     ·LOGO 和品牌标识

     ·按钮和行为召唤语句

     ·导航元素

     ·搜索框

      在进行排版设计的时候,应该注意几点:锐利搞分辨率的图片和标题文本之间应该保持良好的对比度;人们希望看到脸和表情,这会更容易传递情绪和感情;注意引导用户和网站首屏进行互动。

 

2、强化导航元素的运用

网页设计必须知道的首屏设计技巧

      在首屏当中,元素与元素之间是相互配合构成整体设计的,而导航是首屏当中无法忽略的一个重要组成部分,无论你喜欢的是完整展开的导航,还是为了干净的布局而将导航隐藏在汉堡菜单中,导航的设计应该和首屏的整体设计合而的。

      导航的目的是将用户引导到他们想去的不同页面,所以,推荐使用置顶悬浮式导航,这样用户不论浏览到页面哪个地方都能够轻松跳转。

      导航元素在首屏当中,和其他的元素组合使用的时候,它们会和其他的元素构成对比,还能形成层次感,而这种层次感的构建和整个设计方案息息相关,应该根据具体情况具体安排。

 

3、清晰的信息传达方式

网页设计必须知道的首屏设计技巧

     视觉传达是一项系统工程,单靠一张图片是不够的。所以,你需要系统的考虑整个首屏的信息传达:

    ·首屏是否告诉了用户可以做什么,或者用户能从中获得什么内容?

    ·首屏是否向用户传达了的、清晰的、易于理解的信息?

    ·首屏是否为用户提供了直观可交互的控件(按钮、输入框、跳转链接等)?

    ·用户能否从首屏跳转到下一个页面/步骤?

     这些问题能够帮你梳理出整个首屏的细节设计思路。

 

4、试试超大字体元素

网页设计必须知道的首屏设计技巧

     想要让首屏更加醒目,超大的字体总是有效的办法。即使文字内容很简单,当用户打开首屏的时候也会一眼就注意到它们,在阅读其他内容之前,只会注意这些内容。尽管字体和排版千变万化,但是在字体的选取和首屏设计上尽量遵循下面的的两个规则来进行:

     ·首页首屏上的展示性的内容采用更加引人注意的字体,和其他地方截然不同

     ·其他页面的正文和主要文本部分,选用统一的、简约耐看的字体,甚至整体排版框架也保持一致

 

5、遵循基本的阅读模式

网页设计必须知道的首屏设计技巧

      用户研究领域的先驱 Nielsen Norman Group 曾经针对这一用户行为进行了深入的研究,为设计师和可用性设计专家们提供了更好的素材和设计依据。

      简而言之,当人们访问某个网站的时候,尤其是初次访问网站的时候,他们通常不会特别仔细的查看所有的内容,而是快速的扫视,找到能够吸引他们注意力的信息,这些内容就是他们继续停留在这个网站上的理由。通过眼动测试和不同实验,他们发现访问者的视觉浏览模式,可以归结为几种典型的模式。设计师 Steven Bradley 在自己的文章中,总结了这三种常见的模式:古腾堡式,Z图模式和F图模式。

     古腾堡式:对于信息结构层次并不那么分明的网页,用户常常会使用古腾堡式的浏览模式,用户大范围扫视页面内容,整个视线路径是一个大号的Z,其中开始的两个视觉驻留点就在页头上。

     Z图模式也不难理解,用户从上到下,视线沿着Z字形来回扫视,用户会左右快速扫视,视线的起点首先是左上角,行跨顶部一栏到右上角,然后向下延伸。

     F图模式,或者说是F式布局,我们就更加熟悉了。在Nielsen Norman Group 的研究当中,这种阅读模式为典型:

    ·用户先会沿着水平方向浏览,优先浏览内容块的上部,这个时候的眼动构成了字母F 上面一横。

    ·接下来视线会沿着屏幕左侧向下垂直扫视,寻找段落中能引起兴趣点的内容,当他们发现引起他们兴趣的内容之时,继续横向仔细浏览,而通常这些内容对应的视线范围会比次横向浏览的范畴要更小一些,而这个视线轨迹则构成了字母F 中间的一横。

    ·接下来用户会将视线移到屏幕左侧,继续向下浏览。

    所以,将关键的元素置于用户的浏览路径上,让用户可以更轻松地消化信息,也能高效地执行交互。

 

6、引入可点击的元素

网页设计必须知道的首屏设计技巧

      你的网站首屏能够吸引用户去操作么?它是否包含有可点击的元素?

      想要引导用户,首屏几乎是完美的存在。在这里,你可以使用行为召唤按钮来引导用户点击跳转到特定的地方,可以用来吸引用户邮件订阅,但是无论如何,尽量让整个首屏集中执行特定的任务,而不要因为过多的可操作选项让用户分心。

      不知道想要在首屏当中包含哪些元素?选择你希望用户执行的操作,所有的元素都围绕着它来设计。

 

7、简单的图层设计

网页设计必须知道的首屏设计技巧

      想要将上面提及的技巧都融会贯通、呈现在你的网页首图当中?那么你需要让所有的元素高效、合理地整合在一起,用简单的几个分层,将它们收纳到一起。

      分层对象能够帮你搞定这个问题。在确定需要呈现哪些元素以及各个部分的功能之后,将不同功能的元素用不同的分层来承载。分层尽量简单,这样不仅更加易于控制,也是让设计更加专注于核心的视觉和功能。多尝试几次,找到真正高效的搭配,让用户打开首屏的时候真正被惊艳到。

 

      结语:首屏的网页设计往往处于整个设计流程当中靠前的位置,随后在设计其他子页面的时候,设计师难免会松懈。其实这些子页面和首屏是同样重要的,两者要协调统一,才能让用户打开网页的时候始终保持一致的体验。

责任编辑:优网科技

版权所有:http://www.uweb.net.cn (优网科技) 转载请注明出处

上一篇 返回列表 下一篇
推荐案例
眼光高度决定品牌厚度 !
广州网站建设-大良实验小学系统开发
广州网站建设-大良实验小学系统开发
大良实验小学于1998年成立,占地4万5千多平方米,是顺德区规模的民办学校之一。现有71个教学班,学生3223人,教职员工436人。学校按广东省一级学校标准建设,配有图书馆、舞蹈室、管乐室、多媒体电子琴室、实验室、英语乐园等功能场室36个,还拥有大礼堂、羽毛球馆、生物园、地理园、游泳池和200米塑胶运动场等活动场所。学校先后荣获“广东省一级学校”、“全国少先队红旗大队”、“广东省首届优秀书香校园”、“广东省书法教育名校”、“广东省综合实践样本学校”等光荣称号。
广州网站建设-海天味业公众号开发
广州网站建设-海天味业公众号开发
海天是中国调味品行业的优秀企业,专业的调味品生产和营销企业,历史悠久,是中华人民共和国商务部公布的首批“中华老字号”企业之一。目前生产的产品涵盖酱油、蚝油、酱、醋、料酒、调味汁、鸡精、鸡粉、腐乳等几大系列百余品种300多规格,年产值过百亿元。
广州网站建设-中凯网站建设
广州网站建设-中凯网站建设
中凯(海南)控股集团有限公司本次项目是集团网站建设,与优网科技合作过程中,双方配合默契,保质保量的仅一个月就完成了整站建设。优网科技帮助中凯(海南)快速树立了一个集团专业形象展示,同时网站的设计效果、体验和交互也让中凯(海南)非常满意。
广州网站建设-中国联塑网站建设
广州网站建设-中国联塑网站建设
中国联塑集团控股有限公司(简称:中国联塑,股份代号:2128.HK )是国内大型建材家居产业集团,产品及服务涵盖管道产品、水暖卫浴、整体厨房、整体门窗、装饰板材、净水设备、消防器材、卫生材料、海洋养殖、环境保护、建材家居渠道与服务等领域。
广州网站建设-前海益广网站建设
广州网站建设-前海益广网站建设
深圳前海益广股权投资有限公司成立于2016年04月18日,注册地位于深圳市前海深港合作区前湾一路1号A栋201室,经营范围包括一般经营项目是:股权投资;受托管理股权投资基金;受托资产管理;企业管理咨询、经济信息咨询;投资兴办实业等。
广州网站建设-萨米特高端品牌网站建设
广州网站建设-萨米特高端品牌网站建设
佛山市萨米特陶瓷销售有限公司始于2000年,在陶瓷行业风潮中发展壮大,是新明珠陶瓷集团的核心品牌。萨米特瓷砖注重营销系统的升级与消费体验模式的实施,倡导“设计+生活”的品牌理念,致力于打造有温度,有态度的瓷砖品牌。用设计提高人居价值,以创新驱动行业发展,与全球不同国家和文化背景的消费者共享美好家居。
广州网站建设-欧迪克网站建设
广州网站建设-欧迪克网站建设
佛山市南海欧迪克五金制品有限公司始创于2003年,致力于发展高端硅镁铝合金安全门窗,木铝门窗、阳光房定制,集研发、生产、销售、服务于一体。自创立以来,系列产品畅销大江南北,获得由权威媒体及单位颁发的多项殊荣。目前为止,“欧迪克门窗”的专卖店遍布全国800多个县市及地区,共有1000多家专卖店辐射全国。
广州网站建设-好太太网站建设
广州网站建设-好太太网站建设
好太太集团是一家集研发、生产、销售、服务于一体的智能家居企业,产品与服务涵盖智能晾晒、智能锁、智能电器等众多领域。坐落于广州番禺区,自1999年始便致力于打造 “好太太”品牌,经过将近二十年的发展,如今好太太已成为全球的晾衣架行业研发、生产、销售、服务商,在中国拥有近2000万户家庭在使用好太太产品。好太太集团于2017年主板上市,成为智能晾晒领域首家A股上市企业。
广州网站建设-中山公用水务网站建设
广州网站建设-中山公用水务网站建设
中山公用事业集团股份有限公司成立于1998年,是一家国有控股的上市公司(SZ:000685)。公司坚持“产业经营+资本运营”双轮驱动的战略思路,定位环保水务为核心业务,通过提升环保水务板块的产业经营能力,与资本运营平台协同增效,致力打造行业内有影响力的领先企业,积极担当社会责任和环境保护的公民企业,促成员工实现自身价值的平台企业。
广州网站建设--华标集团物业公众号
广州网站建设--华标集团物业公众号
华标集团物业为了进一步提升服务质量,满足业主的多元化需求,采用微信公众号作为服务平台,为业主提供日常物业缴费、报事报修、社区活动等便利性服务。本次量身定制的微信公众号,旨在打造一个高效、稳定、便捷的线上服务平台,让业主享受到更加贴心、便捷的物业服务。
广州网站建设-欧派家居集团官网建设
广州网站建设-欧派家居集团官网建设
欧派集团官网作为欧派对外展现品牌形象、传达服务理念的重要信息平台,也向用户展示了欧派最新的资讯和相关的售后服务。优网作为欧派集团的信息化战略合作伙伴,本次的官网开发基于专业的设计水平和扎实的技术能力,为欧派的互联网品牌形象全面升级。
广州网站建设-康臣药业网站建设
广州网站建设-康臣药业网站建设
康臣药业集团(HK.01681)是一家主要从事现代中成药及医用成像对比剂研发、生产及营销的现代化制药企业,创立于1997年,于2013年12月19日在香港联合交易所主板上市,旗下拥有广州康臣药业有限公司、康臣药业(内蒙古)有限责任公司、广西玉林制药集团有限责任公司、广州康臣药物研究有限公司等从事药品生产和研发的企业,运营康臣、玉林等知名医药品牌,在国内建有广东广州、内蒙古通辽、广西玉林等3个生产基地,员工逾2000人。

我要投稿

姓名

文章链接

提交即表示你已阅读并同意《个人信息保护声明》

专属顾问 专属顾问
扫码咨询您的优网专属顾问!
专属顾问
马上咨询
扫一扫马上咨询
扫一扫马上咨询

扫一扫马上咨询

展开菜单
关于我们
优网观点
项目动态
公司新闻
优网学院
常见问题
收起菜单
活动会议应用
答题应用
班车预定应用
应急值班表应用
春节活动应用
活动直播应用
内部培训及任务应用
返回上一级