`
wbj0110
  • 浏览: 1602602 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

网站首页的设计(转)

阅读更多

网站首页的设计是一件非常让人头痛的事。虽然她看上去很简单:产品经路随便从网站里拿点东西出来,堆出一个看上去靠谱的页面。也正因此,它往往非常麻烦:很多人都可以发表自己的见解,以致最终陷入到无尽的争执中。

首页的设计相对于其他页面要难的原因是,其他页面更多的是解决用户“能做”的问题,而首页的更多要解决用户“想做”的问题。“能做”对应的是可用性,相对容易解决,专家评估、可用性测试都可以很有效地帮助策划师或设计师;而“想做”对应的是PET(Persuation,Emotion,Trust,说服、情感、信任),可能涉及到心理学,消费学,营销学等陌生的知识,设计师在这方面就不再是专家了。

从用户群体分,首页可以分为以下三种用户:不了解的新用户、有兴趣的新用户、老用户。

对于新用户而言,他们势必会问到这些问题:

  • 我在这能做些什么?
  • 这个网站能提供哪些对我很重要的东西?

对于已经有兴趣的用户也会有些其他的疑问:

  • 我应该怎么开始?
  • 我是否必须注册?如果是,应该怎样注册?

总得来说,首页应该解答新用户的疑惑并且帮助他们找到功能的入口;而对于老用户,则需要更明显、快捷的登录入口。《designing for the social web》一书将用户的使用分为几个步骤:不了解——感兴趣——第一次使用——常规使用——有情感。而首页对于前面三个步骤至关重要!

user

这样看来,首页有两个目标:

  1. 让不了解的用户了解网站并产生兴趣,最终促成用户使用。
  2. 让有兴趣的用户尽快开始使用。

从用户的浏览行为,首页又可以分为两种用户:有目标的用户和无目标的用户

Alan Cooper的“目标导向”理念告诉我们,用户的目标驱动任务,有目标的用户直接开始“任务”,我们只要为他们解决可用性的问题。而那些无目标的用户,他们只是随便逛逛,需要首页的PET足够好,将此类用户“转化”成有目标的用户,尽量避免他们“流失”。

target

所以我将浏览首页的用户分为这两类,针对两类用户不同的特点来进行设计,会让我们的思路变得清晰。

design

在首页页设计之前,一定要做的就是调查分析网站用户,是“有目标”的多,还是“无目标”的多,以确定页面上两类模块的比例。一般网站同时兼顾两种用户。但“可用性“和“PET”这两点,存在天然矛盾,前者要求页面清晰,而从后者的角度来说,清晰意味着死板,后者要求页面丰富,而从前者的角度来说,丰富意味着杂乱。故在设计时要注意权衡。为解决上述矛盾,要求“可用性模块”和“PET模块”要明确区分,可以识别,不能相互掺杂。让两类用户能第一时间关注到需要看的部分。可用性是基础,一定要先做好,PET是更高要求,属于上层建筑,切不可为上层建筑放弃基础。

首页的可用性设计

  1. 尊重用户习惯,不要擅自创新,采用用户习惯的网站头,包括主导航,全局导航,搜索,LOGO。
  2. 突出导航信息,对导航内容进行分类,对导航信息进行一定程度的架构。
  3. 尽量保持页面布局规矩,使用网页栅格系统设计页面,最好不出现两列和三列混排的设计。
  4. 模块中使用尽可能简单的列表,简单列表更容易被理解和读懂,且设计运营开发成本低。

首页的PET设计

1、清晰表现品牌和产品服务类型。这首先实现PET中的Trust,只有用户第一时间了解网站品牌和服务(特别是一些大品牌),才能够立即建立用户的信任。但这个实践起来却相当有难度,特别是一些全新的服务,篇幅小了说不清,篇幅大了用户直接略过。可以采用5秒测试来验证此目的有没有达到。

给一个新用户(目标用户)看首页设计5秒,让它说出:

  • 这是什么网站?
  • 这个网站提供什么服务?
  • 首先吸引你的是什么内容?
  • 这个网站和类似竞争对手有什么不一样吗?
  • 你对这个网站和它的服务有没有兴趣?

然后让用户仔细浏览该首页,再纠正上面的答案。另外想要用户容易记你的网站或品牌,你可以把你的网站LOGO放到网站适当位置,而且要配合网站风格,这样会比较容易让用户记住你的网站LOGO,在用户心中留下一定的印象,下次用户访问网站的时候,看到你这个标志就可以知道是你的。

2、使用吸引人的图片和标题。说白了就是标题党,虽然这招定被广大设计师唾弃,但它的效果绝对不容小觑。网站首页就像是一本书的封面或是杂志封面,它是用户浏览网站时第一眼看到的,因此,你的首页设计必须第一眼就能吸引用,否则它就失去了首页的用途和目的。你可以看大部分网站的首页,他们都是很吸引人的,你可以全色彩或者只有黑白,也可以利用有吸引力的图像与文字组合来创作你的首页。

3、使用非对称的设计,有主有次,展现丰富性。但注意,非对称设计会增加认知负担,降低可用性。

4、利用好数字来说服用户,因为数字“不会说慌”。比如限量限时促销,突出价格和价格对比等。

5、在首页显示其他用户的活动来说服用户(其他用户购买记录,评价,晒单等)。调查显示,让用户信任一个站点的最有效途径,就是在线其他消费者的意见。

6、视觉设计上要符合产品和服务的定位,在情感上与用户拉近距离。

网站首页的设计是一项非常重要的工作, 在实际项目中还需对更具体的场景进行分析、考虑运营性的需求、对单个模块的交互进行推敲,最终才能得到一个能吸引用户、留住用户的有效首页。

转自:

http://www.biaodianfu.com/index-design.html

 

 

分享到:
评论

相关推荐

    仿58转转二手商品PHP网站源码-带主页_搭建转转高仿_搭建转转源码_php高仿咸鱼_仿转转源码_php源码转转_

    【标题】中的“仿58转转二手商品PHP网站源码-带主页”是指这是一款基于PHP编程语言开发的二手商品交易网站源代码,它的设计风格和功能与58转转或咸鱼类似,同时也包含了首页的设计。这种类型的源码通常用于快速构建...

    计算机网络课程设计,电子购物网站设计

    在本项目中,我们将深入探讨计算机网络课程设计与电子购物网站的构建,这是一次将理论与实践相结合的绝佳机会。计算机网络课程设计是学习如何规划、实施和维护网络基础设施的关键部分,而电子购物网站的设计则涉及到...

    计算机网络课程设计电子购物网站设计

    在计算机网络课程设计中,构建一个电子购物网站是一项综合性的任务,它涵盖了多个技术领域,如Web技术、DHCP、DNS以及FTP等。这个项目旨在让学生深入理解互联网基础架构,并应用这些知识创建一个功能完善的在线购物...

    基于web的班级网站的设计

    在网站总体分析与设计中,我们可以对网站进行分解,从内容上对网站进行划分,例如班级首页、班级介绍、同学信息、班级相册、留言板、学样风貌等。 在主页设计中,我们可以采用静、动相结合的方式,即静态的主画面和...

    在线艺术字生成器-DedeCMS源码-支持字体转换与自定义-适用于网站设计

    创造专属艺术字-字体定制-系统源码-支持自定义字体/在线艺术字体转换器 您现在可以随心所欲地在线生成、转换和设计艺术字体。... 虽然基于DedeCMS内核,但赋予您无限的可能性。...为您的网站增添独特魅力,引领潮流前沿。

    基于JavaWeb技术的旅游网站的设计与实现毕业设计(论文).pdf

    文章分为前言、旅游网站的需求分析、系统概要设计、网站详细设计和旅游网站的系统。本文介绍了每个功能模块的实现过程。 关键词包括旅游网站、MySQL、信息控制、JSP。JSP(Java Server Pages)是一种实现基于Java...

    网站主页版面的设计 实验一自学部分

    网站主页版面设计是构建一个吸引并易于导航的在线门户的关键步骤。在进行网站主页设计时,我们需要考虑几个核心知识点: 1. **网站设计基础知识**:这包括理解网页的基本结构,如头部、主体、侧边栏和底部,以及...

    html班级主页设计

    这个"html班级主页设计"项目,显然旨在教授和实践HTML5与CSS的整合应用,以创建一个适用于班级的网页。在这个过程中,我们可以学到许多关于网页布局、交互设计以及前端技术的基础知识。 首先,HTML5作为超文本标记...

    web课程设计——明星网站设计

    在本“Web课程设计——明星网站设计”项目中,我们将深入探讨Web前端开发的核心技术和实践应用,特别是关于CSS样式表和HTML5的使用。这个课程旨在帮助学生掌握创建吸引人的、响应式的明星网站所需的技能。 首先,让...

    网站课程设计

    网站课程设计 一、课程设计目的与要求 通过课程设计的过程,熟悉并掌握 ASP 的理论和方法。了解电子商务网站建设与开发的全过程,网站建设的相关技术知识,能够掌握 ASP 网站建设的开发方法。 二、电子商务网站...

    毕业设计最新仿58转转闲鱼源码 二手商品交易平台网站PHP源码带独立后台管理.zip

    最新仿58转转闲鱼源码 二手商品交易平台网站PHP源码带独立后台管理 转转闲鱼交易猫八合一完整源码 集成多套模板,集成多套模板

    个性班级网站毕业设计

    ### 个性班级网站毕业设计知识点解析 #### 一、项目背景与目标 - **项目名称**:“个性班级网站”毕业设计。 - **项目背景**:本项目是在实训课程的指导下,由学生个人独立完成的一项实践任务。目的在于通过实际...

    轻松玩转PPT设计

    ### PPT设计技巧详解 #### 一、理解PPT设计的重要性 在当今社会,无论是商务会议、学术报告还是日常教学,PPT(PowerPoint)都已成为一种极为重要的...希望以上内容能对大家有所帮助,让大家都能轻松玩转PPT设计!

    最新仿58转转闲鱼源码 二手商品交易平台网站PHP源码带独立后台管理

    同时,SEO(搜索引擎优化)也是首页设计时需要考虑的,以提高网站在搜索引擎中的排名。 此外,独立后台管理系统是源码的另一大亮点。后台管理通常包含用户管理、订单管理、统计分析等功能,帮助管理员高效地监控和...

    在线音乐网站数据库设计.docx

    **在线音乐网站数据库设计** **第一章 引言** 1.1 编写目的 本文档旨在详细阐述在线音乐网站的数据库结构模型设计,为系统开发人员、测试人员、运维人员提供清晰的指导,确保数据库的高效运行和后期维护。通过这份...

    [转]网站设计流程讲稿

    网站设计流程是一个复杂而系统的过程,它涉及到多个阶段和关键环节。在这个过程中,设计师们将概念转化为实际的、用户友好的在线体验。本讲稿主要围绕这个主题展开,旨在为初学者提供一个全面的指导,同时也对有经验...

    谈网页的转场设计.doc

    此外,转场设计应符合品牌形象,与网站的整体风格和用户目标保持一致。 在实际应用中,转场设计需要考虑用户的情感反应。例如,柔和的转场可能适合创造轻松的氛围,而快速的转场可能适用于传达紧迫感或活力。设计师...

    2000个网站设计图标素材二

    网站设计是创建高效、美观且用户友好的在线平台的关键步骤之一,而图标作为设计中的重要元素,能够增强用户的交互体验,提升网站的视觉吸引力。在这个主题中,我们聚焦于一个包含2000多个设计图标的素材包,特别是第...

    校园网站设计方案 转

    我校校园网建设的目的和最终意义在于应用。 建立一个高效率、低成本的网络以满足教学工作日益增长的需求是设计这个网络的目标,为此必须对用户的需求做详细的调查。教师学校网络的需求主要是:

Global site tag (gtag.js) - Google Analytics