




已阅读5页,还剩6页未读, 继续免费阅读
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
门户网站有很多种。最为国人熟知的是象新浪搜狐那种信息类门户。主要以广告收入为主。现在也有博客门户等。象当当、淘宝那样的购物平台,其实也是一种门户,只不过陈列的是商品信息,赢利方式是依靠出售商品。不同的门户,有不同的需求,都应该根据这些需求出发去设计网站,这是众所周知的,但是它们之间也有共性,那就是都要求提高浏览效率!促使网站达成赢利目标。信息类门户:1.网页的体积最小2.分类明确,多方向引导3.信息量最大4.风格一致,易于管理5.以适当的方式提供多种多样的广告位6.分栏目设计突出主题风格购物类门户:1.网页体积尽量小2.分类明确,多方向引导3.信息根据重要程度疏密有秩4.每一个页面信息都是一种广告方式5.突出商品本身6.分栏目设计突出主题风格一、网站风格/创意“风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。整体形象包括站点的版面布局,色彩,字体,浏览方式等。如:我们觉得迪斯尼是生动活泼的而IBM则是专业严肃的。每一个网站都会给人们留下的不同感受。这里我们需要做到的是根据网站的定位做出网站特有的风格。除此我们还需要在风格同一上需要把握一下,其实这个风格的统一和传统的印刷出版物没什么区别。你网页上所有的图像、文字,包括像背景颜色、区分线、字体、标题、注脚什么的,都要统一风格,贯穿全站。这样子用户看起来舒服、顺畅,会对你的网站留下一个“很专业”的印象,有一个全局感受。创意,所谓创意就是不拘一格?某些设计师在做创意的时候大费周章,做出来确实不可否认很有创意、很别致,但往往对于行业网站的客户为什么不能接受呢?此时不要太责怪客户的不识货,应该反思,抓住客户的需求。其实做行业网站不需要很多大的创意,也不要浪费过多的时间去追求如何个性、如何好看,我们只需要一点小小的创意贯穿全站,也许会使网站更生动更具有吸引力、更有思想。”不要在页头用大面积的装饰图片来体现整个网站的风格门户网站构成很复杂,通常会兼并、嵌套很多小网站。网站的经营方当然希望让这些小的网站套用整个门户的VI。所以,在使用最频繁的页头部分,应该是能够很明确的标识网站风格的地方。但是,不要用大副的装饰图片来体现,LOGO?LOGO是干什么用的?设计时的出发点是什么?不就是标识企业突出门户风格吗?如果LOGO不能起到这样的作用,那还要它做甚?所以为了浏览速度快,最好页头只有LOGO、文字导航、简单色彩装饰。我建议页头最好是可以宠满页面的,没有宽度限制,这样就能够适应各种宽度的网页了。不要制作过多过大的图片镶嵌在网页中,如大片的没有意义的装饰图片,别忘了你是在做一个门户!有商业目的的门户!这是在做生意!如果你做生意老板会批给你很多钱去做些对销售没有帮助的事吗?也许他会批给你钱组织员工去旅游,用于提高士气,但是他绝对不会批给你钱带所有员工去冰岛,并盖一个希尔顿饭店!二、网站LOGOLogo顾名思义就是站点的标志图案,logo最重要的就是用图形化的方式传递网站的定位和经营理念、同时便于人们识别。网站logo的设计过程中一般有以下三种思路:1.直接以网站网址作为logo。2.根据网站提供的产品/服务特点展开logo设计。3.以传递网站运营商的经营理念为特色。我个人建议门户网站的LOGO中最好包含:网址(去掉WWW及网址后缀)中文标识辅助图形标识。辅助图形标识能够最好的体现网站风格,变化多样。网址和中文标识的设置要清晰易用。最好独立创建一套字体,但最好跟常见字体相差不太大。便于应用在子栏目中。三、视觉流程“人们在阅读某种信息时,视觉总有一种自然的流动习惯,先看什么,后看什么,再看什么。在心理学的研究表明,一般的浏览习惯是从上到下、从左到右,在一个平面上,上松下稳而压抑。同样,平面的左松右稳。所以平面的视觉影响力上方强于下方,左侧强于右侧。这样平面的上部和中上部被称为“最佳视域”,也就是最优选的地方。在网页设计中一些突出或推荐的信息通常都放在这个位置。左侧为常规信息,右侧为推荐信息。当然这种视觉流程只是一种感觉并非一种固定的公式,只要符合人们的心理顺序和逻辑顺序,就可以更为灵活地运用,在网页设计中,灵活而合理地运用直接影响到传达信息的准确与有效性。”四、网页框架与布局网页布局大致可分为“国”字型、拐角型、“T”字型、“L”字型、综合框架型、Flash型、变化型,在这里就不做一一论述了。其实在我们在做设计的时候并没有过多的去考虑什么形式,比如我们在一张纸看到一个圆形的东西,很容易可以联想到它像太阳,而有些人则联想到月亮等等这都是一种形式比喻,最重要的是抓住客户的需求,把握网站的定位做处合理的框架布局。1分辨率网页的整体宽度可分为三种设置形式:百分比、象素、象素+百分比。通常在网站建设中以象素形式最为常用,行业网站也不列外。我们在设计网页的时候必定会考虑到分辨率的问题,科技发展到现在我们通常用的是1024*768和800*600的分辨率,现在网络上很多都是用到778个象素的宽度,在800的分辨率下面往往使整个网页很压抑,有种不透气的感觉,其实这个宽度是指在800*600的分辨率上网页的最宽宽度,不代表最佳视觉,不妨试试760770的象素,不管在1024还是800的分辨率下都可以达到较佳的视觉效果。并且,针对你的目标用户,你可以采用不同的分辨率标准,比如购物网站的用户,通常都是比较适应网络生活,有一定经验的网民,他们的显示器通常会比较先进,象目前就可以采用最低1024*768分辨率。如果你面对的目标用户,行业不固定,也许有相当一部分都只是偶尔上网,那么他们很可能采用的是过时的旧设备。就要考虑用较低分辨率做为制作标准。2合理广告在目前一些网站的广告(弹出广告、浮动广告、大广告、banner广告、通栏广告等等)让人觉得很烦琐,更本就不愿意来看,有时连你这个网站都不上了,这样一来网站受到了严重的影响、广告也没达到广告的目的。这些问题都是我们在设计网站之前需要考虑、需要规划的内容之一。浮动广告有两种,第一种是在网页两边空余的地方可以上下浮动的广告,第二种是满屏幕到处随机移动的广告。建议能使用第一种的情况下尽量使用第一种,不可避免第二种情况时尽量在数量上控制最多一个就好。如果数量过多会直接影响到用户的心理、防挨到用户浏览信息,适得其反。首页广告不宜过多适中即可。如在注册或者某个购买步骤的页面上最好不要出现过多的其他无关的内容让用户分心,避免客户流失等。最新新流行的一种广告是将整个页面按1024*768或更高的分辨率标准来设计,在超过800*600用户浏览范围的地方,放置的是常规广告信息或软广告信息,这样一来,设备条件好的用户就可以浏览将近全屏的页面内容,而800*600的用户只能看到广告部分的一个小边,但是不影响浏览主要信息。3空间的合理利用很多的网页都具有一个特点,用一个字来形容,那就是“塞”,它将各种各样的信息如文字、图片、动画等不加考虑的塞到页面上,有多少挤多少,不加以规范,导致浏览时会遇到很多的不方便,主要就是页面主次不分,喧宾夺主,要不就是没有重点,没有很好的归类,整体就像各大杂烩。让人难以找到需要的东西。有的则是一片空白失去平衡,也可以用个“散”字来形容。并非要把整个页面塞满了才不觉得空,也并非让整个页面空旷才不觉得满,只要合理的安排、有机的组合,使页面达到平衡,既使在一边的部分大面积留空,同样不会让人感到空,相反这样会给人留下广阔的思考空间,给人回味又达到了视觉效果。比如重要但形式单一的文字信息,就要在块于块之间多点留白。图片花色凌乱的部分要于其他块有明显区分。在首页上展示子栏分类信息要紧凑,以一大类作为一个整体块。相同类的信息采用相同的排榜方式。门户的导航是经常变且类别繁多的,不一定什么时候是单数什么时候是双数,所以不要用图片来制作。重要的第一屏包括页头的的第一屏,应该集中了用户最常用的信息,导航,服务链接。这一屏的装饰,应该很大程度的体现了整个网站的设计风格,并且分为页头(分类导航服务导航);登陆区;首推图片广告/文字广告;热门信息/导航;最新信息推荐;首推专题;4文字编排在网页设计中,字体的处理与颜色、版式、图形化等其他设计元素的处理一样非常关键。4.1文字图形化文字图形化就是将文字用图片的形式来表现,这种形式在页面的子栏目里面最为常用,因为它具有突出,同时又美化了页面,使页面更加人性化加强了视觉效果。是文字无法达到的。对于通用性的网站弊端就是扩展性不强。4.2强调文字如果将个别文字作为页面的诉求重点,则可以通过加粗、加下划线、加大号字体、加指示性符号、倾斜字体、改变字体颜色等手段有意识地强化文字的视觉效果,使其在页面整体中显得出众而夺目。这些方法实际上都是运用了对比的法则。如果在更新频率低的情况下也可以使用文字图形化。五、网站配色1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。2.用两种色彩。先选定一种色彩,然后选择它的对比色(在Photoshop里按ctrl+shift+I)再进行微小的调整。整个页面色彩丰富但不花稍。3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。也就是在同一色系里面采用不同的颜色使网页增加色彩,而又不花,色调统一。这种配色方法在网站设计种最为常用。4.灰色在网页设计中又称为“万能色”,其特点是可以和任何颜色搭配,在使用时把握量避免网页变灰。在网页配色中,尽量控制在三种色彩以内,以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容、也使用户在浏览信息的时候不会觉得累。六、常见问题6.1分解大型表格为了加快网页的浏览速度,尽可能避免用大型表格,因为浏览器必须等待整个表格的内容全部到达客户端,才能显示这个表格的内容,而文本或图像则是一边下载一边显示。同时我们制作网页时要尽量减少表格的深度、表格复杂化,这一点尤为重要可直接影响网页浏览速度、又给后面的程序添加带来了不必要的麻烦。将浮动层等load时间慢的信息块(div)放在的最后,可以尽量少的影响用户浏览速度。6.2网站导航要清晰“您所在位置”在大型网站中是不可缺少的一部分,其作用表明您现在所处在的位置,使用户不会不知东西南北迷失在网站中。其次还有读者进入目的页的点击次数,不能超过三次。如果三次以上还找不到用户所要的信息,人家可就没有耐心陪你玩了!6.3图片注解在很多网站上我们都可以找到一个共同的缺点,当网速慢时有很图片都无法显示,又没有注解使得用户反感,如在注册时的按钮是图片做的又没加图片注解,而导致连注册都找不到,如果加了注解这些问题也就不成问题了!6.4系统按钮在我们做按钮的时候,要做成“按钮”的形式(type=button),而不要做成“提交表单”的形式(type=submit),方便以后程序设计。6.5空链接、死链接在一个优秀、专业的网站上是找不到任何一个空链接或死链接的情况,如果有这种情况会影响到用户对您网站的评价,所以我们在制作的时候尽量避免,避免办法就是提前做好链接,如果尚未完成的页面则链上“建设中”的页面,加以解释。6.6导航条在大型的行业网站里面主导航条最好是用文字形式,避免使用图片或Flash做导航条、缩小网站扩展性。6.7网站的扩展性对于一个行业网站而言,网站的扩展性是相当重要的,随时都要考虑到网站需求的变化!七、专题设计实际上,我认为整个网站投入设计力量最多的地方,就应该是专题页了。因为一个门户是不应该经常改变结构和风格的。而为了更快速的引导顾客浏览,首页上放的多是文字分类,不应有过多图片装饰。而专题页上,最重要的是营造消费氛围,刺激顾客的消费欲望,所以,只要是能够体现商品特性,吸引用户,即使页面体积有些大也可以容忍。在这里,有设计人员更多的发挥空间。在专题设计中需要注意的是,标题文字或广告文字应该突出明显,普通描述文字与背景色对比清晰。商品图片突出,整个布局丰富而不凌乱,主次分明。可供用户操作的空间明显而突出。七、广告图片通常门户网站的广告来源很广,又的是广告客户自己制作的,有的是其他网站制作的,有的是门户网站自己的广告部门设计制作的。在设计上很难管理,不过有一个原则,就是:颜色鲜艳层次少;主题文字突出;构图简单;动画播放时间不过长。从网易看大型门户网站首页设计思路不少人也许认为大型门户网站首页设计思路只是把一些导航、资讯内容和广告堆积起来摆放得好看就可以了,虽然这个观点也并不是完全错误的,确实门户网站首页是由这三方面内容组织而成,但随着互联网的快速发展,用户对访问网站的要求也越来越高,在互联网行业,因为很多东西是免费和相似的,用户转移成本会比较低,在这个网站有的东西去其他网站基本都能找到,只是输入个网址就可以了。网站营运商如果想留住用户和吸引更多的用户浏览自己的网站,那这个时候就是需要提高网站的用户体验来满足用户多方面的需求。因此现在大型门户网站的设计越来越讲究和更为用户着想,最理想的门户网站设计流程需要经历“用户研究-交互设计-视觉设计-可用性测试”这几个步骤,其实有很多门户网站设计也会经历其中一些步骤,只是公司对这方面还没有一个很好的认识,没有一个系统的叫法和详细的职能分工,往往都是一个人身兼多职,大部分都是按个人经验主观判断去决定,没有一些客观的数据支持。例如经常会有一些网站策划者说:我也是网站用户之一,这个功能我没有使用需求,其他用户也应该没有使用需求可以删除。如果这时候有一份客观的使用分析数据就知道用户到底有没有这个需求了。虽然我们不可能全部都需要客观数据去做支持,但起码能以客观数据为基础再延伸到其他设计中。下面我们从几个方面来分析网易门户网站的设计思路:一、架构设计网站的首页是兵家必争之地,每个频道负责人都想在显眼的位置推荐自己的产品或者资讯来增加曝光率,总是希望把所有东西一下子让用户看到,但最后我们就发现你放的东西越多,用户就根本找不到他想要的东西,快速离开的可能性很大。在国内的门户网站都习惯了资讯多、页面长,什么都往首页堆,感觉内容越多会显的越大气,但用户的耐性是有限的,所以网页的通透性对国内网站很重要,每一屏的架构变化不宜太多,适当就好,主次内容信息位置保持一致性,不然用户每浏览到下一屏都需要重新去解读架构,思考该从那里开始阅读,不但用户的耐性被消耗掉还会增加用户的浏览成本,所以网站首页的架构必须清晰明了,保持较好的通透性,减少用户的浏览成本。例如网易首页,采用三栏式结构,左栏为导航推荐区提供网易特色产品入口,中栏为主要资讯区,提供快速、全面、动态的各类新闻资讯,右栏为特色栏目区如博客、论坛等。各栏的内容属性清晰,用户能快速找到他们需要的信息畅顺的浏览不需要多余的思考。据研究分析用户浏览网页的视觉一般是从左到右、从上至下的一个浏览习惯。网易网站的架构也在往这个方向改进,不断的提升用户体验。网易资讯类页面大致可分为3类架构,下图是3类架构的视觉走向图。网易首页采用第一种架构,各频道首页例如新闻、体育、娱乐等采用第二种架构,新闻最终页采用第三种架构。这样可使用户保持统一的视觉走向,无论浏览那个页面用户都知道他们需要的资讯在那里,符合用户浏览网页的习惯,减少用户浏览成本。 二、风格设计相信多数人都很喜欢apple的产品,为什么apple的产品那么受大众欢迎,除了品牌影响力外,时尚简单的外观设计和界面设计,也是受欢迎的其中原因之一,在apple的产品设计中让人感觉没有多余的东西,每一根线存在都是有意义的。还有在中国的书画史上,有很多艺术境界高远的作品都是少费笔墨却格外传神(如郑燮的竹石、齐翁的墨虾)。虽然网站设计不能称作为一件艺术创作,但用最少的元素设计出最好的作品这个也是网站设计中所追求目标之一。能用一根线表现出效果就没有必要使用2根线,能用文字表示清楚的就不需要用图片。页面设计如果使用过多装饰元素,会造成页面庞大下载速度缓慢,不要高估网民的耐性,大部分网民都是没有耐性的。浏览大量信息的时候需要一个简洁无阻碍的界面,过多的色彩和装饰反而会分散用户的注意力,影响到用户浏览效果和减少对资讯的点击。网站需要用户看到的是网站提供的信息内容和服务而不是花俏的装饰(个性产品网站除外)。这也是网易门户一直沿用简洁风格原因之一。例如新改版的网易新闻,打破了以往条条框框的感觉,取消了多余的线框,界面更清晰简洁,资讯内容更突出。列举2个简洁风格做的比较好的外国门户网站Yaho新闻使用的是立体效果的设计,time是以线条为主的设计,2者给人感觉是简洁清晰没有多余的东西,既突出了资讯内容又不失美感,如逆云网首页的设计。 每个门户网站的面向受众都不同,也会造成门户网站的风格定位不一样,例如面向受众年龄层比较年轻的门户网站,在设计风格可能会偏向多色彩多功能,而面向受众年龄层较大的门户网站,在设计风格上就会相反。但不管怎样的设计风格保持清晰方便用户浏览的界面是必要的。设计思路三、信息排布大型门户网站首页一般都会承载大量的资讯信息,密密麻麻的信息会让用户浏览网页的时候会产生压迫感,如何能让用户顺畅的浏览成为设计中重要的一环。大家可以对比下面2张信息排布图,信息条数都是相同的但第一张信息排布图会让人感觉信息很清晰。而第2张图会让用户感觉到信息排布有压迫感,可能还没有开始阅读就已经没有耐性了(忠诚度非
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 基础医疗测血压考核标准操作手册
- 大学英语六级翻译技巧专项训练教材
- 职业培训班学员个人成长总结报告
- 中学生节日主题演讲稿集锦
- 小学数学二年级课例及教学反思
- 2023小学一年级数学教学总结报告
- 英语人称及物主代词教学素材
- 高中学生个性化评语撰写模板
- 果园承包合同签订及注意事项
- 小学英语词汇教学活动设计及课件
- 2024年南宁市招聘中小学教师笔试真题
- 养老院安全生产培训
- 老员工带新员工的培训制度
- 高标准农田建设项目风险评估与应对措施
- 水浒传每回内容梗概
- 人教版初中九年级全册英语单词表(完整版)
- 工地试验室安全培训内容
- 合同车辆质押合同
- 2024版数据中心基础设施运维与维保服务合同2篇
- 增材制造课件
- 部编版四年级语文上册习作《我的家人》精美课件
评论
0/150
提交评论