如何运用“视觉表现”建立网页的信息层级
首先看下面两张图,左图为相机拍摄的效果,右图为人眼不移动时看到的效果,可以发现人眼对信息的获取并不是一次性完成的,它不能同时产生多个焦点从而把视线停留在更多的地方,设计师需要考虑的是让用户通过眼球移动,按照一定的顺序获取信息,帮助获取和理解的过程高效自然。
这个设计方法希望解决的主要是两个问题:
1、设计师的专业性
设计师有意识的分析信息优先级,了解哪些视觉表现手法可以建立信息层级及每一种方法背后的理论依据,不仅仅凭感觉做设计。
2、用户获取和理解信息的效率
建立良好的信息层级,能让用户在有限的时间里,快速获取和理解有用、感兴趣的信息,并产生下一步行为;
一、前期了解&分析
在开始设计前,除了对项目本身的背景目标有所了解外,视觉设计师针对具体的页面也需要了解一些内容以帮助后面的设计有指导方向,包括页面定位、氛围营造、信息优先级和用户核心行为。
1.1、页面定位是帮助分析页面信息优先级、核心行为的前提
通常有:
用户是谁
用户来自哪里,即从什么渠道来到该页面
页面内容定位,提供什么、不提供什么
页面作用
举个例子:
我们在设计采购直达市场新首页时,交互通过对页面的用户对服务的熟知度进行分析,确定首页的最核心目标用户是新买家;页面内容定位是展示市场的价值点,用户产生的数据让新买家对采购直达形成品牌的认知;
1.2、了解页面需要营造的氛围,能帮助我们判断哪些元素能帮助达到目标,氛围可以是内容本身,也可以通过视觉元素设计来营造,但必须注意氛围营造不应强过用户关注的内容本身
氛围可能有:
新年主题大促
低折扣
信息鲜活
用户活跃等等
以下是大促活动正式页面,左图延续了预热期嘉年华的氛围,但到活动开始阶段氛围已经不是重点,用户更关心商品及折扣本身,右图为调整后将氛围的营造和类目图片相结合,很好的解决了氛围和内容的关系问题。
1.3、分析信息优先级
1)一级信息吸引用户:假设用户只会在这个页面停留3-5秒,最能够吸引用户继续浏览的是页面的核心卖点,是一级信息,它必须少而精,在设计上要重点展示
2)二级信息帮助理解:有了一级信息的吸引,用户进一步了解内容而可能停留3-5分钟,这时展示二级信息即提炼的精华内容,帮助用户在尽量短时间内理解信息
3)三级信息详细了解:前两类信息基本上能帮助用户获取足够的信息,用户如果继续停留更长的时间去详细了解,这类信息量会更多,在设计上视觉层级会靠后,或通过交互方式展示、提供入口跳转
推荐新闻
更多行业-
网站设计公司是如何工作的,怎样设计出优秀的网站?
网站设计公司需要负责需求客户的网站设计工作,域名注册工作,网站测试工作...
2023-03-10 -
教育网站设计的原则是什么?模板怎么使用?
教育网站设计的原则是要注意使用易于理解和记忆的语言来描述你想要表达的信...
2023-04-24 -
从技术走向SEO之路
做Seoer,对我而言很陌生,自己从未想过会进入这一行。2年半前进入一...
2015-11-23 -
优化支招:网站排名忽上忽下咋办
关于自己的网站排名,我们的每一个神经都绷得很紧,稍微有一点点变化,...
2012-02-03 -
网站建设等于漂亮加网站优化推广
网站建设不单单要漂亮,漂亮只是网站的一方面,但是从网站经营的角度来说,...
2012-07-20 -
做企业网站建设一般都是包括哪些内容?
在企业网站建设过程中,涉及的内容很多。从不同的角度来看,可能需要的内容...
2020-04-07
预约专业咨询顾问沟通!
免责声明
非常感谢您访问我们的网站。在您使用本网站之前,请您仔细阅读本声明的所有条款。
1、本站部分内容来源自网络,涉及到的部分文章和图片版权属于原作者,本站转载仅供大家学习和交流,切勿用于任何商业活动。
2、本站不承担用户因使用这些资源对自己和他人造成任何形式的损失或伤害。
3、本声明未涉及的问题参见国家有关法律法规,当本声明与国家法律法规冲突时,以国家法律法规为准。
4、如果侵害了您的合法权益,请您及时与我们,我们会在第一时间删除相关内容!
联系方式:010-60259772
电子邮件:394588593@qq.com