资讯活动   News
联系我们   Contact
你的位置:首页 > 资讯活动 > 网站资讯

网站建设技术解析

2014-04-30 15:11:07      点击:
        网站建设技术更新很快,一个网站的界面设计寿命仅仅2-3年而已。不管是垃圾还是精品,都没有所谓的经典,经典只存在于是哪个首次成功创新性的应用。一个闭门造车者做出的东西,是远远赶不上综合借鉴者的。网页设计不同于其他艺术,在模仿加创新的网页设计领域当中,即便是完全自己设计的,也是沿用了人们已经认同的大部分用户习惯,而且这种沿袭的痕迹是非常的明显!还有哪个设计者敢腆着脸说,这都是我自己的原创设计?对于业界来说,经典只是个理念和象征! 
  不可否认,国内网页设计环境目前还停留在初级的认知阶段,也就是说,绝大多数人不知道网络的真正的可用之处,你去做一个业务的时候,不得不去做大量的说服教育工作。以乙方的身份去说服甲方,以专业角度去教育非专业认识,结果是可想而知的。也正是这种全体社会普遍的低认知水平,导致了大量网络垃圾的产生。 
  什么是好的网站建设
  (1)内容和功能决定表现形式和界面设计 
  常常拿到的任务是一张小纸条,上面两句话,叫你去做一个网站设计。有的人看看纸条就去设计页面了,凭两句话,你就可以为客户做一个页面设计,以我7、8年的设计经验,我都不敢去做,你真是我的偶像阿! 
  做网站,你需要了解客户的东西很多: 
  1、建站目的。 
  2、栏目规划及每个栏目的表现形式及功能要求。 
  3、主色、客户性别喜好、联系方式、旧版网址、偏好网址。 
  4、根据行业和客户要求,那些要着重表现。 
  5、是否分期建设、考虑后期的兼容性。 
  6、客户是否有强烈的建站欲望。 
  7、你是否能在精神意识上控制住客户。 
  8、面对你未接触的技术知识,你有底吗? 
  9. 网站类型。 
  等等... 
  当你把这些内容都了解清楚了时候,你的大脑中就已经给这个网站有个全面而形象的定位了,这时才是有的放矢去做界面设计的时候了。 
  (2)界面弱化 
  一个好的界面设计它的界面是弱化的,它突出的是功能,着重体现的是网站业提供给使用者主要是什么。这就涉及到浏览顺序、功能分区等等。 
  要让访客在0.5秒内就能把握网站的行业性质,1秒内就知道该从哪个地方开始使用这个网站,能点一次的,绝不点第二次。当然上面说的是大多数功能性网站,对于宣传展示性http://www.jianxin.net.cn网站,诸如加特效的或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做点缀。 
  •暗红黑——暗红主调。黑或灰底,暗红标题栏,文字内容背景为浅灰色。 
  (二)http://www.jianxin.net.cn网页设计理念 
  (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程序,能够用java script替代效果的则尽量不要使用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、不能忽视错别字 
  一个好的网站对设计的每一个细节都不会放过,哪怕是一个微小的拼写错误都是绝对不能出现的。但是遗憾的是,许多设计者都缺少这种技能。确保你拼写正确,并且格外注意平常容易误写的错别字,要时时刻刻保持一种严谨的科学态度。