web站点的设计原则,网站内容设计的原则

http://www.itjxue.com  2023-01-15 05:12  来源:未知  点击次数: 

Web设计的设计原则有哪些

好的设计能够帮助企业提升数据,同时还可以提供用户一个良好的使用体验。GoodUI 总结了一个长达69条设计原则的清单(不断增加中),列举了他们认为非常重要的设计要点。

与以往的一些文章不一样的是这里提到的69点其中有一部分 GoodUI 已经通过 AB Test 验证过可行性。当然分析报告是需要付费的,单篇39美金。

不过今天讨论的重点并不是付费报告,而是这69条设计原则。我按照自己的理解将它们翻译成了中文并配上图片,希望对大家有所帮助。

本篇文章内容及图片均来自于GoodUI,如有翻译不恰当的地方欢迎大家指正。

01 尝试使用一列的布局替代多列布局

02 给用户一些小的利益,别看上去那么赤裸裸

03 合并相似的功能

04 尝试展示来自用户的赞扬,而不是自我表扬

05 重复核心行动点

06 统一视觉规范,提升可识别性

07 尝试使用推荐的口吻,而不是让用户感觉面对一台冷冰冰的机器

08 给用户吃「后悔药」的机会

09 告诉用户产品适用的人群,而不是人人都通用

10 将文案写得更加的直接,而不是一堆废话

11 增强主行动点的视觉冲击力,提升它在页面中的可对比性

12 让用户知道你从哪儿来更易于拉近与用户的关系

13 将表单做的简单点,确保用户在抓狂之前能进入下一步

14 尽量将用户需要选择的信息展示出来而不是藏起来

15 页面的排版需要考虑用户是否会漏掉底部信息

16 如果页面的底部有需要关注的行动点,别让文中过多的外链带走了用户

17 确保用户知道自己目前的状态

18 将利益点融合在行动点中,增强用户的点击欲望

19 将行动点与当前信息结合起来

20 将简要的表单合并到页面中,减少调整页面带来的用户流失

21 适当的增加延迟动效,让用户感知到页面的变化

22 让新用户从尝试产品入手,而不是一来就面对冷冰冰的注册表单

23 减少使用线框,这会过多的吸引用户注意力,而且会让页面看上去透不过气

24 给用户推销你能给他带来的利益,而不是功能

25 一定要注意0结果页面的设计,这也是引导用户的好地方

26 给用户选择退出的权利,特别是邮件订阅

27 注意界面元素的一致性,降低用户学习成本

28 给下拉框增加一些预设值,降低用户填写成本

29 延续用户日常的使用习惯,而不是重新创造

30 尝试告诉用做些事情降低自己的损失,而不是提升收益

31 提升页面的视觉层次,增强可阅读性

32 将同类的操作合并在一起,降低用户的认知成本

33 表单及时校验,而不是统一提交后在告诉用户填错了

34 尝试将表单输入变得更加宽容,让用户的填写更加简单

35 通过时间增强紧迫感

36 提供用户可预见性的操作,降低用户的心理成本

37 尽可能的帮助用户选择,而不是让用户想破脑袋

38 尽可能将操作区域放大,降低用户操作成本

39 页面加载速度很重要,尽可能让用户感受到你的网站速度很快

40 如果可以,增加键盘快捷键,提升操作效率

41 尝试通过对比来让用户感知到性价比

42 尝试对进度条进行「设计」来降低用户等待的焦虑

43 根据用户选择逐步展示信息,降低无效信息对用户的干扰

44 有时候较小的承诺比「夸海口」会更容易让用户信服

45 尝试将提示信息弱化,减少对用户操作的干扰

46 尽量通过系统的功能来简化用户的操作

47 用文本配合图标来降低用户的认知成本

48 用更自然的语言代替冷冰冰的机器

49 放出一些摘要信息来帮助用户识别是否需要进一步了解

50 在关键的页面增加用户权益信息,增强用户进一步操作的信心

51 将价格进行换算,让用户感觉这很便宜

52 记得在成功页面感谢用户

53 将数字转化成易于用户阅读的形式,而不是冷冰冰的机器语言

54 告诉用户选择的权利和自由「诱惑力」

55 尝试让语言更具「诱惑力」

56 通过设计引导用户的注意力

57 通过友好的对比来展示产品,为用户做决定提供帮助

58 通过任务机制来提升用户的满足感

59 让用户了解接下来将要发生什么事情

60 尝试用更幽默一些的语言文案

61 任何操作之后都要给出反馈,让用户知道操作已经生效

62 注意动效的真实使用情况(Amazon 的类目菜单就是一个很好的例子)

63 注意排版的,不要让信息过于拥挤

64 尝试用讲故事的方式来传递信息,增强用户的代入感

65 尽量给用户展示真实的信息,不要欺骗

66 随着用户的不断熟悉简化界面

67 试着用用户的口吻展示信息

68 在表单中增加一些提示信息,减少错误的几率

69 最后,用简单的文案传递核心关注的信息,少一些废话

这69条设计原则虽然针对 Web 设计,但有些部分在移动产品设计中同样有效。

转载自:

网站标志是树立网站整体风格的第一步,其设计一般有哪些原则

一、 明确建立网站的目标和用户需求

展现企业形象、介绍产品和服务、体现企业发展战略的,因此明确设计站点的目的和用户需求,从而做出切实可行的设计计划。根据消费者的需求、市场的状况、企业自身的情况等进行综合分析

二、网页设计总体方案主题鲜明

在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位,规划网站的组织结构。好的Web站点把图形表现手法和有效的组织与通信结合起来。

做到主题鲜明突出,要点明确,按照客户的要求,以简单明确的语言和画面体现站点的主题;调动一切手段充分表现网站点的个性和情趣,办出网站的特点。

Web站点主页应具备的基本成分包括: 页头:准确无误地标识你的站点和企业标志; Email地址:用来接收用户垂询; 联系信息:如普通邮件地址或电话; 版权信息:声明版权所有者等。

充分利用已有信息,如客户手册.公共关系文档.技术手册和数据库等。

三、网站的版式设计

视觉语言,讲究编排和布局,版式设计通过文字图形的空间组合,表达出和谐与美。

四、色彩在网页设计中的作用

根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。 根据色彩对人们心理的影响,合理地加以运用。

五、网页设计形式与内容相统一

为了将丰富的意义和多样的形式组织成统一的页面结构,形式语言必须符合页面的内容,体现内容的丰富含义。灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感而灵猫 垫商则据问题对称原则在页面设计中, 它的均衡有时会使页面显得呆板,但如果加入一些富有动感的文字、图案,或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面作为视觉语言中的基本元素,巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果,充分表达的设计意境。

六、网页设计中多媒体功能的利用

吸引浏览者注意力,网页的内容可用三维动画、FLASH等来表现。但要由于网络宽带的限制,在使用多媒体的形式表现网页的内容时不得不考虑客户端的传输速度。

七、结构清晰并且便于使用

使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有好产品,如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话,他们是不会喜欢您的网站的,这就是网页设计的失败。

八、导向清晰

网页设计中导航使用超文本链接或图片链接,能够在网站上自由前进或后退,而不会使用浏览器上的前进或后退。图片上使用“ALT”标识符注明图片名称或解释,以便那些不愿意自动加载图片的观众能够了解图片的含义。

九、快速的下载时间

很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站,在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。因此,网页设计中尽量避免使用过多的图片及体积过大的图片。

Web页面设计原则

摘自电子商务系统分析与设计

Web页面设计遵循三条原则:简洁性、一致性和对比度。简称3C原则。

1)简洁性

设计并不再现具体的物像和特征,它要表达的是一定的意图和要求,在适当的环境里为人们所理解和接收。

醒目的图形,要求简洁。

限制字体和所用颜色的数量。

页面上所有的元素都应当有明确的含义和用途。

2)一致性

页面的排版,各个页面使用相同的页边距。文本、图形之间保持相同的间距。

主要图形、标题或符号旁边留下相同的空白。

各个页面使用相同的图标。

色彩和风格的一致性,所有图片都应该具有相同的风格。

文字的颜色要同图形的颜色保持一致并注意色彩搭配的和谐。

一个站点通常只使用一两种标准色。

3)对比度

使用对比度是强调突出某些内容的最有效的办法之一。

使内容容易辨认和接受。

例如:内容提要使用蓝色,正文采用黑色。

也可以使用大标题。

图像对比,题头的图像明确地向浏览者传达本页的主题。

网站设计要遵循哪些原则

网页设计中要遵循哪些原则呢?怎样才能设计出一个合格的网页。我们知道,设计的个性化表现得非常明显,每个设计师都有着自己的设计理念,而企业也有着自己的需求,因而这两者经常会出现冲突。因此,网页设计中要遵循一定的原则。下面是一些网站设计中应注意的原则。

步骤/方法

一、 明确建立网站的目标和用户需求

Web站点的设计是展现企业形象、介绍产品和服务、体现企业发展战略的重要途径,因此我们必须明确设计站点的目的和用户需求,从而做出切实可行的设计计划。我们会根据消费者的需求、市场的状况、企业自身的情况等进行综合分析,以“消费者(customer)”为中心,而不是以“美术”为中心进行设计规划。

在设计规划时我们会考虑:

建设网站的目的是什么?

为谁提供服务和产品?

企业能提供什么样的产品和服务?

网站的目的消费者和受众的特点是什么?

企业产品和服务适合什么样的表现方式(风格)?

二、网页设计总体方案主题鲜明

在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位,规划网站的组织结构。

Web站点应针对所服务对象(机构或人)的不同而具有不同的形式。有些站点只提供简洁文本信息;有些则采用多媒体表现手法,提供华丽的图像、闪烁的灯光、复杂的页面布置,甚至可以下载声音和录像片段。好的Web站点把图形表现手法和有效的组织与通信结合起来。

为了做到主题鲜明突出,要点明确,我们将按照客户的要求,以简单明确的语言和画面体现站点的主题;调动一切手段充分表现网站点的个性和情趣,办出网站的特点。

Web站点主页应具备的基本成分包括: 页头:准确无误地标识你的站点和企业标志; Email地址:用来接收用户垂询; 联系信息:如普通邮件地址或电话; 版权信息:声明版权所有者等。

充分利用已有信息,如客户手册.公共关系文档.技术手册和数据库等。

三、网站的版式设计

网页设计作为一种视觉语言,特别讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处。

版式设计通过文字图形的空间组合,表达出和谐与美。

多页面站点页面的编排设计要求把页面之间的有机联系反映出来,特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果,我们将反复推敲整体布局的合理性,使浏览者有一个流畅的视觉体验。

四、色彩在网页设计中的作用

色彩是艺术表现的要素之一。在网页设计中,我们的设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。 根据色彩对人们心理的影响,合理地加以运用。如果您的企业有CIS(企业形象识别系统),我们将按照其中的VI进行色彩运用。

五、网页设计形式与内容相统一

为了将丰富的意义和多样的形式组织成统一的页面结构,形式语言必须符合页面的内容,体现内容的丰富含义。

灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。如对称原则在页面设计中, 它的均衡有时会使页面显得呆板,但如果加入一些富有动感的文字、图案,或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面作为视觉语言中的基本元素,巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果,充分表达完美的设计意境。

六、三维空间的构成和虚拟现实

网络上的三维空间是一个假想空间,这种空间关系需借助动静变化.图像的比例关系等空间因素表现出来。 在页面中,图片、文字位置前后叠压,或页面位置变化所产生的视觉效果都各不相同。通过图片、文字前后叠压所构成的空间层次不太适合网页设计,根据现有浏览器的特点,网页设计适合比较规范、简明的页面,尽管这种叠压排列能产生强节奏的空间层次,视觉效果强烈。 网页上常见的是页面上、下、左、右、中位置所产生的空间关系,以及疏密的位置关系所产生的空间层次,这两种位置关系使产生的空间层次富有弹性,同时也让人产生轻松或紧迫的心理感受。 现在,人们已不满足于HTML语言编制的二维Web页面,三维世界的诱惑开始吸引更多的人,虚拟现实要在Web网上展示其迷人的风采,于是VRML语言出现了。VRML是一种面向对象的语言,它类似Web超级链接所使用的HTML语言,也是一种基于文本的语言,并可以运行在多种平台之上,只不过能够更多地为虚拟现实环境服务。

七、网页设计中多媒体功能的利用

网络资源的优势之一是多媒体功能。要吸引浏览者注意力,网页的内容可以用三维动画、FLASH等来表现。但要由于网络宽带的限制,在使用多媒体的形式表现网页的内容时不得不考虑客户端的传输速度。

八、结构清晰并且便于使用

如果人们看不懂或很难看懂您的网站,那么,他如何了解你的企业和服务呢?使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有最棒的产品,如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话,他们是不会喜欢您的网站的,这就是网页设计的失败。

九、导向清晰

网页设计中导航使用超文本链接或图片链接,使人们能够在您的网站上自由前进或后退,而不会让他们使用浏览器上的前进或后退。我们在所有的图片上使用“ALT”标识符注明图片名称或解释,以便那些不愿意自动加载图片的观众能够了解图片的含义。

十、快速的下载时间

很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站,在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。因此,我们会建议您在网页设计中尽量避免使用过多的图片及体积过大的图片。我们通常会与客户合作,将主要页面的容量控制在50K以内,平均30K左右,确保普通浏览者页面等待时间不超过10秒。

十一、非图形的内容

我们在必要时适当使用动态“Gif”图片,为减少动画容量,应用巧妙设计的Java动画可以用很小的容量使图形或文字产生动态的效果。但是,由于在互联网浏览的大多是一些寻找信息的人们,我们仍然建议您要确定您的网站将为他们提供的是有价值的内容,而不是过度的装饰。

十二、方便的反馈及订购程序

让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成功的重要因素。如果客户在您的网站上产生了购买产品或服务的欲望,您是否能够让他们尽快实现吗?是在线还是离线?

 十三、网站测试和改进

测试实际上是模拟用户询问网站的过程,用以发现问题并改进网页设计。我们通常与用户共同安排网站测试

如何设计网站——对Web设计的一点总结

在最近的工作中,遇到了导航的问题,无意中发现了找出了收藏已久的《别让我思考》,花了一周时间读了两遍,才清楚的理解导航对于一个产品的重要作用。也更加印证了产品圈中将用户当做小白的理论,其实并不是在产品设计中将一切都为用户标注出来,而是让用户能够通过自己的方式更加轻松的使用产品,这样的产品对于用户来说必定是不言而喻的,也就是主题“别让我思考”。下面是这次读书的笔记,虽然这本书给我很大的启发,但是一切需要归于实践,在实践中验证这个理论。

一、指导原则

第一章:别让我思考?---?可用性第一定律

web设计的终极法则:别让我思考,即看到一个界面应该是?不言而喻?,?一目了然?,?自我解释?。

强迫我们思考的地方:(1)酷炫的名字或技术名词。(2)看起来不太明显的按钮和链接

当思考时,需要权衡,权衡应该更倾向于“显而易见”,而不行hi需要额外的思考

每个需要思考的地方会加重用户的认知负担,把用户的注意力从要完成的任务上拉开

访问网站时不需要思考的事都有什么?

我在什么位置?

该从哪里开始?

他们把xx放在什么地方?

这个项目上最重要的是什么?

为什么他们给它取这个名字?

如果做不到让一个页面不言而喻,那么至少应该让它自我解释

当浏览网站遇到问题时,用户会认为是自己的错误,而不会责怪网站

如果要让网页有效,它们必须在用户第一眼看到时将自己展示出来,而要做到这一点,最好的方法是创建不言而喻的网页,或者至少是自我解释。

第二章:我们实际上是如何使用Web的?---?扫描,满意即可,勉强应付

事实1?--?我们不是阅读,而是扫描,寻找能吸引用户注意力的文字或词语(除新闻故事,报告,产品描述界面)

为什么扫描?

(1)我们总是处于忙碌之中?---?使用web是想节约时间

(2)我们知道自己不必阅读所有内容?---?寻找感兴趣或手头的任务相关的内容

(3)我们善于扫描?---?生活习惯,找感兴趣的内容

用户在网页上看到什么却决于想看到什么,通常为页面的一小部分内容

吸引注意力的文字和短语是什么?

(1)与手头任务有关的

(2)我们当前或接下来的个人兴趣

事实2?---?我们不作最佳选择,而是满意即可

用户大多数时间不会选择最佳选项,而是选择第一个合理的选项?---?满意策略

为什么不寻找最佳选择?

(1)我们总是处于忙碌之中?---?最佳策略时间久,满意策略效率高

(2)如果猜错了,也不会产生什么严重的后果

(3)对选择进行权衡并不会改善我们的机会

(4)猜测更有意思?---?猜测不会像权衡那么累,猜对了,可能看到意外的内容

事实3?---?我们不是追根究底,而是勉强应付

勉强应付不仅限于初学者,技术专家也会在理解事物的工作原理上有着惊人的误会

原因是什么?

(1)这对我们来说并不重要?---?明白事物工作机制并不重要

(2)如果发现某个事物能用,我们会一直使用它?---?如果遇到更好的方法,会用好的方法,但是很少主动寻找更好的方法

如果用户明白网站,而不是勉强应付的作用

(1)用户更容易找到自己需要的东西,对用户和网站都好

(2)用户更容易理解你的网站有哪些服务?---?不仅仅是用户偶然看到的

(3)引导用户看到你希望他们看到的内容(网站上)

(4)在你的网站上,用户会感到掌控全局,并逐渐成为老用户

第三章:广告牌设计101法则?---?为扫描设计,不为阅读设计

吸引用户的5个重要方面(为下方2-6部分内容)

在每个页面上建立清楚的视觉层次

尽量利用习惯用法

把页面划分成明确定义的区域

明显标识可以点击的地方

最大限度降低干扰

建立清楚的视觉层次

视觉层次清楚的页面的特点

(1)越重要的部分越突出

(2)逻辑上相关的部分在视觉上也相关

(3)逻辑上包含的部分在视觉上进行嵌套

一个页面没有清楚的视觉层次,用户会降低扫描页面的速度,会寻找关键的文字和短语,然后拼凑出感觉重要的内容和内容的组织方式,这样会增加工作量

习惯用法是你的好帮手

web的习惯用法

(1)它们非常有用?---?适当使用习惯用法,让用户访问更容易,减少额外学习工作原理ide成本

(2)设计师通常不愿意利用它们

如果不打算使用习惯用法,需要的做法:

a.必须确定你在使用一种同样清楚、同样不言而喻,没有学习曲线的方法

b.带来很大的价值

把页面划分成明确定义的区域

明显标识可以点击的地方

降低视觉噪声

噪声的分类

(1)眼花缭乱?---?所有的信息都想吸引用户的目光,没有突出点

(2)背景噪声?---?页面没有一个地方会造成过分干扰,但是这些很小的噪声太多会惹人厌烦

第四章:动物、植物、无机物?---?为什么用户喜欢无需思考的选择

真正的问题不是到达目标之前要点击的次数,而是每次点击有多难,需要多少思考,多大的不确定性来判断自己是否在进行正确的选择

关键:如果用户需要一直在网络上进行选择,那么让这些选择变得无需思考是让一个网站容易使用的原因

第五章:省略不必要的文字?---?不要在Web上写作的艺术

有力的文字都很简练。句子里不应该有多余的文字,段落中不应该有多余的句子

去掉没人看的文字的优点有哪些?

可以降低页面的噪声

让有用的内容更加突出

让页面简洁,让用户在每个页面上以言就能看见更多的内容,而不必滚动屏幕

需要去掉的文字是?欢迎词?和?指示说明

二、必须正确处理的几个方面

第六章:街头指示牌和面包屑?---?设计导航

如果在网站上找不到方向、人们不会使用你的网站

网络导航101法则

你通常是为了寻找某个目标

你会决定先询问还是先浏览

如果选择刘兰兰,你将通过标志的引导再层次结构中穿行

最后,如果找不到想要的东西,你会离开

web与生活从空间角度来看的不同点

感觉不到大小

感觉不到方向

感觉不到位置

用户使用Web导航是因为需要得知自己当前的位置

导航的用途?---?显而易见的用途

帮助我们找到想要的任何东西

告诉我们现在身处何处

导航给了用户一些固定的感觉,让用户感到脚踏实地

导航的其他用途?---?被忽视的用途

导航告诉我们当前的位置?---?告诉网站有些什么,导航表现了内容,导航站点比告诉我们位置更重要

导航告诉我们如何使用网站?---?从哪里开始,如何进行选择

导航给了用户对网站建造者信心

Web导航的习惯用法

网站ID

栏目

实用工具

指示器(指明用户当前位置)

下一级栏目

页面名称

页面导航(当前这一层的内容)

小字体版的底端导航

持久导航(或全局导航)?:来描述出现在网站每个页面的一组导航元素

持久导航应在在整个网站保持一致,使用户只需要了解一次就够了,减少学习成本

持久导航的五个元素

站点ID

回首页的方式(Home)

搜索的方式

栏目

实用工具

主页和表单?不需要使用持久导航

主页:承担一些不同的任务,遵守一些不同的承诺,所以不需要使用持久导航

表单:在填写表单的页面,持久导航会产生干扰

如何设计Web导航各元素(表格下方为示例?-?亚马逊)

导航元素名称

细节点

站点ID

1.在Web上需要在每个页面都能看到网站的名称?---?页面ID,通常在左上或靠近左上

2.网站ID代表整个网站,也就是说在当前站点结构中层次最高

3.站点ID如何出现在页面可视层次的首要位置

(1)让网站站点成为本页最显眼的内容

(2)让网站ID涵盖页面所有其他元素

4.站点ID需看起来像一个站点ID?---?例如logo

栏目

1.栏目(或称主导航条)是到达站点主要栏目的链接,结构的最顶层

2.大部分情况,持久导航也包括二级导航(当前栏目的下一级栏目清单)的显示位置

实用工具

实用工具是到达网站中不属于内容层次的重要元素的链接

返回主页Home

1.返回主页(Home)的按钮需要始终可见,给用户一种随时可以从新开始的感觉

2.Home的用法

(1)在栏目或使用工具清单中包含一个回到主页的链接

(2)在主页之外的站点ID上小心地加上Home的字样,让用户知道点击它

搜索

1.避免混淆的方法

(1)花哨的用字

(2)指示说明

(3)选项?---?将选项写下来

2.需要对低层次导航给予足够的重视(三级导航)

页面名称

1.页面名称的注意事项

(1)每个页面都需要一个名称

(2)页面名称要出现在合适的位置

(3)名称引人注目

(4)名称要和点击的链接一致

指示器

1.如何标记当前位置

(1)在旁边放置一个指示器

(2)改变文字的颜色

(3)使用粗体

(4)按钮反白

(5)改变按钮的颜色

2.告诉用户你所在的站点层级结构的前后关系(在网页中的位置)

层级菜单

1.告诉用户从主页到当前位置的路径(如何到达)

2.层级导航的最佳实践方式

(1)将它们放在最顶端

(2)使用“”对层级进行分隔

(3)使用小字体(表明是一种补充机制)

(4)使用了文字“你在这里”

(5)将最后一个元素加粗

(6)不需要把它们用作?页面名称

标签

1.为什么标签做导航是一个上佳的选择

(1)它们不言而喻

(2)它们很难错过(视觉上与众不同)

(3)它们灵活

(4)它们暗示了一个物理的空间

2.注意事项

(1)正确绘制?---?激活的标签页在其他标签页之前

(2)颜色编码?---?提高关注度

示例

如何评判一个网站设计的好

这是什么网站?(站点ID)

我在哪个网页上?(网页名称)

这个网站的主要栏目有哪些?(栏目清单)

在这个层上我有哪些选择?(本页导航)

我在导航系统的什么位置?(“你在这里”的指示器)

我怎么搜索?(搜索栏)

第七章:首先要承认,主页不由你控制?---?设计主页

主页主要完成的任务

站点的标识和使命?---?告诉用户这是什么网站,做什么的

站点层次?---?提供服务的概貌,包括内容,功能,服务是如何组织

搜索

导读?---?需要有内容推介,功能推介

友情链接?---?预留空间放置广告,交叉推广,品牌合作

快捷方式?---?最常访问的内容片段值得在网页上放置链接

注册

主页需要满足的抽象目标

让用户看到自己在寻找东西?---?让用于想要的任何东西显而易见

......还有我没有寻找的?---?让用户看到一些精彩的内容,就算这些内容用户没有寻找

告诉用户从哪开始

建立可信度和信任感

主页的常见约束有哪些

每个人都想占一席之地?---?推介内容过多

想要参与的人太多

一个尺寸要适合所有的人?---?普遍适用于大众

主页需要传达整体形象,让用户一眼就能清楚你的网站是说什么的

如何向用户传达网页的整体形象

口号?---?靠近站点ID的地方,整个网站的描述

欢迎广告?---?网站的简要描述,在主页的首要位置,不需要滚动屏幕就能看到

传达信息的原则

需要多大空间就使用多大空间

但也不要使用过多的空间?---?保持简短

不要把实名陈述当做欢迎广告

最后的是进行测试

口号的注意事项

好的口号

不好的口号

清楚、言之有物

含混不清

长度适中,易让用户领会表达思想

太笼统

表达出网站特点和显而易见的好处

把口号(传达某种价值主张)和宗旨(表达某种指导原则,某个目标或某个理想)混淆起来

有个性、生动、有时候很俏皮

由于主页独特的职责,通常不必使用持久导航,它们之间的差异

栏目描述?---?主页需要尽可能多的表现网页内容,其他页面不需要

不同的方向?---?主页和其他页面布局不同,主页通常用

用于表示的空间更多?---?主页上站点ID比较大,口号留有空间也较大

让栏目的名称保持不变,同样的顺序、同样的文字和同样的分组,尽可能多地保持视觉提示,同样的字体,颜色和大小写

下拉框存在的问题

用户必须将它们找出来?---?必须找到下拉框,才能看到下拉列表

它们难以扫描

不好控制?---?下拉列表收缩速度难以控制

下拉框对于组织按照字母顺序排列的项目比较有效

下拉框的优点是节约空间

任何共享的资源(共有区域)都会因为过度使用而遭到破坏?---?在主页上增加更多的项目所得到的的和付出的并不一致,虽然给推荐栏目巨大的访问量,但是让主页变得混乱,所遭受的损失将由所有栏目承担

三、确定你没有做错的几件事

第八章:农场主和牧羊人应该是朋友?---?为什么Web设计团队讨论可用性是在浪费时间,如何避免这种情况

由于各自的职位不同,Web团队成员对于好的网站设计的看法不同

通过测试将讨论对错转移到什么有效、什么无效上,测试会让我们看到用户的动机、理解和反应的不同,从而不再让我们坚持用户和我们的想法相同

第九章:一天10美分的可用性测试?---?让测试简单,这样你能进行充分的测试

焦点小组并不是可用行测试,焦点小组是在项目早期阶段,用来收集用户的意见和感觉

可用性测试主要是希望得到用户是否知道该网站是做什么的,并且能用它完成一项典型任务

测试的作用是什么

如果想建立一个优秀的网站,一定要测试

测试一个用户比不做测试好一倍

在项目中,在点测试一位用户好过最后测试50位用户

人们对招募用户代表的重要性评估过高

测试的关键不是要证明什么或者反驳什么,而是了解你的判断力

测试是一个迭代的过程

没有什么比现场用户的反应更重要

寻找能够反应目标群体的测试用户,但别裹足不前

寻找的测试用户可以和目标群体有差别的理由是什么

差别的原因

例外

实际上,我们都是初学者

如果你的网站几乎只由某一类用户使用,且招募并不难,那就去招募

设计出的网站只有你的目标群体能使用,这通常并不是一个好主意

如果你的目标群体分为几个明显阵营,且各阵营有着完全不同的需求,那你至少要从每个阵营选择用户进行一次测试

专家通常不会介意对初学者来说很清楚的界面

如果使用你的网站需要专业的领域知识,那么你需要在该领域中招募有专业知识的用户

进行招募,需要注意的问题是什么

提供合理的激励

邀请要简单

避免对网站(或网站背后的组织结构)进行预先讨论

别不好意思请朋友帮忙

测试中遇到的问题

用户不清楚概念

用户找不到自己想要的字眼?---?网站用来组织内容的分类不符合用户习惯;分类符合习惯但是没有使用他们期望的名字

内容太多?---?减少页面上的干扰;将需要看到的内容涉及的更加醒目

一些关于问题分类指南

问题

行为(用户/主持)说明

正确解决方式

忽略Kayak(皮划艇)问题

1.出现问题的人马上发现自己偏离了原来的主题

2.用户尽量回到原来的方向而不需要帮助

3.这种情况并没有扰乱用户的活动

可以忽略

抵制添加的冲动

增加一些内容,注释,指导说明

去除某个让人混淆的内容

不要太看重用户对新功能的要求

抓住能够的着的果子

1.恍然大悟型

2.便宜型

尽量实现变更

进行变更

只要你进行改变,就要仔细思考它将会影响哪些内容,当你把某些部分调整的更为突出时,想想是不是把其他内容的重要性降低了

四、大的方面和外界影响

第十章:可用性是基本礼貌?---?为什么你的网站应该让人尊敬

降低好感度的方式

隐藏我想要的信息

因为没有按照你们的方式行事而惩罚我

向我询问不必要的信息

敷衍我,欺骗我

给我设置障碍

你的网站看上去不专业

提高好感度的方式

知道用户在你的网站上想做什么,并让网站明白简易

告诉用户,他们想知道的

尽量减少步骤

花点心思

(1)保证网站准确有用

(2)产生解决我的问题所需要的信息

(3)网站用清楚的方式表达

(4)组织良好,用户可以轻松找到解决方案

知道用户有哪些疑问,并给予解答

为用户提供协助

容易从错误中恢复

如果不确定,记得道歉

总结

这本书主要讲了Web设计的一些核心的原则,以及用户在使用Web时的心理,并且基于用户的信息,来设计Web的导航和主页。并且结合实践,在项目中需要不断的进行可行性测试迭代,从而使Web可行。这样的网站才是一个成功的网站,在符合用户的习惯的基础上,让用户能够自行的解决问题,从而达到网站和用户的目的。

资源类:

大家都知道,学习本身是一个特别耗费时间和财力的事情,但是为了自身发展,却不得不学习,而且现在对于职业教育的课程特别贵,并且专业书籍也是非常贵的。虽然说是投资自己,但是对于生活来说还是较大的开销,因此算是众筹了,毕竟一个课程可能动则几千块,但是我并不贪心,所以分享的课程的价格很低,不会超过5块钱吧,毕竟大家都是为了生活,只希望弥补一点生活压力吧,各位加油吧

链接:在线教育视频课(产品设计)

??pan.baidu.com

提取码:afvs

俞军产品方法论:

链接:

??pan.baidu.com

提取码:lizk

梁宁产品思维30讲:

链接:

??pan.baidu.com

提取码:tr7i

增长黑客:

链接:

??pan.baidu.com

提取码:dpm3

(责任编辑:IT教学网)

更多