《企业资源管理系统.ppt》由会员分享，可在线阅读，更多相关《企业资源管理系统.ppt（97页珍藏版）》请在三一办公上搜索。
1、企业资源管理系统Enterprise Resource Planning,2,人机交互技术,人机交互的概念 人机交互（Human-Computer Interaction，HCI）是关于设计、评价和实现供人们使用的交互式计算机系统，且围绕这些方面的主要现象进行研究的科学。狭义地说，人机交互主要是指人与计算机之间的信息交换，主要包括人到计算机和计算机到人的信息交换两部分。人机界面（Human-Machine Interface，HMI）作为计算机系统的重要组成部分，主要是指人类与计算机系统之间的通信方式，包括人机双向信息交换的支持软件和硬件。,3,人机交互技术,交互设计（interaction
2、design）指的是“设计支持人们日常工作与生活的交互产品”。具体的讲就是关于创建新的用户体验的问题，其目的是增强和扩充人们工作、通信及交互的方式。交互设计主要研究如何确定人机通信的方式人机界面，侧重于人机交互通信方式的设计过程和设计方法，而人机交互技术则侧重于研究这种通信方式如何用软硬件实现。,4,人机交互技术,人机交互的相关学科 认知心理学研究人的高级心理过程，主要是认识过程，如注意、知觉、表象、记忆、思维和语言等，从心理学的观点研究人机交互的原理。人机工程学 人机工程学是运用生理学、心理学和医学等有关知识，研究人、机器、环境之间的合理关系，以保证人们安全、健康、舒适地工作，从而提高整个系
3、统功效的新兴的边缘科学。,5,人机交互技术,多媒体技术一般地，多媒体技术是指将文本、声音、图形、静止图像、动态图像等与计算集成在一起的技术。虚拟实现技术虚拟实现（Virtual Reality，VR）就是借助于计算机技术及硬件设备，建立高度真实感的虚拟环境，使人们通过视觉、听觉、触觉、味觉、嗅觉等感官在其中看、听、触、闻起来像真实的，以产生身临其境的感觉的一种技术。,6,人机交互技术,人机交互的研究内容人机交互界面表示模型与设计方法（model and methodology）可用性分析与评估（usability evaluation）多通道交互技术（multi-modal）认知与智能用户界面
4、（recognition and intelligent user interface）虚拟环境（virtual environment）中的人机交互Web设计（Web-interaction）移动界面设计（mobile and ubicomp）群件（groupware）,7,人机交互技术,人机交互在网站设计中的运用网站设计可以看成人机界面设计的一种，通过网站界面，人与计算机即展开了交互的过程。把人机交互技术运用在网站设计中，可以对用户有更深入的了解，从心理学，工程学方面来考虑用户的使用感受，将设计出更贴近用户的网站。视错觉阅读关注感知和识别 学习,8,网站设计方法 网站的定位,产品定位把网站
5、作为一个互联网产品，其定位首先要确定面对的人群是什么。在考虑网站的产品定位的过程中，必须先考虑以下几个问题：产品的条件是什么？它具有哪些优势和特色？产品是否能满足一部分人的需求？产品收益来自于哪里？它的运作模式是怎样的？产品的阶段性目标是什么？在实际操作中，网站的产品定位多数是由创办人的主观意向决定的，但一定通过较全面的考虑，并具有一定的社会基础，或是为解决社会中的某一突出问题。一旦确定了产品定位，就可以对产品的各方面属性提出具体的要求，制定出详细的目标计划和测评标准。,9,网站设计方法 网站的定位,企业与品牌定位企业定位是指企业通过其产品及其品牌，基于顾客需求，将其企业独特的个性、文化和良好
6、形象，塑造于消费者心目中，并占据一定位置。企业定位是个较模糊的概念，其主要表现为品牌形象。对于网站的定位，则更偏向于品牌形象的塑造。品牌定位是指企业在市场定位和产品定位的基础上，对特定的品牌在文化取向及个性差异上的商业性决策，它是建立一个与目标市场有关的品牌形象的过程和结果8。,10,网站设计方法 网站的定位,市场定位？产品、品牌的定位都离不开市场，市场才是网站真正能够生存的因素。要确定市场在哪里。人是市场的主要因素，但不是有人就有市场。要在不同阶段选择不同大小的人群。,11,网站设计方法 网站的定位,设计定位 设计定位作为一种设计策略,将模糊的需求清晰化,限定设计活动的范围,使设计师可准确快
7、速的设计出有特色的产品,以达到与竞争对手区分并吸引消费者注意的目的,并可塑造出产品或品牌的自我优势 9。,12,网站设计方法 网站的定位,13,网站设计方法,明确网站主题明确网站的主题至关重要，如建立网站是为了销售产品，还是为了进行商业服务。网站的目标用户是哪些，他们能从网站上的到些什么信息。打算从网站中获得怎样的回报。,14,网站设计方法,分析网站材料网站材料的分析，一方面能够帮助分析客户的资料，对网站将要传递出的文化内涵有一个初步的了解，同时，当客户提供的资料不足时，可以给予正确的反馈意见。另一方面，当设计者对行业有了一定的认知后，能对同类网站有较好的鉴别。同类的网站并非都是优秀的，从设计
8、形式到内容编辑，均有优点和劣势，吸取同类网站的长处，更能帮助网站设计人员找出自己的优势，进一步明确自己网站的主题。,15,网站设计方法,确定目标用户目标用户是指接收并理解网站建设方通过网络媒介传递的信息的个体。用户和目标用户并不相同，用户仅仅指点击了这个网站的个体，他可能只是无意中浏览了这个网站，并在快速的浏览之后关闭了浏览器，而目标用户却是网站真正想要传达其思想的个体。网站不可能使每一个用户满意，但至少要做到使目标用户满意，更好的结果是通过好的网站设计能把用户转变为目标用户。,16,网站设计方法,分析用户的普遍性 分析目标用户的特殊性用户并不是越多越好目标用户模型,17,网站设计方法,确定用
9、户需求 需要产生需求根据用户的需求设计网站需求类型如何确定需求,18,网站设计方法,创建与管理网站信息创建信息信息的来源主要是针对目的而言，要明确对于网站的主题来说，哪些信息是必须有的，哪些信息是希望有的，哪些信息是可以没有的。必须有、希望有、可以没有的信息，表明了它们对网站的重要性。编辑信息信息编辑是网站编辑的工作，形式与内容大有学问。在琳琅满目的互联网上充斥着海量信息，要想一下子找到对浏览者有用的信息并不容易，所以作为网站设计者，想要尽快地抓住浏览者的眼球，信息标题和信息摘要就成为了最关键的一环。,19,网站设计方法,网站策划网站策划，不仅要考虑网站的主题、定位，还要涉及相应的分析调查、硬
10、件预购、执行流程、人员分配等具体事宜。根据每个网站的背景及建设实力等不同情况，策划书的内容也需要做相应的调整。,20,网站设计方法,（1）背景介绍（2）市场分析（3）建设目的及网站定位（4）技术解决方案（5）内容规划（6）页面设计（7）流程及人工（8）网站维护（9）发布与推广,21,网站设计方法,设计网站 网站设计主要包括导航、版式、色彩、风格等与视觉设计密切相关的网站元素。网站设计不仅要考虑视觉上的美观，还要结合可用性来共同设计。,22,网站设计方法,网站设计要点用户通常是扫描网站，而非仔细阅读尽量使用习惯用法实现网站的可访问性让用户随时了解系统的状态给予用户自主权和控制权提供错误预防功能和
11、纠错功能兼容不同的浏览器,23,网站设计方法,测试网站可用性,24,网站元素设计,网站元素设计,25,网站元素设计,菜单网站中最直接的导航方式，一般分为横向、纵向两种，可以有二级菜单项（一般不超过2级）。网站为了体现其某些（时尚）元素和独特风格而常使用flash来制作菜单以达到绚丽的效果。设计样式将菜单分为四类。,26,网站元素设计,传统菜单所谓传统菜单，是指最简单的一行或一列菜单项，直接点击链接到目标地址。这类菜单具有简单、清晰的特点，因其菜单项只有一排，链接数量有限，只适用于分类较少的网站。传统动态2级菜单,27,网站元素设计,伸缩式菜单 伸缩式菜单是指将菜单做成类似树形展开/合拢的效果，
12、但只限于2级菜单。伸缩式菜单通常在纵向菜单中使用，常见的是用在网站后台管理的左侧菜单上，也会在商城的会员中心或产品分类中使用。列表式分列式自动罗列式,28,网站元素设计,列表式：通常在产品品牌分类中使用，品牌名称比较长，品牌之间既是同等的又有销量排名之分，用一列显示可以较灵活地满足需求。分列式：将子类分成两列或多列显示，通常为横向分类，即类与类之间没有共同点，只是同属于一个大类而已。分类名称短且无关联，以一种整齐清晰的方式列出，既容易查找又无需担心排列的顺序。自动罗列式：将子类依次列出，由外层控制菜单宽度，由浏览器自动换行。这种方式主要用于横向分类不明显、类与类之间有相似交叉且类名长度不确定的
13、情况，既不浪费空间，又可以抵御样式表加载失败而导致排版混乱的风险。,29,网站元素设计,30,网站元素设计,组合菜单所谓组合菜单，可以理解成用各种不同的方式方法灵活设计出来的菜单。这里说的各种不同的方式方法，包括纵向的、横向的、静态的、动态的、排列的、自动的、文字的、图文并茂的，只要是能达到好的效果都可以拿来用，就看如何将它们灵活地组合起来。,31,网站元素设计,32,网站元素设计,形象菜单使用形象菜单的好处：用小图标来标识，并加以文字说明，使表达的内容更加清晰，也使用户更加容易找到。因为形象思维比逻辑思维更易辨别和记忆。日历式搜索导航 游标式导航 动态视觉焦点导航,33,网站元素设计,34,
14、网站元素设计,四种菜单比较,35,网站元素设计,导航导航给了浏览者一些固定的感觉，它告诉我们当前的位置，通过层次结构的可视化，导航可以告诉我们网站上有什么，导航表现了内容。导航还告诉了浏览者如何使用网站，它会含蓄的表达该从哪里开始，能进行哪些选择。,36,网站元素设计,导航设计要点：（1）导航应该是持久的在网站的每一页中以相同的外观出现在相同的位置，这样会让浏览者确认自己仍然在这个网站上，这一点非常重要，并且可以使整个网站保持一致的风格。（2）在导航中突出显示当前位置。要抵消浏览者在网络中固有的空间迷失感，需要在导航中标明当前所在的位置（3）导航的风格将对页面整体风格产生极大影响。（4）网站可
15、以存在多个导航。,37,网站元素设计 导航栏,导航条的目的是让网站的层次结构以一种有条理的方式清晰展示，并引导用户毫不费力地找到并管理信息，让用户在浏览网站过程中不至迷失。本文所指的“导航栏”，不是“菜单”的含义，正如“导航条”的定义一样，这里突出的是网站的层次结构，即能完全体现并引导分级查找的导航工具，换言之，导航栏就是网站的“目录索引表”。,38,网站元素设计 导航栏,树形导航栏最常见的导航栏形式应该是BBS的树形导航，通常BBS除了美观的网站式的模板外，通常还有一个简洁的导航式模板。层次清晰；结构完整，覆盖全面；伸缩自如，可观性强；即时定位，查找便捷。通常论坛还提供收藏、书签等功能，将这
16、些功能整合在导航栏中，用户就能随心所欲地浏览其关心的内容了。,39,网站元素设计 导航栏,隐藏导航栏隐藏导航栏不是指导航栏的布局特征，而是指它的存在形式。顾名思义，就是把导航栏隐藏起来，放在日常工作区域之外。在软件的人机交互理论中有这么一条公理：为典型的导航调整界面。那么，在Web设计时，同样要考虑导航的界面问题。网站的最终目的不是让用户来使用这些导航工具，而是让用户最大效率地从网站上得到想要的信息。因此，在界面设计上就要把更多的空间留给网站的主体内容。这里列举三种隐藏的方式：伸缩式 隐藏式简略式,40,网站元素设计 导航栏,41,网站元素设计 网站地图,网站地图是一个网站所有链接的容器。它为
17、所有的搜索引擎程序提供食物。网站地图应该要包括网站的主要网页的内容链接或者栏目链接。根据网站的规模大小，页面数量的多少，它可以链接部分主要的或者所有的栏目页面。搜索引擎程序得到网站地图页面，就可以访问站点地图上提供的所有网页及栏目。,42,网站元素设计 网站地图,结构式地图 结构式地图，是以树型结构为骨架组织的网站分级内容链接图，它将网站的主体结构清晰地展现出来，有助于用户了解整个网站的组织关系，也更容易根据层级找到相应的链接，如图 216所示。分层结构清晰同级排序自然数据易读易维护便于搜索引擎检索,43,网站元素设计 网站地图,44,网站元素设计 网站地图,列表式地图列表式地图是以目录形式列
18、出网站的模块结构。从用户的视觉习惯角度而言，列表式的地图因为是目录形式，相比于结构式地图，可能更易于被用户接受，毕竟人们从小自接受学校教育开始就习惯了书的目录查阅方式。从页面的美观角度而言，列表式地图也比结构式地图显得更加规整、悦目。从网页的设计与开发角度而言，列表式更便于用块元素来展现，也更易于网页的排版设计。,45,网站元素设计 网站地图,46,网站元素设计 网站地图,连通式地图连通式是最复杂的一种地图展示方式，却也是最真实体现网站内链接关系的方式。比如，网站首页可以链接到其下所有的频道首页，频道1的首页可以链接到其下的所有栏目，网站首页有某一专题的链接入口，同时该专题又属于频道1中的内容
19、，等等。这些关系都要在连通式地图中展现，换言之，网站的连通关系即为以链接为关系纽带而形成的网站内容的关联。,47,网站元素设计 网站地图,48,网站元素设计 网站地图,连通式地图具有以下几点特征：层次表现形式不明显双向链接跳级链接多维层次结构,49,网站元素设计,主页主页是一个网站的门面，网站的风格从主页就可见一斑，因此主页的最重要的工作就是要传达网站的整体形象，使浏览者看一眼就可知道这个网站是干什么，想要表达什么。,50,网站元素设计,主页设计要点：（1）主页中可以完成的任务：网站的标识、网站层次、搜索、导读、内容更新、友情链接、快捷方式、注册、建立可信度和信任感。以上这些内容组成了网站的整
20、体形象，都有助于帮助理解这个网站是做什么的。（2）主页布局分配要合理。,51,网站元素设计,版式布局在浏览器空间中，按照一定的视觉表达内容的需要和审美的规律，结合各种平面设计的具体特点，将信息内容和页面视觉元素加以组合编排，就是网页版式布局。版式布局设计要点：（1）版式布局可带有创新。（2）网站布局与信息量多少有关。（3）版式布局一致性。,52,网站元素设计,色彩鲜明的色彩具有引人注目、打动人心的力量。当色彩吸引了浏览者的视线后，色彩所表现的形象和内容等一切信息也同时进入了浏览者的脑海中，能起到先声夺人、快速传递信息的作用。借助于色彩的不同处理，使网站易于人们认知识别，有助于创造个性的网站形象
21、，从而起到强化信息记忆，使网站形象深刻的作用。,53,网站元素设计,主色在网站上，面积最大的色彩为网站的主色调，主色调贯穿网站中所有的页面，出现次数最多。主色调在创造特定的气氛与风格上发挥主导作用。例如以红色为主色的网站，多给人热情、积极和温暖。而以蓝色为主色的网站却使人联想到智慧、诚信和高科技。辅色主色掌控整个画面色彩气氛，而辅色面积小，起强调或缓冲的作用。起强调作用的辅色是空间中动感和活力的来源，还可以因其使主色在整个网页中得到连贯。辅色一般为醒目突出的色彩。,54,网站元素设计,色彩设计要点：（1）以传达信息为主来设计网站色彩。网站配色的重点在于形象与色彩、主色与辅色、主色与背景色配合得
22、当，同时兼顾与图片信息和动画信息中的色彩。以传达信息为主的用色可以从网站本身主题来考虑，力求发挥最大的吸引力，从而起到快速传达信息的目的。（2）可与企业的标准色（形象色）联系设计网站。对于具有形象色的企业网站，要强调其形象色时，可以再网站用色上需用与形象色有关的色彩，这样能给人以深刻的印象，让浏览者在不知不觉中接受了商品或企业的信息。例如，可口可乐公司的网站（）。,55,网站元素设计,口号口号是一条精炼的短句，刻画了整个企业，总结它是什么，什么让它如此卓越。在网站上，口号可能出现在站点ID的下方、上方或旁边，告诉浏览者为什么他们应该待在这个网站。口号设计要点：（1）口号要清楚、言之有物，切忌含
23、糊不清。口号是非常有效的信息传达方式，它是用户最希望能找到关于网站目标具体描述的地方，一个口号如果是含糊不清的，那么就不能体现网站的目标，也会给用户留下模糊的印象，这样的印象，对于建立网站形象是没有益处的。,56,网站元素设计,（2）口号长度要适中。太短的口号信息太少、含糊不清。太长的口号又不容易让人记住。口号可以选用短语的形式，而非句子的形式，突出重点词汇，省去不必要的助词和动词等。（3）口号应出现在正确的位置。口号可以放在站点ID的附近，甚至作为站点ID的一部分，使浏览者能够把口号和站点ID联系起来。,57,网站元素设计,站点ID站点ID即网站的LOGO，它代表了整个网站，就好像是徽标或者
24、商标，有着其独立的识别性和显著性。浏览者应该一眼就可以分辨出一个网站的站点ID和其他网站的站点ID的区别。站点ID设计要点：（1）站点ID应该出现在页面可视层次的首要位置。可采取两种方式：一是让站点ID成为本页最显眼的内容，二是让它涵盖页面所有其他元素。可以把站点ID放在页面的左上方这是用户最习惯的放置站点ID的位置，这样站点ID就可以涵盖整个页面。（2）站点ID看起来应该像一个站点ID。它应该是平常看到的商标标志一样：一种独特的字体、一个可以识别的图形、或两者的结合，它的大小应该从按钮到广告牌大小不等。,58,网站元素设计,搜索据调查，喜欢搜索的用户比喜欢浏览的用户更多，因此除非站点规模非常
25、小而且组织的很好，否则每个页面都应该有一个搜索框。搜索设计要点：（1）避免花哨的用词。用户会寻找“搜索”这两个字，因此最好使用“搜索”这个词，而不是“查找”、“快速查找”、“快速搜索”、“关键字搜索”等，这几乎已经成了用户的习惯用法，打破习惯并不是一个明智的选择。（2）慎重设置选项。为搜索设置选项会存在混淆搜索范围的可能性，最好的做法是不提供搜索选项，这样的搜索更有灵活性，且更符合用户对搜索的理解。（3）对搜索结果页面的条目进行排序。（4）明确告知没有结果的搜索。,59,网站元素设计,面包屑导航面包屑是网站的一种层级菜单 面包屑设计要点：（1）将最后一个元素突出显示。面包屑导航的最后一层就是当
26、前页面，将它突出显示可以告诉用户“你当前就在这里”。最后一层的突出显示还可以使之充当当前页面的名称。（2）使用“”对面包屑导航层次进行分割。,60,网站元素设计,页面名称页面名称就是网站的路牌。和路牌一样，如果熟悉的话浏览者根本不会注意页面的名称，但是一旦浏览者在网站中迷失方向，就需要页面名称来确定在网站中的位置。页面名称设计要点：（1）每个页面都需要一个名称。和每一个拐角都需要一个路牌一样，每个页面应该有一个名称。有时候设计者会认为在导航中突出显示当前所在位置，或在页面中已经有了面包屑导航，这些已经够了。这不无道理，但是上面所说到的这些只是表示当前位置的辅助措施，用户想要知道当前在网站中的位
27、置，还是会习惯去寻找页面名称。（2）名称要引人注目。页面名称需要结合位置、字体大小、颜色和留白突出体现“这就是整个页面的标题”，在多数情况下，应该是页面中最大的文字。切勿使页面名称和正文的字体大小相同或相近。,61,网站元素设计,链接链接设计要点：（1）明确表示可以点击的地方。（2）链接下划线在必要的时候出现。（3）尽量避免指向当前页面的链接。,62,网站元素设计,表单表单是网站交互的最基本方式。表单由数据输入框、控件、标签和动作按钮组成。表单可以是单一的搜索框，也可以是多页面的调查问卷形式。表单设计要点：（1）帮助用户输入数据。设计表单和控件时应该尽可能地帮助用户输入数据。（2）使表单带有容
28、错性。（3）使用“label”标签。当使用label标签的for属性时，可以把label绑定到拥有相同name的控件，这样，当点击label的时候，焦点会显示在相应的表单项上。,63,网站元素设计,插图 网站的插图虽然是美化信息，但是它的存在并非可有可无。一方面插图可以帮助浏览者理解和认识色彩，另一方面有利于建立轻松愉悦的阅读环境，营造有亲和力的画面。除此之外，插图的内涵与网站传达出的文化内涵相符合，这就能帮助表达某些只能意会无法言传的信息。,64,网站元素设计,插图设计要点：（1）插图要配合网站的信息。选择插图的时候要考虑网站的信息表示，不能仅考虑美观就胡乱选择与信息无关的插图，如果浏览者被
29、插图吸引了全部的注意力，将有碍于传达文字信息。（2）为每张插图增加alt文本。alt是img标签的一个属性，它为图片加上了描述性文字，这样可以使网站的可访问性加强。因为并非所有的用户都可以看见图片，当一位盲人使用屏幕阅读器来浏览网站的时候，他没有办法浏览图片，但是通过alt属性，他可以知道这里存在一副图片，并且知道这幅图片是干什么的，有什么作用，想要表达什么。,65,网站元素设计,下拉框下拉框已经成为了一个广泛使用的导航工具，这主要是因为它能够利用有限的地方来节省屏幕空间，但是下拉框也存在缺点：浏览者必须点击下拉框，才能看到下拉列表，因此，列表上的项目不可能在浏览者扫描页面的时候就看到，当设计
30、者想在页面上展示内容的时候，最好不要使用下拉框，即使它能节约空间。,66,网站元素设计,下拉框设计要点：（1）下拉框切忌太长。如果下拉框太长，菜单的列表就越长，它就越难以控制，用户在列表菜单上上下移动的时候，越可能找不准位置。尤其当下拉菜单需要使用滚动条的情况下，浏览者不可能一次看到所有的选项，那么在滚动的时候，他可能已经忘记前面看到的某些选项了。（2）对下拉菜单排序。下拉框对于组织按拼音或字母排序的项目来说最有效，例如国家、省份或产品名称，在这个时候，用户只需要移到某一特定位置就可以看到他想要的选项，而不需要浏览整个菜单项。,67,网站定位与交互设计,68,四个核心问题,如何定位和建立时尚网
31、站的自主风格？,如何设计一个高效的导航系统？,如何体现和增强网站的互动性，改善用户体验？,如何解决商业目的与用户预期的矛盾？,69,问题,一般成规模的网站都具有海量资讯，因而也产生了设计上的许多痹病，如：首页内容过于繁杂色彩花哨，搭配不协调内容分散且质量不高分类太乱，不易查找广告与无关链接太多正文版面小，翻页麻烦内部结构不统一,70,问题,网站的风格、定位以及交互设计的一系列问题，其中的核心问题有：如何定位和建立时尚网站的自主风格；如何解决内容多而链接结构复杂的问题，即如何设计一个高效的导航系统；如何体现和增强网站的互动性，改善用户体验；如何把握用户的心理，解决商业目的与用户预期的矛盾。对于这
32、些问题的研究涉及多个学科，包括设计心理学、市场行为学、信息处理学、工程学、行为学、计算机科学、社会科学、人机交互等。,71,网站定位与导航设计,一个网站的定位对其设计、内容、运营模式、推广策略等都起着决定性的作用。要解决网站的设计问题，就必须先确定网站的定位。网站的定位产品定位企业与品牌定位市场定位设计定位,72,辅助导航设计,导航系统设计的关键在于了解用户在任何一个既定位置上的信息需求量有多少，并不是说一次提供的可能选择越多越好，重要的是弄明白一个用户为什么来到某个特定的页面以及从这里他可能还想去哪里7。菜单、导航栏、网站地图作为主要的导航工具，虽然能够为用户提供很大的帮助，但无法满足用户对
33、于内容筛选、访问路径定位、个性导航的需求，因此网站还需要更多的辅助导航功能。,73,搜索,搜索搜索会告诉使用者最短最直接的路径。站内搜索分类搜索关联搜索自定义搜索,74,搜索,站内搜索类目搜索全局搜索 类目搜索在网站中，通常分有频道、栏目、专题等，除网站首页外，各类都有较明确的归属对象，如栏目属于频道下级分类。在导航系统设计中，必须明确这些层级关系，并且应该提供在任何地点任何范围的搜索服务。,75,搜索,76,搜索,全局搜索全局搜索是指在整个网站范围内搜索需要的内容。通常全局搜索设置在网站首页或相对较高级的目录首页中，例如频道首页，而全局搜索的位置是相对固定的，比如页面的右上角，而且作为全局的
34、搜索入口，在设计页中会使用模版来实现，以达到不同层级全局搜索入口一致的目的。对于资讯类网站来说，因其分类众多，层级关系复杂，全局搜索很少在网站的首页出现，考虑到用户对时尚网站的随机浏览的习惯特点，使用类目搜索+全局导航已基本可以满足时尚资讯网站访问用户的需求。,77,搜索,分类搜索 分类搜索也是在本网站的范围内进行搜索，之所以将它与站内搜索分开来讨论是因为它不是简单地根据网站内容层次结构来进行搜索，而更偏向于横向的分类搜索，它不受网站目录结构的限制，虽然有时候网站的目录结构就是根据分类来设定的。分类搜索，通常与高级搜索或者综合搜索联系在一起，它不是一个独立的搜索功能，而是多个搜索项的组合，只能
35、缩小内容的搜索范围，因此可以把它看作是站内搜索的扩充。,78,搜索,淘宝网的高级搜索页面,79,搜索,关联搜索关联搜索就是搜索有相关度的内容。其实搜索的基本功能就是关键字搜索，一般不加说明则表示全文搜索，关键字就是用户提供搜索条件的关联信息，因此广义上讲，搜索都是关联搜索。但是关联有不同的性质，比如标题关联、标签关联、语义关联等等。这里指的是狭义的关联，对于一个网站而言，其内容的关联可以通过内容标签来完成。,80,搜索,自定义搜索 搜索引擎，Google、百度等。,81,链接及URL解码,长链接与短链接传统的链接以标签来表示，其中href属性用来设置链接的URL地址，对于纯静态的网站来说，其内
36、部链接的href指向的均是网页的实际URL地址，可完全表示该链接目标网页对于网站根目录的相对路径，这里将这种以实际URL地址为目标属性的链接称为长链接。从长链接的定义中可以推出短链接的定义：通过地址解析的方法将一个较长的实际URL地址转换成较简短的URL地址的链接，通过短链接的href无法找到该网页实际的所在位置。短链接的解析过程只能在动态网页中实现。,82,链接及URL解码,统一链接统一链接，就是将网站的链接用一种相对统一的方式进行管理和维护。正如上一小节中所说，短链接使网站结构变更的维护变得较为简单，短链接就是统一链接的主要思想，犹如经脉一通百通。这里分别就时尚网站中的文章、商城、活动三大
37、模块来讨论如何实现链接的统一。文章类 电子商城 活动,83,链接及URL解码,面包屑跟踪器面包屑跟踪器，是大部分网站都会使用的工具，它是一种层级菜单。它的英文名为“Breadcrumb”。其一般表现形式如下：首页 频道1 栏目1 文章标题从它的表现形式可以看出，它是以层级组织结构为基础显示当前访问页的所属关系。用“面包屑”来命名它是再合适不过了。通常除末节点的文章标题外，其上所有层级的节点均是可以点击链接的，用户不仅可以通过它了解当前所处的位置，还可以随时回到上一级乃至网站首页。这可以说是一种很典型的导航工具。,84,链接及URL解码,固定层级显示通常情况，“面包屑”的显示是以内容数据的层级关
38、系为基础的，而这些关系是在网站设计时就固定下来的数据结构，也就是说一旦内容录入后，它所在的层级关系就已经定下来了，不管用户是从哪里进入该内容页，该页上的“面包屑”显示是固定的，它不受用户行为影响。,85,链接及URL解码,全路程跟踪从格林童话的汉赛尔与格莱特故事中知道，“面包屑”最初的目的是为了“追溯来路”，它利用了“历史记录”的方式。固定层级显示的“面包屑”只是一种由点连成线的线性结构，然而网站的结构并非简单的线性层级关系，而是一种复杂的网状多向连通图，尤其对门户网站更是如此。那么，如何解决这种网状多向连通的问题？还是像有人提出的一样要“打倒面包屑 14”？或者能否找出一种新的方式让用户的行
39、为参与到其中而使它变得更加灵活呢？既然“面包屑”的初忠是人为的为了“追溯来路”，那么应该先考虑怎样才能真实地记录“来”的历史。,86,交互设计,网站从静态页面开始发展至今，已经不是简单的信息窗口。从Web1.0主要通过浏览器获取信息，到如今的Web2.0更注重用户的交互作用，Web2.0将用户同时作为网站内容的消费者和制造者。时尚商业网站，虽不像SNS网站那样纯粹地提供一个用户交流的平台，但要抓住并发展新用户，保持相对稳定的消费群体，对于用户的交互体验是不可忽视的。,87,交互设计的目标,交互设计的目标有两个：一是可用性目标，二是用户体验目标。,88,可用性目标可行性有效性安全性通用性易学性易
40、记性,89,可用性目标概念化，就会得到一些可用性原则：让用户随时了解系统的状态系统应与真实世界相符合结予用户控制权和自主权提倡一致性和标准化帮助用户识别、诊断和修复错误预防错误依赖识别而不是记忆强调使用的灵活性及有效性最小化设计提供帮助及文档,90,让用户感到满意,让用户感到满意，就是一切为用户所想，充分考虑用户的需求，把用户想到和没想到的都考虑到了，并为此提出合理的意见和建议，这样一定能使用户感到满意。对于时尚网站，主要应注意以下几个方面：人性化设计、默认处理以及有效的导航标识。,91,人性化设计 给出明确的目标，循序渐进及时给出友好的提示设置默认输入有效的导航标识,92,默认处理默认处理，
41、即当用户不作为时为系统提供初始值或默认状态。在人性化设计中，已经提到应该为大部分用户最可能的操作选择事先设置默认值，从而减少用户的操作步骤。网站登陆界面 工作流设置默认状态,93,有效的导航标识网站的用户体验很大程度上取决于导航系统的高效性，因为导航标识能告诉用户这里能做什么或者提供什么样的服务。“为了找出用户的需要，我们不能简单的问：你需要什么？然后提供它，因为人们未必知道什么是可能的，有些需求甚至可能是用户做梦都不曾想到的。5”因此，网站要比用户想得更多，并为所有的功能提供明确、高效的导航及说明。,94,趣味性与启发,如果说“让用户感到满意”使网站能够留住现有的用户，那么“趣味性”使网站能
42、够吸引更多的用户。趣味，是一种令人感到愉快并能产生兴趣的特性，它的存在使人由对事物的一个点感兴趣而逐渐衍生到对这整个事物都感兴趣。,95,美感,美感是审美活动中对于美的主观反映、感受、欣赏和评价22。美感不是作为某种孤立的体验而出现的，它是多种体验交织而成的一种整体感受。这一感受的产生，可能是由于观赏艺术作品，也可能是因为面对自然景象。人们美的感受的水平以及内容丰富的程度决定于被感受事物的性质、特点以及受其刺激的强烈程度。23网站的美感主要体现在界面的明朗、布局的平衡、色彩的协调、内容的流畅，从而形成了网站特有的美的风格。一般说来，不同时代、阶级、民族和地域的人，美的标准是有差异的，而个人与个
43、人之间也会因文化修养、个性特征等的不同而形成美感的差异性。因此，网站应针对特定的用户群设计符合其审美观的界面风格。比如设计一个女性购物网站，就需要考虑这类用户群体（其主要用户为女性群体）的审美共性：喜欢较温馨、可爱、时尚的视觉效果，比较感性，那么网站可以以粉色作为主色调，界面尽可能清新亮丽些，而图标则可以做成卡通或很Q的样式。,96,成就与情感满足,网站的用户体验的最高境界就是情感满足。这是从人的心理需求出发，营造一种好的氛围，让人产生一种归属感，而这种归属感来自于本位互动与个人价值的体现。本位互动，是指用户作为主要合作者参与互动过程。个人价值体现，则在于网站能够提供一个个人的展示平台，让用户也能体验到聚焦的感觉。让用户参与互动，是Web2.0主导的体验模式。像博客、播客、维客、掘客、换客、印客、试客等一系列以“客”命名的互动性网站，“客”就是网站的主人，网站的所有空间都是为“客”而设的，用户在这里可以随心所欲、畅谈无限，充分地发挥了“客”的主动性和创造性，同时也让用户感到了交流互动、体验分享带来的个人价值的满足。,97,创意视觉引导与交互,找到熟悉的感觉巧用心理暗示启发与激励视觉牵引力焦点与放大镜,
