词条 | 网页设计 |
释义 | 网页设计——网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台,离开网站(或者只是利用第三方网站)去谈电子商务是不可能的。企业的网址被称为“网络商标”,也是企业无形资产的组成部分,而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。 简介网页设计的建站包含:企业网站、集团网站、门户网站、电子商务网站、网站优化技术等 ,如中华网库,在行业中各自有各自的作用。 设计第一技术其次企业网站设计显得极为重要,下面是一些网站设计中应注意的原则。 一、 明确建立网站的目标和用户需求 Web站点的设计是展现企业形象、介绍产品和服务、体现企业发展战略的重要途径,因此我们必须明确设计站点的目的和用户需求,从而做出切实可行的设计计划。我们会根据消费者的需求、市场的状况、企业自身的情况等进行综合分析,以“消费者”为中心,而不是以“美术”为中心进行设计规划。 在设计规划时我们会考虑: 建设网站的目的是什么? 为谁提供服务和产品? 企业能提供什么样的产品和服务? 网站的目的消费者和受众的特点是什么? 企业产品和服务适合什么样的表现方式(风格)? 二、网页设计总体方案主题鲜明 在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色作出定位,规划网站的组织结构。 Web站点应针对所服务对象(机构或人)的不同而具有不同的形式。有些站点只提供简洁文本信息;有些则采用多媒体表现手法,提供华丽的图像、闪烁的灯光、复杂的页面布置,甚至可以下载声音和录像片段。好的Web站点把图形表现手法和有效的组织与通信结合起来。 为了做到主题鲜明突出,要点明确,我们将按照客户的要求,以简单明确的语言和画面体现站点的主题;调动一切手段充分表现网站点的个性和情趣,办出网站的特点。 Web站点主页应具备的基本成分包括: 页头:准确无误地标识你的站点和企业标志; Email地址:用来接收用户垂询; 联系信息:如普通邮件地址或电话; 版权信息:声明版权所有者等。 充分利用已有信息,如客户手册.公共关系文档.技术手册和数据库等。 三、网站的版式设计 网页设计作为一种视觉语言,特别讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处。 版式设计通过文字图形的空间组合,表达出和谐与美。 多页面站点页面的编排设计要求把页面之间的有机联系反映出来,特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果,我们将反复推敲整体布局的合理性,使浏览者有一个流畅的视觉体验。 四、色彩在网页设计中的作用 色彩是艺术表现的要素之一。在网页设计中,我们的设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。 根据色彩对人们心理的影响,合理地加以运用。如果您的企业有CIS(企业形象识别系统),我们将按照其中的VI进行色彩运用。 五、网页设计形式与内容相统一 为了将丰富的意义和多样的形式组织成统一的页面结构,形式语言必须符合页面的内容,体现内容的丰富含义。 灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。如对称原则在页面设计中, 它的均衡有时会使页面显得呆板,但如果加入一些富有动感的文字、图案,或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面作为视觉语言中的基本元素,巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果,充分表达完美的设计意境。 六、三维空间的构成和虚拟现实 网络上的三维空间是一个假想空间,这种空间关系需借助动静变化.图像的比例关系等空间因素表现出来。 在页面中,图片、文字位置前后叠压,或页面位置变化所产生的视觉效果都各不相同。通过图片、文字前后叠压所构成的空间层次不太适合网页设计,根据现有浏览器的特点,网页设计适合比较规范、简明的页面,尽管这种叠压排列能产生强节奏的空间层次,视觉效果强烈。 网页上常见的是页面上、下、左、右、中位置所产生的空间关系,以及疏密的位置关系所产生的空间层次,这两种位置关系使产生的空间层次富有弹性,同时也让人产生轻松或紧迫的心理感受。 现在,人们已不满足于HTML语言编制的二维Web页面,三维世界的诱惑开始吸引更多的人,虚拟现实要在Web网上展示其迷人的风采,于是VRML语言出现了。VRML是一种面向对象的语言,它类似Web超级链接所使用的HTML语言,也是一种基于文本的语言,并可以运行在多种平台之上,只不过能够更多地为虚拟现实环境服务。 七、网页设计中多媒体功能的利用 网络资源的优势之一是多媒体功能。要吸引浏览者注意力,网页的内容可以用三维动画、FLASH等来表现。但要由于网络宽带的限制,在使用多媒体的形式表现网页的内容时不得不考虑客户端的传输速度。 八、结构清晰并且便于使用 如果人们看不懂或很难看懂您的网站,那么,他如何了解你的企业和服务呢?使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有最棒的产品,如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话,他们是不会喜欢您的网站的,这就是网页设计的失败。 九、导向清晰 网页设计中导航使用超文本链接或图片链接,使人们能够在您的网站上自由前进或后退,而不会让他们使用浏览器上的前进或后退。我们在所有的图片上使用“ALT”标识符注明图片名称或解释,以便那些不愿意自动加载图片的观众能够了解图片的含义。 十、快速的下载时间 很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站,在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。因此,我们会建议您在网页设计中尽量避免使用过多的图片及体积过大的图片。我们通常会与客户合作,将主要页面的容量控制在50K以内,平均30K左右,确保普通浏览者页面等待时间不超过10秒。 十一、非图形的内容 我们在必要时适当使用动态“Gif”图片,为减少动画容量,应用巧妙设计的Java动画可以用很小的容量使图形或文字产生动态的效果。但是,由于在互联网浏览的大多是一些寻找信息的人们,我们仍然建议您要确定您的网站将为他们提供的是有价值的内容,而不是过度的装饰。 十二、方便的反馈及订购程序 让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成功的重要因素。如果客户在您的网站上产生了购买产品或服务的欲望,您是否能够让他们尽快实现吗?是在线还是离线? 十三、网站测试和改进 测试实际上是模拟用户询问网站的过程,用以发现问题并改进网页设计。我们通常与用户共同安排网站测试。 现状以及实战技巧(一)垃圾还是经典 网页技术更新很快,一个网站的界面设计寿命仅仅2-3年而已。不管是垃圾还是精品,都没有所谓的经典,经典只存在于是哪个首次成功创新性的应用。一个闭门造车者做出的东西,是远远赶不上综合借鉴者的。网页设计不同于其他艺术,在模仿加创新的网页设计领域当中,即便是完全自己设计的,也是沿用了人们已经认同的大部分用户习惯,而且这种沿袭的痕迹是非常的明显!还有哪个设计者敢腆着脸说,这都是我自己的原创设计?对于业界来说,经典只是个理念和象征! (二)国内网页设计环境 不可否认,国内网页设计环境目前还停留在初级的认知阶段,也就是说,绝大多数人不知道网络的真正的可用之处,你去做一个业务的时候,不得不去做大量的说服教育工作。以乙方的身份去说服甲方,以专业角度去教育非专业认识,结果是可想而知的。也正是这种全体社会普遍的低认知水平,导致了大量网络垃圾的产生。 (三)什么是好的网页设计 (1)内容和功能决定表现形式和界面设计 常常拿到的任务是一张小纸条,上面两句话,叫你去做一个网站设计。有的人看看纸条就去设计页面了,凭两句话,你就可以为客户做一个页面设计,以我7、8年的设计经验,我都不敢去做,你真是我的偶像阿! 做网页设计,你需要了解客户的东西很多: 1、建站目的。 2、栏目规划及每个栏目的表现形式及功能要求。 3、主色、客户性别喜好、联系方式、旧版网址、偏好网址。 4、根据行业和客户要求,那些要着重表现。 5、是否分期建设、考虑后期的兼容性。 6、客户是否有强烈的建站欲望。 7、你是否能在精神意识上控制住客户。 8、面对你未接触的技术知识,你有底吗? 9. 网站类型。 等等... 当你把这些内容都了解清楚了时候,你的大脑中就已经给这个网站有个全面而形象的定位了,这时才是有的放矢去做界面设计的时候了。 (2)界面弱化 一个好的界面设计它的界面是弱化的,它突出的是功能,着重体现的是网站业提供给使用者主要是什么。这就涉及到浏览顺序、功能分区等等。 要让访客在0.5秒内就能把握网站的行业性质,1秒内就知道该从哪个地方开始使用这个网站,能点一次的,绝不点第二次。当然上面说的是大多数功能性网站,对于宣传展示性网站,诸如加特效的或Flash网站,可能就不得不花哨一些,但不能太过分。网站不是动画片,在效率越来越高,社会心理越来越浮躁的中国,人们的耐心越来越小,心理承受能力越来越低。效果可以体现意境,点到为止。 (3)模块化和可修改性强 模块化不仅可以提高重用性,也能统一网站风格,还可以降低程序开发的强度。这里就涉及一些尺寸、模数、宽容度、命名规范等等知识了,不再冗述。 无论是架构还是模块或图片,都要考虑可修改性强。举个简单的例子,logo、按钮等,很多人喜欢制作图片,N个按钮就是N张图片。如果只做3-5类按钮的背景图片,然后用在网页代码里打上文字,那么修改起来就简单了,让程序员自己改字就可以了。然而网页显示的字体是带有锯齿的,一般既能清晰又保证美观的字体字号有几类: 宋体12px | 宋体 12px 粗体 | 宋体 14px | 宋体 14px 粗体 | 黑体 20px | verdana 9px | Arial Black 12px+ | (4)创意是可耻的,分析能力远比创意来的重要 设计界动辄就大谈什么“创意”,我要说的是,还没有搞清目的意义内容,还没在技术制作上臻于完善的基础上,用创意和特效来迷惑客户和访客是可耻的。一个网页设计者的分析能力远比创意来的重要。 (四)结尾,送上思洋广州的一些经验 (一)网页配色基本概念 (1)白纸黑字是永远的主题,谁都说不出不好来。 (2)网页最常用流行色 ·蓝色——蓝天白云,沉静整洁的颜色。 ·绿色——绿白相间,雅致而有生气。 ·橙色——活泼热烈,标准商业色调。 ·暗红——宁重、严肃、高贵,需要配黑和灰来压制刺激的红色。 (3)颜色的忌讳 ·忌脏——背景与文字内容对比不强烈,灰暗的背景令人沮丧! ·忌纯——艳丽的纯色对人的刺激太强烈抗议,缺乏内涵。 ·忌跳——再好看的颜色,也不能脱离整体。脱离群众是自取其辱! ·忌花——要有一种主色贯穿其中,主色并不是面积最大的颜色,而是最重要,最能揭示和反映主题的颜色,就象领导者一样,虽然在人数上居少数,但起决定作用。 ·忌粉——颜色浅固然显的干净,但如果对比过弱,整得苍白无力了,就象病夫一样无可救药。 ·蓝色忌纯,绿色忌黄,红色忌艳。 (4)几种固定搭配 ·蓝白橙——蓝为主调。白底,蓝标题栏,橙色按钮或ICON做点缀。 ·绿白兰——绿为主调。白底,绿标题栏,兰色或橙色按钮或ICON做点缀。 ·橙白红——橙为主调。白底,橙标题栏,暗红或桔红色按钮或ICON做点缀。 ·暗红黑——暗红主调。黑或灰底,暗红标题栏,文字内容背景为浅灰色。 (二)网页设计理念 (1)内容决定形式 先把内容充实上,再分区块,再定色调,再处理细节。 (2)先整体,后局部,最后回归到整体。 全局考虑,把能填上的都填上,占位置。然后定基调,分模块设计。最后调整不满意的几个局部细节。 (3)功能决定设计方向 ·看网站的用途,决定设计思路.商业性的就要突出赢利目的;政府型的就要突出形象和权威性的文章;教育性的,就要突出师资和课程。 关于网页标题设计的原则 在设计网页标题时,应注意同时兼顾对用户的注意力,以及对搜索引擎检索的需要。这一原则在实际操作中可通过三个方面来体现,这三个方面也可以被认为是网页标题设计的一般规律: (1)网页标题不宜过短或者多长。一般来说6-10个汉字比较理想,最好不好超过30个汉字。网页标题字数过少可能包含不了有效关键词,字数过多不仅搜索引擎无法正确识别标题中的核心关键词,而且也让用户难以对网页标题(尤其是首页标题,代表了网站名称)形成深刻印象,也不便于其他网站链接。 (2)网页标题应概括网页的核心内容。当用户通过搜索引擎检索时,在检索结果页面中的内容一般是网页标题(加链接)和网页摘要信息,要引起用户的关注,网页标题发挥了很大的作用,如果网页标题和页面摘要信息有较大的相关性,摘要信息对网页标题将发挥进一步的补充作用,从而引起用户对该网页信息点击行为的发生(也就意味着搜索引擎推广发挥了作用)。另外,当网页标题被其他网站或者本网站其他栏目/网页链接时,一个概括了网页核心内容的标题有助于用户判断是否点击该网页标题链接。 (3)网页标题中应含有丰富的关键词。考虑到搜索引擎营销的特点,搜索引擎对网页标题中所包含的关键词具有较高的权重,尽量让网页标题中含有用户检索所使用的关键词。以网站首页设计为例,一般来说首页标题就是网站的名称或者公司名称,但是考虑到有些名称中可能无法包含公司/网站的核心业务,也就是说没有核心关键词,这时通常采用“核心关键词+公司名/品排名”的方式来作为网站首页标题。本文开头所列举的某网络营销服务商网站首页标题实例,其实也是采用这种方式来设计网页标题,只不过由于罗列了太多的“核心关键词”,反而没有了核心。 上述几个方面其实都考虑了搜索引擎检索网页的特点,也就是说,网页标题设计都将有利于搜索引擎检索作为重要因素,即使如此,作者仍然建议,与网页内容写作一样,网页标题写作首先是给用户看的,在这个前提之上考虑对搜索引擎检索才有意义。可见网页标题设计并不是一件随意的事情,尤其对网站首页标题设计,不可不慎重。 做美工看起来并不是一件容易的事情。首先,要对整个站点和企业有个大致的了解。例如:某些企业喜欢蓝色的主调,你不可能去做个红色的主调,这样完全违背客户的主要意愿,如果百度的标志改成五颜六色的,相信大家也不会认可的。站长的职责是规划网站结构。同样也需要有一定的审美观。下面介绍了几款常用的绘图工具和基本知识。 1.源文件psd,ai,cdr的区别 psd文件就是用photoshop创建的,当然也必须用photoshop打开; ai文件是Illustrator的。他们都是Adobe公司的。ai文件同样也可以用photoshop打开,但打开后会载入在同一层内。 cdr文件是CorelDRAW的。 2.关于CMYK和RGB颜色模式 CMYK是Cyan(青)、Magenta(品红)、Yellow(黄)、Black(黑),这是印刷上使用比较普遍的色彩模式。 R、G、B就是Red、Green、Blue(红,绿,蓝)三种颜色,RGB模式就是由这三种颜色为基色进行叠加而模拟出大自然色彩的色彩组合模式。我们日常用的彩色电脑显示器、彩色电视机等的色彩都使用这种模式。 3.矢量图 矢量图与位图最大的区别是,它不受分辨率的影响。因此在印刷时,可以任意放大或缩小图形而不会影响出图的清晰度 。 矢量图:是根据几何特性来绘制图形,矢量可以是一个点或一条线,矢量图只能靠软件生成,文件占用内在空间较小,因为这种类型的图像文件包含独立的分离图像,可以自由无限制的重新组合。它的特点是放大后图像不会失真,和分辨率无关,文件占用空间较小,适用于图形设计、文字设计和一些标志设计、版式设计等。 ai cdr均为矢量图。 4.图片文件jpg,gif,png,bmp的区别 bmp:是未经过压缩的用点阵来表示的真彩图片,占用磁盘空间较大 gif:是经过压缩的,只能表示256种颜色,占用磁盘空间小,常用来演示色彩单一的成块的卡通图案,GIF还有一种可以表示连续的动画。 png:是fireworks的图片格式 jpg:也是有损压缩格式但是它表示的颜色比较丰富,一般用来显示真彩的照片或图案。 5.名片的尺寸问题 名片的标准尺寸:90mmX54mm。但是加上出血上下左右各2mm,所以在设计时 制作尺寸必须设定为:94 x 58mm。 6.源文件的提供问题 作为设计者和客户(这里指各站长),如果事先没有明文协议的话 设计者有权不提供源文件。 7.什么是logo,ci,vi VI是Visual Identity的缩写,中文译为“企业视觉识别”。VI是CI计划的静态识别符号,是企业理念视觉化传达的载体,因此它项目最多,效果最为直接。VI作为视觉识别,它是外在表现,固然需要具有美感,但VI必须是MI的体现,直接反映企业的理念。因此VI设计包含这样一些原则:即充分传达企业理念、人性原则、民族性原则、简洁抽象及动态原则、员工参与原则、法律原则、艺术性原则和个性原则。 CI是Corporate Identity的缩写,中文译为“企业形象”。CI计划,是指企业有目的、有计划、战略性地创造出所希望的自身形象,由此提高企业的社会知名度,最终得到自己最适合的经营环境。 而logo只是网站或企业一个标志。 网页设计的要点网页设计的两大要点是:整体风格和色彩搭配。 一、确定网站的整体风格 在这里,我提供给大家一些参考经验: 1.将你的标志logo,尽可能的放在每个页面上最突出的位置。 2.突出你的标准色彩。 3.总结一句能反映贵站精髓的宣传标语! 4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的! 二、网页色彩的搭配 1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感。 2.用两种色彩。先选定一种色彩,然后选择它的对比色。 3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。 在网页配色中,还要切记一些误区: 1.不要将所有颜色都用到,尽量控制在三至五种色彩以内。 2.背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。 三、网页设计的工具 1.dreamweaver,用与编辑HTML、ASP、JSP、PHP时的辅助工具 2.Frontpage 跟dreamweaver一样,不过个人感觉还是dreamweaver好。 3.FLASH 网页需要画面流动时的首选择 4. PS图象处理软件,一般网页都需要有图片相搭配,PS是款很强大的工具。 5.FW跟PS一样都是图象处理软件,但FW偏向与对网页的处理。[个人喜欢PS] 网页设计必须注意的26个问题 当你在INTERNET这个信息的海洋中尽情遨游时,会发现许许多多内容丰富、创意新颖、设计独特的个人网页,不知道你见到这样漂亮可人的网页是否有点心动。一旦你具备了上网的条件,又萌发了制作主页的念头,那么就应该注意网页设计时应考虑哪些方面的问题,包括网站功能和以及访问者需要什么。你的整个设计都应该围绕这些方面来进行。下面笔者就自己在实践操作中的使用体会来谈谈网页设计时应该考虑哪些问题,希望能给初建网站的用户带来一定的作用。 1、页面内容要新颖 网页内容的选择要不落俗套,要重点突出一个“新”字,这个原则要求我们在设计网站内容时不能照抄别人的内容,要结合自身的实际情况创作出一个独一无二的网站。 放眼望去,网上的许多个人主页简直就是"杂货店",内容包罗万象,题材千篇一律,人人都是"软件下载",个个都有"网络导航",从头到尾找不出一丝“鲜”意。所以,我们在设计网页时,要把功夫下在选材上。选材要尽量做到“少”而“精”,又必须突出“新”,如能坚持天天更新的话,我相信这样的网页一定会受到大家的欢迎。 2、网页命名要简洁 由于一个网站不可能就是由一个网页组成,它有许多子页面,为了能使这些页面有效地被连接起来,用户最后能给这些页面起一些有代表性的而且简洁易记的网页名称。这样既会有助于你以后方便管理网页,在向搜索引擎提交你的网页时更容易被别人索引到。在给网页命名时,最好使用自己常用的或符合页面内容的小写英文字母,这直接关系到页面上的连接。 3、要及时更新网页 网页制作好后,不能说万事大吉了,其实事后的工作量更大。因为网页制作是一时的,而维护更新的工作是每天都要做的。要及时把网页上已经作废的连接应该立即删除掉,比如用户无意中点击了页面中的一个连接,在苦苦的等待之后,换来的是无法访问的结果,那么他们会对你的网页大失所望,可能以后再也不会光顾你的网页了。若不能及时更新,也最好在主页上发布信息,告诉前来访问的朋友,因有特殊情况需要离开一段时间,未能及时更新主页,希望各位见谅,这样就能给人一种对别人负责的感觉,同时能得到网友的信任。 4、注意视觉效果 设计Web页面时,一定要用1024*768的分辨率来 分别观察。许多浏览器使用1024*768的分辨率,尽管在1280*1024高分辨率下一 些Web页面看上去很具吸引力,但在1024*768的模式下可能会黯然失色。作一点小小的努力,设计一个在不同分辨率下都能正常显示的网页 5、随时注意网站升级 时刻注意网站的运行状况。性能很好的主机随着访问人数的增加,可能会运行缓慢。但是,如果你不想失去访问者的话,一定要仔细计划好你的升级计划。 6、 网页内容要易读 网站设计最重要的诀窍,恐怕就是你的网页要易读 。这就意味着,你必须花点心思来规划文字与背景颜色的搭配方案。 注意不要使背景的颜色冲淡了文字的视觉效果,别用花里胡哨的色彩组合,让人看起来你的网页来很费劲。一般来说,浅色背景下的深色文字为佳 。这个要点要求你最好别把文字的规格设得太小、也不能太大。文字太小,人家读起来难受;文字太大,或者文字视觉效果变化频繁,像是冲着人大喊大叫,看起来不舒服。另外,最好让文本左对齐,而不是居中。按当代中文的阅读习惯,文本大都居左的。当然,标题一般应该居中,因为这符合读者的阅读习惯。 7、善用表格来布局 不要把一个网站的内容象作报告似的一二三四地罗列出来,要注意多用表格把网站内容的层次性和空间性突出显示出来,使人一眼就能看出你的网站重点突出,结构分明。 8、 少用特殊字体 虽然你可以在你的HTML中使用特殊的字体,但是,你不可能预测你的访问者在他们的计算机上将看到什么。在你的计算机里看起来相当好的页面,在另一个不同的平台上看起来可能非常糟糕。一些网站设计员喜欢使用来定义特性,这虽然允许你使用特殊的字体,但是仍需要一些变通的方法,以免你所选择的字体在访问者的计算机上不能显示。级联风格表CSS有助于解决这些问题,但是只有最新版的浏览器才支持CSS。 9、多学习和使用HTML 为了成功地设计网站,你必须理解HTML是如何工作的。大多数的网站设计者建议网络新手应从有关HTML的书中去寻找答案,用Notepad制作网页。因为用HTML设计网站,可以控制设计的整个过程。但是,如果你仅仅是网站设计的新手,你应该寻找一个允许修改HTML的软件包。HomeSite4是一个很好的Web设计工具。在设计过程中,HomeSite4能帮助你学习HTML。它还允许你切换到所见即所得的模式,以便你在把网站发送到Web之前,预览你的网站。 10、尽量少用Java程序 不要使用大幅面的Java程序,能够用javascript替代效果的则尽量不要使用java.因为目前来讲java的运行速度实在慢的让人无法忍受,往往使浏览者没有耐心等页面全部显示出来,这样你的精心设计便毫无效果啦。 11、 少放网站地图 许多设计者把他们的网站地图放在网站上,这种做法,却是弊大于利。绝大部分的访问者上网是寻找一些特别的信息,他们对于你的网站是如何工作的,并没有兴趣。如果你觉得你的网站需要地图,那很可能是需要改进你的导航和工具条。 12、要为图片附加注释文字 给每个图形加上文字的说明,在出现之前就可以看到相关内容,尤其是导航按钮和大图片更应如此。这样一来,用户在访问你的站点时就有一种亲切感觉,认为你心细,比较善解人意,时时刻刻为他人着想,相信你的好心会有好报的。 13、做个网站介绍 一个简单明了的网站介绍,不仅能让别人对你的网站能够提供些什么有个了解,引发共鸣或是表达你的诚意,常常最能打动读者,而且还能使访问者能快速找到想要的东西。但是,许多设计者都没有这样做。有效的导航条和搜索工具使人们很容易找到有用的信息,这对访问者很重要。告诉访问者你所提供的正是他们想要的信息。 14、考虑浏览器的兼容性 当然现在IE所占的市场份额越来越大,但是我们仍然需要考虑到Netscape以及Opera这些浏览器用户。设计风格的考虑,如色彩的搭配,图形、线条的使用等等。要时刻为用户着想,必须最少在几种不同类型的浏览器下测试网站,看看兼容性如何。 15、不宜多用闪烁文字 有的设计者想通过闪烁的文字来引起访问者的注意是可以被人理解的,但一个页面中最多不能有三处闪烁文字,太多了给用户一种眼花缭乱的感觉,反而会影响用户去访问该网站的其他内容,正所谓“物极必反”也, 16、每个页面都要有导航按钮 应当避免强迫用户使用工具栏中的向前和向后按钮。你的设计应当使用户能够很快地找到他们所要的东西。绝大多数好的站点在每一页同样的位置上都有相同的导航条,使浏览者能够从每一页上访问网站的任何部分。 17、避免长文本页面 在一个站点上有许多只有文本的冗长页面,是令人乏味的,人们为了阅读这些长文本,不得不使用卷滚条,从而也浪费了用户在网上冲浪的时间。如果你有大量的基于文本的文档,应当以Adobe Acrobat格式的文件形式来放置,以便你的访问者能离线阅读,从而节省宝贵的时间。 18、 网页风格要统一 你网页上所有的图像、文字,包括像背景颜色、区分线、字体、标题、注脚什么的,要统一风格,贯穿全站。这样子读者看起来舒服、顺畅,会对你的网站留下一个“很专业”的印象。 19、动画最多只用一个 大家都喜欢用GIF动画来装饰网页,它的确很吸引人,但我们在选择时,是否能确定必须用GIF动画,如果答否,那么就选择静止的图片,因为它的容量要小得多。同样的尺寸的LOGO,GIF动画的容量有5K,而静止LOGO的只有3K。虽然只有2K之差,但多起来,就会影响下载的速度,所以,如果有些不是必须的,就选择最小的。 20、善用图像 用户在网上四处漫游,你必须设法吸引和维护他们对你的主页的注意力。万维网的其中一个最重大资源是其多媒体能力,所以我们无论如何要善加利用。主页上最好有醒目的图像、新颖的画面、美观的字款,使其别具特色,令人过目不忘。图像的内容应有一定的实际作用,切忌虚饰浮夸。注意图画可以弥补文字之不足,但并不能够完全取代文字。很多用户把浏览软件设定为略去图像,以求节省时间他们只看文字。因此,制作主页时,必须注意将图像所连接的重要信息或联接其他页面的指示用文字重复表达几次,同时要注意避免使用过大的图像,如果不得不放置大的图像在网站上,就最好使用Thumbnails软件,把图像的缩小版本的预览效果显示出来,这样用户就不必浪费金钱和时间去下载他们根本不想看的大图像。 21、 网站导航要清晰 所有的超链接应清晰无误地向读者标识出来,所有导航性质的设置,像图像按钮,都要有清晰的标识,让人看得明白,千万别光顾视觉效果的热闹的,而让人家不知东西南北。链接文本的颜色最好用约定俗成的:未访问的,蓝色;点击过的,紫色或栗色。总之,文本链接一定要和页面的其他文字有所区分,给读者清楚的导向 。 22、最好不用记数器 由于计数器也是由程序设计成的,显示计数器的过程其实就是在执行一个程序的过程,它需要占用用户宝贵的上网时间,况且大多数浏览者认为计数器毫无意义,它们很容易被做假,浏览者也不想看广告。因此笔者建议不要轻易考虑在你的网站上放置一个醒目的点击记数器。你设计网站是为了给访问者提供服务,而不是推销你自己认为重要的东西。如果你显示你的网站是多么受欢迎,你最好提供一个链接,显示访问日志。 23、不能忽视错别字 一个好的网站对设计的每一个细节都不会放过,哪怕是一个微小的拼写错误都是绝对不能出现的。但是遗憾的是,许多设计者都缺少这种技能。确保你拼写正确,并且格外注意平常容易误写的错别字,要时时刻刻保持一种严谨的科学态度。 24、不要用框架 与记数器一样,框架在网页上越来越流行。在大多数网站上,在屏幕的左边有一个框架。但是设计者立刻就发现,在使用框架时产生了许多的问题。使用框架时如果没有17英寸的显示屏几乎不可能显示整个网站。框架也使得网站内个人主页不能够成为书签。也许更重要的是,搜索引擎常常被框架混淆,从而不能列出你的网站。 25、使用著名的插件 如果网站上有声音或视频,要保证使用者通过使用某个知名的插件,能够听到或看到。如果访问者没有所要求的插件,将不得不到其它站点去下载,这样访问者有可能就不会返回了。许多站点使用QuickTime、RealPlay和 Shockwave插件。因为,许多访问者并不愿意浪费很多时间和金钱去下载可能仅使用一次的插件。 26、使网站具有交互功能 一个静态网页始终给人一种呆板的感觉,缺少一种活力和生气。最好在网站上提供一些回答问题的工具以及其他具有交互性能的设计,使得访问者能从网站上获得交互的信息,从而使访问者有一种参与网络建设的新鲜感和成就感。 网页设计师第一部份:(美术部分) 结构素描、光影素描、速写、设计素描、户外写生 色彩原理、色彩配色、设计色彩、色调小稿训练、色彩长期作业 第二部份(静态网页) Dreamweaver CS4:网页布局、制作;Html&Css简介;网站管理与维护、上传与下载;案例分析 Fireworks:美工设计、网页配色;CI、LOGO、Banner的制作;常见网页动画制作、网页布局 Flash CS4:经典网页动画、广告、片头、贺卡设计与分析;MTV制作、交互式网站简介 Photoshop CS4:Photoshop操作基础、图像优化处理、经典实例分析与制作、gif动画、广告gif图片 Illustrator CS4:广告招牌制作、灯箱广告、服装广告设计、企业徽标设计、名片设计 第三部分(动态网页) Html语言详细解介、CSS样式、IIS、C#语言、Asp. net动态、SQLServer数据库、Access数据(送)、JavaScript、Flash8.0高级编程、网站筹划、网站推广、电子购物车、ChatRoom、BBS制作。注:此部分基本上是程序员工作,并不是网页设计师所要学会的。 第四部份(网页美工) 三大构成:平面构成、色彩构成、立体构成 Photoshop美工及网页配色、排版设计、网站框架美工设计、网页logo网页设计、banner设计; Illustrator网页设计、网页字体设计、网页规划设计 快速成长笔者曾经是一个网页设计的菜鸟,经过自己不断的摸索和实践,现在已经可以独立制作一个完整的静态站点,并且给学校的N?(N>5)?个部门、院系和外面的公司做网站,虽然不是一个完全意义上的Web Designer(网页设计师),但是完成一些不专业的要求,是可以的。所以自封为准Web Designer! 循序渐进学知识 先学一学HTML,找本自己能看懂的教材,浏览为主,不用记住所有的概念,只要记住使用原理就行了,这一阶段,估计三天就够了;然后用两天时间学CSS,方法同上;进而再花些时间了解一下JavaScript。 然后就可以用记事本尝试写几个网页,记住这时千万不要用那些可视化工具,比如FrontPage、Dreamweaver(那些以后再学)。 有一个提高自己“写网页”的捷径,就是上各大网站,把网页保存下来(什么?你说你不会保存网页?就是“文件→另存为”),然后打开保存下来的网页,点击右键→查看源文件,看看人家的网页是怎么写的,然后模仿他们的写法,不断规范自己的代码。 接下来该学一下Fireworks了。建议一开始就到网上找些实例教程,这些实例教程一般都介绍得很详细,跟着它一步一步做下来,每学会一个实例就掌握了几项操作,而且也有了自己的作品,很有成就感的,长期积累下来对自己的提高很有帮助。 这时还可以结合Dreamweaver进行学习,你就可以体会到Dreamweaver和Fireworks的无缝集成了。 要是想让你的网页多一些炫目的效果,建议你学一下Flash,难度并不大,而且要是前面的JavaScript基础打得好的话,学到Flash中ActionScript时,就会简单很多。 到这时,相信你就可以真正领会到“网页三剑客”的威力了。 在实践中不断提高 要是每天能拿出两个小时来学习,完成以上这些学习估计只要20天就差不多了。要是天赋高的话,那需要的时间就更少了。接下来该实习了,找个地方锻炼一下自己,比如可以去一些公司干干兼职,或是给自己的单位设计一下主页等。 最好是能进入一个正规的开发团队,你就会学会如何以团队合作的方式开发网站,特别是怎样和程序组合作,把页面与后台程序数据库配合起来。 我特别感谢我们学校的学生在线网站给了我一个机会。有一天正赶上应聘,我拿着自己做的两个Flash作品就去了,没想到面试还通过了,于是我就这样有了在专业开发团队中实践的机会,通过自己的不断努力以及向高手的不断提问,水平飞快提高,两三个月后,就可以独立完成一些站点了,当然只是静态的。 到此,你就基本可以称作是一个“准Web Designer”了,不过要从根本上提高自己,最好去学学美术,这是当一个网页设计师的基本功。 搜索引擎的优化问题框架结构(Frame Sets)有些搜索引擎(如FAST)是不支持框架结构的,他们的“蜘蛛”程序无法阅读这样的网页。 页面结构(div+css)DIV+CSS是网页美工必须了解和掌握的一门技术,现在互联网是属于web2.0的时代,主流的网站都采用DIV+CSS结构。 DIV+CSS即是样式和数据分离,利于搜索引擎读懂网站页面,提高网页收录数量,最主要是方便管理和维护网站。 图象区块(Image Maps)除AltaVista、Google和Northern Light(现已停止公共搜索服务)明确支持图像区块链接外,其他引擎是不支持它的。当“蜘蛛”程序遇到这种结构时,往往会感到茫然不知所措。因此尽量不要设置Image Map链接。 特效链接我们经常看到有些网站为导航链接加上了特效,如点击某个项目会展开下层链接等。这些效果一般通过Java Script实现,视觉上非常新颖,但在“蜘蛛”程序的眼里则没那么诱人,相反它无法解读这种链接。为了让搜索引擎顺利检索到你的网页,建议还是牺牲掉一些花哨的东西。 FLASH虽然FLASH制作的网页视觉效果较好,但搜索引擎对此却不太感冒,个案表明这一类的网站很难被百度搜索引擎索引。明智的做法是提供FLASH和非FLASH网页两种选择,这样即增加了网页的观赏性,又照顾到了搜索引擎的情绪。 加密网页除非你不希望搜索引擎检索你的网页,否则不要给你的网页加密。 网页容量包括图像在内的网页字节数最好不要超过50K。体型庞大的网页下载速度慢,不仅会让普通访问者等得心急如焚,有时也会使“蜘蛛”程序感到不耐烦。 企业网站分类企业网站主要为了外界了解企业自身、树立良好企业形象、并适当提供一定服务的网站。根据行业特性的差别,以及企业的建站目的和主要目标群体的不同,大致可以把企业网站分为: 1.基本信息型:主要面向客户、业界人士或者普通浏览者,以介绍企业的基本资料、帮助树立企业形象为主;也可以适当提供行业内的新闻或者知识信息。这种类型网站通常也被形象的比喻为企业的"web catalog"。 2.电子商务型:主要面向供应商、客户或者企业产品(服务)的消费群体,以提供某种直属于企业业务范围的服务或交易、或者为业务服务的服务或者交易为主;这样的电子商务网站建设可以说是正处于电子商务化的一个中间阶段,由于行业特色和企业投入的深度广度的不同,其电子商务化程度可能处于从比较初级的服务支持、产品列表到比较高级的网上支付的其中某一阶段。通常这种类型可以形象的称为"网上xx企业"。例如,网上银行、网上酒店等。 3.多媒体广告型:主要面向客户或者企业产品(服务)的消费群体,以宣传企业的核心品牌形象或者主要产品(服务)为主。这种类型无论从目的上还是实际表现手法上相对于普通网站而言更像一个平面广告或者电视广告,因此用"多媒体广告"来称呼这种类型的网站更贴切一点。 网页设计布局网页可以说是网站构成的基本元素。当我们轻点鼠标,在网海中遨游,一副副精彩的网页会呈现在我们面前,那么,网页的精彩与否的因素是什么呢?色彩的搭配、文字的变化、图片的处理等,这些当然是不可忽略的因素,除了这些,还有一个非常重要的因素——网页的布局。下面,我们就有关网页布局谈论一下。 1、“国”字型: 也可以称为“同”字型,是一些大型网站所喜欢的类型,即最上面是网站的标题以及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种结构是我们在网上见到的差不多最多的一种结构类型。 2、拐角型: 这种结构与上一种其实只是形式上的区别,其实是很相近的,上面是标题及广告横幅,接下来的左侧是一窄列链接等,右列是很宽的正文,下面也是一些网站的辅助信息。在这种类型中,一种很常见的类型是最上面是标题及广告,左侧是导航链接。 3、标题正文型: 这种类型即最上面是标题或类似的一些东西,下面是正文,比如一些文章页面或注册页面等就是这种类。 4、封面型: 这种类型基本上是出现在一些网站的首页,大部分为一些精美的平面设计结合一些小的动画,放上几个简单的链接或者仅是一个“进入”的链接甚至直接在首页的图片上做链接而没有任何提示。这种类型大部分出现在企业网站和个人主页,如果说处理的好,会给人带来赏心悦目的感觉。 5、“T”结构布局 所谓“T”结构布局,就是指网页上边和左边相结合,页面顶部为横条网站标志和广告条,左下方为主菜单,右面显示内容,这是网页设计中用得最广泛的一种布局方式。在实际设计中还可以改变“T”结构布局的形式,如左右两栏式布局,一半是正文,另一半是形象的图片、导航。或正文不等两栏式布置,通过背景色区分,分别放置图片和文字等。 这样的布局有其固有的优点,因为人的注意力主要在右下角,所以企业想要发布给用户的信,大都能被用户以最大可能性获取,而且很方便,其次是页面结构清晰,主次分明、易于使用。缺点是规矩呆板,如果细节色彩上不注意,很容易让人“看之无味”。 6、“口”型布局 这是一个形象的说法,指页面上下各有一个广告条,左边是主菜单,右边是友情链接等,中间是主要内容。 这种布局的优点是页面充实、内容丰富、信息量大,是综合性网站常用的版式,特别之处是顶部中央的一排小图标起到了活跃气氛的作用。缺点是页面拥挤,不够灵活。也有将四边空出,只用中间的窗口型设计,例如网易壁纸站使用多帧形式,只有页面中央部分可以滚动,界面类似游戏界面。使用此类版式的有多维游戏娱乐性网站。 7、“三”型布局 这种布局多用于国外网站,国内用得不多。其特点是页面上横向两条色块,将页面整体分割为4个部分,色块中大多放广告条。 8、 对称对比布局 顾名思义,它指采取左右或者上下对称的布局,一半深色,一半浅色,一般用于设计型网站。其优点是视觉冲击力强,缺点是将两部分有机地结合比较困难。 9、POP布局 POP源自广告术语,指页面布局像一张宣传海报,以一张精美图片作为页面的设计中心。常用于时尚类网站,优点显而易见:漂亮吸引人,缺点是速度慢。 提高效率:最好的方法莫过于模块化,此前国内少有真正优秀的网页模板,PSD吧专注设计多年,拥有一批高水准的设计师,PSD吧公开下载顶尖设计档次的模板,并授权用于商业,可大大提高网页设计的效率。 另外,像来自美国,现在风靡亚洲的怪兽模板网站,其网站上的网站模板设计具有很高的水平。怪兽模板开发了很多CMS网站模板包括joomla,WordPress,magento,drupal,mambo等,以及设计精美的ZenCart,magento,oscommerce网店系统等目前市场上最流行各种类型各种行业的的网站模板。 网页设计存在的误区一、不重视域名和空间 不少企业在进行网页设计时的时候,不注重域名和空间的稳定性,随便找个域名和空间来注册。一个空间可以存放很多网站,一旦其中一个网站被降权或被K那将影响到其他的网站,选择好的、有保障的供应商非常重要。 二、注重外观不注重实用 目前,很多企业在进行网页设计时,网站注重网站外观是否漂亮,有的网页为追求漂亮,用了大量的flash,实际上flash不利于百度蜘蛛的抓取,不利于企业开展网络营销,建议企业在进行网页设计时的时候,不仅要重视它的外观是否漂亮,还要注意网页是否迎合搜索引擎的喜好。 三、网站维护的缺乏 很多企业把网页建好以后就不管不问了,有的网页成年累月没有更新内容,这样百度就无法收录对于企业来说,必须找一些专业人士进行网页内容更新。 网站设计工作内容1 、负责对网站整体表现风格的定位,对用户视觉感受的整体把握; 2、进行网页的具体设计制作; 3、产品目录的平面设计; 4、各类活动的广告设计; 5、协助开发人员页面设计等工作。 同名图书作/译者:顾群业出版社:山东美术出版社 图书目录 一、网页设计的内容与意义 二、网页设计的概念 (一)网页设计的内容 (二)网页设计的原则 (三)网页设计的特点 (四)网页设计的过程 参考书籍图书信息作 者:殷辛,段芸,陈逢华 主编出 版 社:华中科技大学出版社 出版时间:2011-1-1 版 次:1 页 数:128 字 数:250000 印刷时间:2011-1-1 开 本:大16开 纸 张:铜版纸 印 次:1 I S B N:9787560966564 包 装:平装 内容简介本书按照四个项目,分别讲述了网页建设和设计的基本理论、Dreamweaver的入门及制作、Flash的入门及制作、Fireworks的入门及制作等方面的内容。本书的编著者主要为有企业实战经验的教学一线专业教师,搜集了工作案例结合教学讲义编写出来的,是多年教学经验的结晶。此外,许多高校的教师同行给本书提出了宝贵的建议。 本书是“高职高专艺术设计类‘十二五’规划教材”,“国家示范性高等职业院校艺术设计专业精品教材”。 目录项目一 网页建设和设计的基本理论 任务一 了解网络运行环境 任务二 了解网页设计基本理论 项目二 Dreamweaver的入门及制作 任务三 初识Dreamweaver中的站点建立 任务四 网页中的基本元素 任务五 网页中的布局 任务六 初识Dreamweaver中的超链接的基本理论和方法 任务七 网页中的表单 任务八 模板的应用 任务九 CSS样式的应用 任务十 网页中的行为 项目三 Flash的入门及制作 任务十一 FLASH快速入门 任务十二 FLASH中的工具讲解 任务十三 FLASH中的基础知识 任务十四 FLASH中的创建基本动画 任务十五 FLASH中文本以及图片的编辑 任务十六 FLASH中制作按钮 任务十七 FLASH中声音设置 任务十八 FLASH中的影片剪辑 项目四 Fireworks的入门及制作 任务十九 Fireworks简介 任务二十 Fireworks中工具的介绍 任务二十一 Fireworks中图形的编辑 任务二十二 Fireworks中动画的制作 任务二十三 Fireworks中切片和链接的应用 |
随便看 |
百科全书收录4421916条中文百科知识,基本涵盖了大多数领域的百科知识,是一部内容开放、自由的电子版百科全书。