专业导入课程设计指导书_网络工程.doc
专业导入课程设计指导书网络工程专业吴臣 胡明 编写专 业: 网络工程 _ _学 院:电子与信息工程学院二一四 年 六 月目 录一、目的和要求1二、主要内容(网站制作与设计)1三、教学方式和时间安排1四、课程设计的考核评定2五、说明2六、参考资料2七、附录3网站材料处理31 Photoshop操作要点32 Flash操作要点33 Dreamweaver操作要点4网站建设81 简介82 建设步骤93 前期准备93.1 针对对象93.2 频道103.3 风格103.4 布局103.5 预算104 主流代码布局115 网站建设流程116 做网站前的市场分析117 建设格式128 考虑因素128.1 网站风格128.2 创意128.3 网站LOGO128.4 视觉流程138.5 网页框架与布局138.6 网站配色149 基础建设1510 注意事项1511 网站风格1612 重要因素1712.1 明确目的精心策划1712.2 保持网页的朴素1712.3 简单并不等于乏味1712.4 提高被查询的机会1713 作用效果1813.1 企业形象展示与提升1813.2 网络化的业务用户管理1813.3 开展电子商务1814 用户体验1914.1 用户都是浏览者1914.2 少等于多1914.3 导航1914.4 下载速度1914.5 对用户获取信息的影响1915 经验技巧2016 建设流程2117 相关法规2118 网站颜色2219 工具技术2220 发展趋势2221 网站建站流程2222 中西方网页设计2323 质量监控2324 设计原则23一、目的和要求1、学会查找资料并善于分析资料,提倡学生互相学习、培养团队精神;2、培养严谨的工作作风、独立思考问题、独立设计、独立调试程序的能力;3、了解网站制作的简易流程,认识到每步的要点与重点;4、认识网站设计基本开发平台,对涉及到的相关知识进行查阅并做出初步的网站设计;5、给出设计系统的概要设计、详细设计,锻炼学生分析、设计、编码、调试程序和书写必要文档的综合处理能力;6、了解在网站设计上的一般做法,并认识与网络工程专业相关的基础知识,认清专业方向;7、编写规范化的课程设计说明书,并参加上机面试答辩。二、主要内容(网站制作与设计)1了解认识网站制作基本流程为:策划与草图、设计与制作、切割与导出、编辑与模板、动画与广告、链接与上传等六个阶段。主要完成以下相关内容:1)策划与草图:学习收集所需材料,并进行网站规划与草图设计、版块安排等;重点注意网站的风格,用色,版式,布局,栏目; 2)设计与制作:应用相关软件进行材料处理(如Photoshop等),养成良好的设计习惯;3)切割与导出:应用Photoshop等软件对框架与材料进行切割,导出存为相应的WEB格式;4)编辑与模板:在Dreamweaver等网站编辑平台上进行材料组织、编辑,并能通过模板进行页面安排与调换,养成好的模板设计习惯;5)动画与广告:进行一定的动画制作(如Flash等),并插入到安排好的网站页面中;6)链接与上传:设置网站页面上的导航与链接,上传到申请空间或本机进行测试,调试系统效果。2对网站设计中涉及到的平台、工具等进行查阅及学习,锻炼通过网络进行自我学习的能力。三、教学方式和时间安排1教学方式:首先教师进行网站建设的相关知识介绍、常用平台或软件的使用演示;再提出要求,下达任务,让学生查阅、收集相关资料,进行网络或书籍学习,了解需要解决的问题关键,做出网站设计草图;再让学生对相应工具进行突击学习,达到初步运用,接着在老师指导下,进行网站的制作与设计,完成相应的调试,初步实现学生自己的预期目标。2时间安排:按照网络工程设计的思想,网站的需求分析设计至关重要,并要充分重视书写“文档”。时间安排上分以下三个阶段进行:阶段一(时间一天半):查阅资料,了解同网站制作与设计相关的工具与方法,并做好记录,搭建好网站建设平台;阶段二(时间两天):根据网络工程建设流程,先按网站制作的六个阶段分开处理或准备相应的材料,再将材料进行汇集,初步实现预期效果;阶段三(时间一天半):具体设计并实现网站的初步功能,并归纳文档资料,按要求填写在课程设计说明书上,并参加答辩。三个阶段的时间分配比例约:30%,45%,25%。四、课程设计的考核评定考核从三方面进行:网站材料处理,网站设计系统演示,报告文档等进行综合考核。课程设计成绩由以下部分组成:考勤:10%,现场检查:50%,其中材料处理、方案设计、系统演示比例为1:2:2,课程设计说明书:40%。五、说明课程设计报告的文档资料,主要包括以下内容:(1)网站制作的基本流程及其说明;(2)网站制作时的材料处理方法说明;(3)课程设计中遇到的主要问题和解决方法;(4)创新和得意之处;(5)课程设计存在的不足,需进一步改进的设想;(6)课程设计的感想和心得体会。以上内容均填写在课程设计说明书上,要求干净整洁,符合课程设计的要求和规范。六、参考资料1)参考书籍:1 赵元媛 著.网站开发与设计教程M,北京:清华大学出版社,20112 李宝敏.动态网站设计与开发实用教程M,北京:清华大学出版社,20123 熊锡义 主编.Dreamweaver网页制作教程M,北京:清华大学出版社,20074 周雅铭等著.Photoshop基础教程M,北京:中国传媒大学出版社,20085 詹青龙,郭永灿 主编. 网页设计与制作M,北京:清华大学出版社,20106 王晓红,龚毅 主编. 网页设计与制作M,北京:机械工业出版社,20112)学习软件:Photoshop,Flash,Dreamweaver等3)参考网站:1 2 http:/www.code-3 4 七、附录网站材料处理1 Photoshop操作要点Photoshop是以静态图形为主,其操作中,一般的原则是:先构思图形,再分层叠加出效果;最后渲染输出成合适的文件类型,常见为Jpeg,Gif,Png。典型做法是制作图标、抠图等。1) 图标制作关键要点:先拉大体图形;再分图层处理相应的特效;然后合成图层;最后收尾渲染。例如,手绘玻璃质感的APP软件图标,详见: edu/article_71233.html2)抠图关键要点:利用钢管工具(或套索)进行边缘的区域选择;再去除背景色;调整自己的背景色或图案产生对应的效果图。例如,PS中如何给美女换不同衣服的入门教程,详见: edu/article_53218.html2 Flash操作要点Flash是以矢量图为主,其操作的一般原则是:先构造图元(可以是单帧或多帧);再结合转换成影片(MC)或按钮;进行相应的特效处理,编辑进实际场景中去展示。其输出一般是Swf形式。典型做法有:背景色透明、读外部数据、文字处理等等。Flash最大的特点是图形是矢量图,可以结合编程语言进行控制,还可以对图形进行编辑及特效处理。1)设置背景色为透明色示例见:2)读外部数据(文本|XML|ASP)示例见:3)文字处理示例见:3 Dreamweaver操作要点1)HTML基础了解认识HTML中的基本元素,如:Body,Head,Title,P,Table等等。HTML的元素般是成对出现的,如:<h1></h1>。2)CSSCSS即级联(层叠)样式表(Cascading Style Sheet)的简称。有三种方法可以在站点网页上使用样式表:l 将网页链接到外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择。在使用外部CSS样式表的情况下,你可以通过改变一个文件来改变整个站点的外观。每个页面使用标签链接到样式表。标签在(文档的)头部:如蓝色所示。<html><head><title>外部引用的例子</title><link rel=stylesheet href="mystyle.css" type="text/css"></head><body><h1>5dMedia Studio</h1><p>多媒体原创的魅力!</p></body></html>浏览器会从文件mystyle.css中读到样式声明,并根据它来格式文档。外部CSS样式表可以在任何文本编辑器进行编辑。文件不能包含任何的html标签。样式表应该以.css扩展名进行保存。下面是一个样式表文件的例子:hrcolor:sienna; pmargin-left:20px; bodybackground-image:url("images/back40.gif"); l 在网页上创建嵌入的样式表当单个文档需要特殊的样式时,就应该使用内部样式表。你可以使用<style>标签在头部分定义内部样式表,就像这样:<html><head><title>外部引用的例子</title><styletypestyletype="text/css"> hrcolor:sienna; pmargin-left:20px; bodybackground-image:url("images/back40.gif"); </style> </head><body><h1>5dMedia Studio</h1><p>多媒体原创的魅力!</p></body></html>l 应用内嵌样式到各个网页元素由于要将表现和内容混杂在一起,内联样式会损失掉样式表的许多优势。请慎用这种方法,例如当样式仅需要在一个元素上应用一次时。要使用内联样式,你需要在相关的标签内使用样式(style)属性。Style属性可以包含任何CSS属性。本例展示如何改变段落的颜色和左外边距:<p style="color:sienna;margin-left:20px"> This is a paragraph </p> CSS应用非常广泛,可以参考 art/.htm。3)JavaScriptJavaScript,一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML网页增加动态功能。然而现在JavaScript也常被用于网络服务器中。l 语句JavaScript程序是由若干语句组成的,语句是编写程序的指令。JavaScript提供了完整的基本编程语句,它们是:赋值语句、switch选择语句、while循环语句、for循环语句、for each循环语句、do.while循环语句、break循环中止语句、continue循环中断语句、with语句、trycatch语句、if语句(if.else,ifelse if)。l 函数函数是命名的语句段,这个语句段可以被当作一个整体来引用和执行。使用函数要注意以下几点:(1)函数由关键字function定义(也可由Function构造函数构造)(2)使用function关键字定义的函数在一个作用域内是可以在任意处调用的(包括定义函数的语句前);而用var关键字定义的必须定义后才能被调用(3)函数名是调用函数时引用的名称,它对大小写是敏感的,调用函数时不可写错函数名(4)参数表示传递给函数使用或操作的值,它可以是常量,也可以是变量,也可以是函数,在函数内部可以通过arguments对象(arguments对象是一个伪数组,属性callee引用被调用的函数)访问所有参数(5)return语句用于返回表达式的值。(6)yield语句扔出一个表达式,并且中断函数执行直到下一次调用next。一般的函数都是以下格式:function myFunction(params) /执行的语句函数表达式:var myFunction=function(params)/执行的语句var myFunction = function()/执行的语句myFunction();/调用函数匿名函数,它常作为参数在其他函数间传递:window.addEventListener('load',function()/执行的语句,false);l 对象JavaScript的一个重要功能就是面向对象的功能,通过基于对象的程序设计,可以用更直观、模块化和可重复使用的方式进行程序开发。一组包含数据的属性和对属性中包含数据进行操作的方法,称为对象。比如要设定网页的背景颜色,所针对的对象就是document,所用的属性名是bgcolor,如document.bgcolor="blue",就是表示使背景的颜色为蓝色。l 事件用户与网页交互时产生的操作,称为事件。事件可以由用户引发,也可能是页面发生改变,甚至还有你看不见的事件(如Ajax的交互进度改变)。绝大部分事件都由用户的动作所引发,如:用户按鼠标的按键,就产生click事件,若鼠标的指针在链接上移动,就产生mouseover事件等等。在JavaScript中,事件往往与事件处理程序配套使用。而对事件的处理,W3C的方法是用addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉。为了安全性,建议将第三个参数始终设置为false传统的方法就是定义元素的on事件,它就是W3C的方法中的事件参数前加一个“on”。而IE的事件模型使用attachEvent和dettachEvent对事件进行绑定和删除。JavaScript中事件还分捕获和冒泡两个阶段,但是传统绑定只支持冒泡事件。l 变量常用类型:object:对象array:数组number:数boolean:布尔值,只有true和false两个值,是所有类型中占用内存最少的null:一个空值,唯一的值是nullundefined:没有定义和赋值的变量命名形式:一般形式是:var <变量名表>其中,var是javascript的保留字,表面接下来是变量说明,变量名表是用户自定义标识符,变量之间用逗号分开。和C+等程序不同,在javascript中,变量说明不需要给出变量的数据类型。此外,变量也可以不说明而直接使用。l 运算符javascript提供了丰富的运算功能,包括算术运算、关系运算、逻辑运算和连接运算。算术运算符javascript中的算术运算符有单目运算符和双目运算符。双目运算符包括:+(加)、-(减)、*(乘)、/(除)、%(取模)、|(按位或)、&(按位与)、<<(左移)、>>(右移)等。单目运算符有:-(取反)、(取补)、+(递加1)-(递减1)等。关系运算符关系运算符又称比较运算,运算符包括:<(小于)、<=(小于等于)、>(大于)、>=(大于等于)、=(等于)和!=(不等于)。关系运算的运算结果为布尔值,如果条件成立,则结果为true,否则为false。逻辑运算符逻辑运算符有:&(逻辑与)、|(逻辑或)、!(取反,逻辑非)、(逻辑异或)。字符串连接运算符连接运算用于字符串操作,运算符为+(用于强制连接),将两个或多个字符串连结为一个字符串。三目操作符?:三目操作符“?:”格式为:操作数?表达式1:表达式2三目操作符“?:”构成的表达式,其逻辑功能为:若操作数的结果为true,则表述式的结果为表达式1,否则为表达式2。例如max=(a>b)?a:b;该语句的功能就是将a,b中的较大的数赋给max。网站建设网站建设包括网站策划、网页设计、网站功能、网站优化技术、NNT流量、网站内容整理、网站推广、网站评估、网站运营、网站整体优化、网站改版等。网站建设的前期准备包括了前期网站定位、内容差异化、页面沟通等战略性调研,这些确立后,再去注册域名、租用空间、网站风格设计、网站代码制作五个部分,这个过程需要网站策划人员、美术设计人员、WEB程序员共同完成。1 简介网站建设是指使用标识语言(markup language),通过易雅达一系列设计、建模、和执行的过程将电子格式的信息通过互联网传输,最终以图形用户界面(GUI)的形式被用户所浏览。简单来说,网页设计的目的就是产生网站。简单的信息如文字,图片(GIF, JPEG,PNG)和表格,都可以通过使超文件标示语言、可扩展超文本标记语言等标示语言放置到网站页面上。而更复杂的信息如矢量图形、动画、视频、声频等多媒体档案则需要插件程序来运行,同样地它们亦需要标示语言移植在网站内。网站建设是一个广义的术语,涵盖了许多不同的技1能和学科中所使用的生产和维护的网站。不同领域的网页设计,网页图形设计,界面设计,创作,其中包括标准化的代码和专有软件,用户体验设计和搜索引擎优化。许多人常常会分为若干个工作小组,负责网站不同方面的设计。网页设计是设计过程的前端(客户端)的设计,通常用来描述的网站,并不是简单的一个页面,一个网站是包括很多工作的,其中包括设计效果图,布局页面,写代码等工作。2 建设步骤一、申请域名(域名备案 ICP(Internet Content Provider)网络内容服务商,即通常所说的网络运营商);二、申请空间 ;三、定位网站 ;四、分析网站功能和需求(网站策划);五、网站风格设计 ;六、网站代码制作;七、测试网站; 八、FTP上传网站;九、完善资料;十、网站维护十一、网站推广3 前期准备网站建设前期准备工作相当重要,这决定你建站的目的,以及日后维护网站,让你的网站发挥作用等是相当的重要。网站建设是指使用标识语言(markup language),通过易雅达一系列设计、建模、和执行的过程将电子格式的信息通过互联网传输,最终以图形用户界面(GUI)的形式被用户所浏览。简单来说,网页设计的目的就是产生网站。简单的信息如文字,图片(GIFs, JPEGs,PNGs)和表格,都可以通过使超文件标示语言、可扩展超文本标记语言等标示语言放置到网站页面上。而更复杂的信息如矢量图形、动画、视频、声频等多媒体档案则需要插件程序来运行,同样地它们亦需要标示语言移植在网站内。在设计网站前,必须先准备好以下工作:3.1 针对对象在设计网站前,必须告诉网站所针对的人群、区域、国家等。如果能提供某种行业的更好,这样在设计上就会针对这种人群的浏览习惯特别定制您的网页。3.2 频道网站频道就是网站的大框架,也就是主体部分,比如:首页,公司简介,新闻动态,产品展示,在线留言,联系我们等,这是标准的企业网站的内容。如果你有特定的框架,请您一一列出,这样方便我们设计。3.3 风格您必须知道您网站的目的,是以广告形式、还是仅给现有的老客户观察?是功能型的,还是展示型的?风格定位要准确,功能型的是,网站在美工设计上可能不适合大块图片,在数据功能上比较强大,比如搜索,会员注册等,一般大型企业网、购物网、大型门户、交友网等都是属于功能型的,如果是展示型的,这种类型的网站可能大部分追求视觉上的美丽,对功能要求不高。那在美工上面,设计上就得有强烈的视觉感了。这种网站一般属于:美容业、女性用品、服饰等。3.4 布局从用户的体验角度来说,企业网站布局时一定要复合用户在浏览时的习惯,想很多网站都有一个网站新闻的分类或者是新闻内容的页面,这些页面在上面最好是添加回到主页或者是回到新闻列表页的链接,用户能方便的返回自己的浏览历史页,在这里最近很多网站都对于自身的页面分页都做了一个细微的调整,就是下一页比上一页的字体大而且width长,为的就是能更加的让用户有下一页的习惯。这是对于用户体验的一种好的做法,也当然也是对于自身网站假设友好性的一个加强。如果你的新闻往往是长篇大论的话,一定要加上右侧是滑动的返回顶部的链接,不然用户在查看你的长文章时会有损体验度。最近非常流行瀑布流效果,尤其是对于图片网站或者是购物导航站都纷纷效仿,提醒各位在企业网站中对于图片或者是新闻页面使用瀑布流时最好加上用户在浏览瀑布流的内容时能一直保持在页面一侧的快捷导航或者是置顶的一个导航条,这一点在用户体验效果上能大大的加强瀑布流给浏览者的体验友好度。企业网站最好是在每个页面都设置tkd(title、keywords、description),在很多的企业站一直会出现一个这样的问题,就是在新闻内页的title都设置了显示不同的,但是在关键字和描述上每新闻和文章都是一样的,这样对于搜索引擎的抓取和识别对于网站的优化有很大的副作用,有时因为这些会导致网站被k。3.5 预算如果您对您的网页不清楚,没经验,不要紧,您最好告诉建站公司您最大程度的预算,他们会全程为您提供服务。4 主流代码布局DIV(区)+CSS(层叠样式表)l 构成文字与图片是构成一个网页的两个最基本的元素。你可以简单地理解为:文字,就是网页的内容。图片,就是网页的美观。除此之外,网页的元素还包括动画、音乐、程序等等。在网页上点击鼠标右键,选择菜单中的 “查看源文件” ,就可以通过记事本看到网页的实际内容。可以看到,网页实际上只是一个纯文本文件。它通过各式各样的标记对页面上的文字、图片、表格、声音等元素进行描述(例如字体、颜色、大小),而浏览器则对这些标记进行解释并生成页面,于是就得到你现在所看到的画面。 为什么在源文件看不到任何图片? 网页文件中存放的只是图片的链接位置,而图片文件与网页文件是互相独立存放的,甚至可以不在同一台计算机上。5 网站建设流程1)需求沟通,客户提出网站建设的基本需求,包括设计要求及功能要求2)项目评估及报价,根据客户提出的需求进行评估,估算出相应的时间与费用3)签订合同,合作双方确认费用、工期、合作要求的基础上,双方共同签订合同4)提案阶段,完成网站初稿DEMO设计,包括首页风格,内页风格页面5)确认与修改,客户对初稿进行审核,然后提出意见,然后进行完善,并最终确认初稿设计风格6)制作阶段,完成所有页面的设计,进行程序开发以及前后后台的页面整合7)调试阶段,对网站进行调试,调试程序的稳定性,链接和运营的畅通性8)网站验收,根据合同条款进行网站验收,并签署网站验收确认单9)后续服务,确认后期网站的维护服务,和具体维护区域6 做网站前的市场分析1)相关行业的市场是怎样的,市场有什么样的特点,是否能够在互联网上开展公司业务。2)市场主要竞争者分析,竞争对手上网情况及其网站策划、功能作用。 3)公司自身条件分析、公司概况、市场优势,可以利用做网站提升哪些竞争力,做网站的能力(费用、技术、人力等)。 第二步、怎么做网站的定位及功能?1)为什么要做网站,是为了树立企业形象,宣传产品,进行电子商务,还是建立行业性网站?是企业的基本需要还是市场开拓的延伸? 2)整合公司资源,确定网站功能。根据公司的需要和计划,确定做网站的功能类型:企业型网站、应用型网站、商业型网站(行业型网站)、电子商务型网站;企业网站又分为企业形象型、产品宣传型、网上营销型、客户服务型、电子商务型等。 3)根据做网站目的确定网站的功能。 4)企业内部网的建设情况和网站的可扩展性。 7 建设格式l 静态网页静态网页多数为单一的超文件标示语言档案。现今不少网站建设皆倾向把动态网页静态化,从而令搜寻引擎最佳化。l 动态网页动态网页的内容随着用户的输入和互动而有所不同,或者随着用户、时间、数据修正等而改变。8 考虑因素8.1 网站风格风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。整体形象包括站点的版面布局,色彩,字体,浏览方式等。如:我们觉得迪斯尼是生动活泼的而IBM则是专业严肃的。每一个网站都会给人 们留下的不同感受。这里我们需要做到的是根据网站的定位做出网站特有的风格。除此我们还需要在风格同一上需要把握一下,其实这个风格的统一和传统的印刷出版物没什么区别。你网页上所有的图像、文字,包括像背景颜色、区分线、字体、标题、注脚什么的,都要统一风格,贯穿全站。这样子用户看起来舒服、顺畅,会对你的网站留下一个“很专业”的印象。而企业网站设计师往往就缺乏这一点,没有全局意识。8.2 创意所谓创意就是不拘一格?某些设计师在做创意的时候大费周章,做出来确实不可否认很有创意、很别致,但往往对于行业网站的客户为什么不能接受呢?此时不要太责怪客户的不识货,应该反思,抓住客户的需求。其实做行业网站不需要很多大的创意,也不要浪费过多的时间去追求如何个性、如何好看,我们只需要一点小小的创意贯穿全站,也许会使网站更生动更具有吸引力、更有思想,比如中国现车交易网(2005年此站已经消失)就是一个很好的案例,它把车的外形融入到网站中,使它脱颖而出。8.3 网站LOGOLogo顾名思义就是站点的标志图案,logo最重要的就是用图形化的方式传递网站的定位和经营理念、同时便于人们识别。网站logo的设计过程中一般有以下三种思路:1、直接以网站网址作为logo。2、根据网站提供的产品/服务特点展开logo设计。3、以传递网站运营商的经营理念为特色。作为一个公司或者企业,需要一个可以代表公司形象与特征的标志,同样,作为一个网站,也需要有一个代表网站形象与功能的标志,这个标志就是网站的logo,作为网站的形象代表,网站的logo需要经过专业的设计并赋予一些理念。banner就是一个网站的横幅广告,位于网站的最上面或者中间,一般用来体现网站中最重要的内容。8.4 视觉流程人们在阅读某种信息时,视觉总有一种自然的流动习惯,先看什么,后看什么,再看什么。在心理学的研究表明,一般的浏览习惯是从上到下、从左到右,在一个平面上,上松下稳而压抑。同样,平面的左松右稳。所以平面的视觉影响力上方强于下方,左侧强于右侧。这样平面的上部和中上部被称为“最佳视域”,也就是最优选的地方。在网页设计中一些突出或推荐的信息通常都放在这个位置。当然这种视觉流程只是一种感觉并非一种固定的公式,只要符合人们的心理顺序和逻辑顺序,就可以更为灵活地运用,在网页设计中,灵活而合理地运用直接影响到传达信息的准确与有效性。8.5 网页框架与布局网页布局大致可分为“国”字型、拐角型、“T”字型、“L”字型、综合框架型、Flash型、变化型,在这里就不做一一论述了。其实在我们做设计的时候并没有过多的去考虑什么形式,比如我们在一张纸看到一个圆形的东西,很容易可以联想到它像太阳,而有些人则联想到月亮等等这都是一种形式比喻,最重要的是抓住客户的需求,把握网站的定位做处合理的框架布局。1)分辨率网页的整体宽度可分为三种设置形式:百分比、象素、象素+百分比。通常在网站建设中以象素形式最为常用,行业网站也不列外。我们在设计网页的时候必定会考虑到分辨率的问题,科技发展到现在我们通常用的是1024*768和800*600的分辨率,现在网络上很多都是用到778个象素的宽度,在800的分辨率下面往往使整个网页很压抑,有种不透气的感觉,其实这个宽度是指在800*600的分辨率上网页的最宽宽度,不代表最佳视觉,不妨试试760770的象素,不管在1024还是800的分辨率下都可以达到较佳的视觉效果。2)合理广告在目前一些网站的广告(弹出广告、浮动广告、大广告、banner广告、通栏广告等等)让人觉得很烦琐,根本就不愿意来看,有时连你这个网站都不上了,这样一来网站受到了严重的影响、广告也没达到广告的目的。这些问题都是我们在设计网站之前需要考虑、需要规划的内容之一。浮动广告有两种,第一种是在网页两边空余的地方可以上下浮动的广告,第二种是满屏幕到处随机移动的广告。建议能使用第一种的情况下尽量使用第一种,不可避免第二种情况时尽量在数量上控制最多一个就好。如果数量过多会直接影响到用户的心理、妨碍到用户浏览信息,适得其反。首页广告不宜过多适中即可。如在注册或者某个购买步骤的页面上最好不要出现过多的其他无关的内容让用户分心,避免客户流失等3)空间的合理利用很多的网页都具有一个特点,用一个字来形容,那就是“塞”,它将各种各样的信息如文字、图片、动画等不加考虑的塞到页面上,有多少挤多少,不加以规范,导致浏览时会遇到很多的不方便,主要就是页面主次不分,喧宾夺主,要不就是没有重点,没有很好的归类,整体就像个大杂烩。让人难以找到需要的东西。有的则是一片空白失去平衡,也可以用个“散”字来形容。并非要把整个页面塞满了才不觉得空,也并非让整个页面空旷才不觉得满,只要合理的安排、有机的组合,使页面达到平衡,即使在一边的部分大面积留空,同样不会让人感到空,相反这样会给人留下广阔的思考空间,给人回味又达到了视觉效果。4)文字编排在网页设计中,字体的处理与颜色、版式、图形化等其他设计元素的处理一样非常关键。l 文字图形化文字图形化就是将文字用图片的形式来表现,这种形式在页面的子栏目里面最为常用,因为它具有突出,同时又美化了页面,使页面更加人性化加强了视觉效果。是文字无法达到的。对于通用性的网站弊端就是扩展性不强。l 强调文字如果将个别文字作为页面的诉求重点,则可以通过加粗、加下划线、加大号字体、加指示性符号、倾斜字体、改变字体颜色等手段有意识地强化文字的视觉效果,使其在页面整体中显得出众而夺目。这些方法实际上都是运用了对比的法则。如果在更新频率低的情况下也可以使用文字图形化。8.6 网站配色1)用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。2)用两种色彩。先选定一种色彩,然后选择它的对比色(在Photoshop里按ctrl+shift+I)再进行微小的调整。整个页面色彩丰富但不花稍。3)用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。也就是在同一色系里面采用不同的颜色使网页增加色彩,而又不花,色调统一。这种配色方法在网站设计种最为常用。4)灰色在网页设计中又称为“万能色”,其特点是可以和任何颜色搭配,在使用时把握量避免网页变灰。在网页配色中,尽量控制在三种色彩以内,以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。9 基础建设基础建设即网站的建设,分析用户市场以后就要根据实际情况去为用户搭建这个平台。基础建设你可以建设小而精,也可以大而全,根据自身情况来定位都是可以的。总之,从用户出发,将你“市场”用户可能用到的需求做一个归纳整理后的建设,满足了用户所有的需求,这样的网站必将是一个可以留得住用户的网站,用户的忠诚度无疑也会提高不少。10 注意事项1)对每一个超级链接点击之后采用新开窗口还是直接跳转,必须认真对待。如果用户点击一个link之后是要放弃当前页面开始新的体验,则应用直接跳转。如果用户点击link是要了解更多的信息,但是当前页面的信息仍然有用,则应新开窗口。2)在每一个用户可能需要帮助的地方提供帮助信息或帮助按钮。完善的帮助系统是一个产品,网站成功很重要的因素。3)区别对待你用户中的菜鸟和大虾,对于菜鸟有简单易上手的教程和循序引导,对于大虾应有快速开始体验的绿色通道。4)对每一个功能使用的词语要慎重措辞。易懂,清楚描述提供的功能含义。不要让过于"酷"的词语吓跑用户。5)是否有良好的快速的Bug反馈机制和投诉渠道,并且对bug与投诉及时反应。不要让这些问题石沉大海,没有回应。同时注意,尽量不要使用email这样的反馈机制,开发一个良好互动的反馈系统是有必要的。让其他用户可以看到另外的用户的提问和解答的情况。6)了解你的用户群习惯,Office,Windows的操作习惯无疑是他们最熟悉的,所以,Word式的编辑器,Windows式的操作界面对大多数用户来讲往往会是最友好的。当你不清楚的用户的喜好的时候,多搞简短的问卷调查来帮助你改善提高往往是有效的。7)在适当的时候和地方体现你的幽默是可爱的。用户会对这样的设置会心一笑,无形中增加对你的喜爱,认可度8)不要轻易对你的用户承诺什么,但是一旦承诺了,就要尽最大努力去兑现。9)对于由于开发者的粗心或者失误给用户造成的损失和伤害,不要沉默,不要试图去隐瞒否认,而是诚挚道歉,承担责任,解决问题。10)功能齐全不是最重要的。做好核心功能,对核心功能体验良好是应该优先考虑的。不是你推出的服务越多,用户越喜欢,而是你推出的某项核心服务足够好,吸引了用户。事实上,一个网站理论上可以提供的功能是可以无限增加的。不要忘记了用户来这里的最重要的目的。11)不要试图在一个还不错的产品里去强行捆绑(并且不可卸载)自己还不够成熟的产品。体验差的产品只会伤害用户,并且使得他们对你今后的改进也会保持一种惯性上的敬而远之。12)提供信息型的网站是应该让用户获取所需并且快速离开当前板块。13)在不泄漏商业机密的情况下,让用户知道你的开发进度和目标是值得赞许的。一个和用户足够接近并且亲切的开发团队能够赢得用户的认可。14)开放的心态尤其重要。让你的用户来去自由,从长远来讲可能反而能够对用户形成最大的粘性。不要像某些SP一样,一旦使用了其服务,就不让你在退订。不要让用户有上了贼船的感觉。15)粘住用户是我们的最终目的。但是注意途径和方式。说得虚一点:留住用户的心,比留住用户的人更加重要。16)网站在现在这个社会,一定要记得去备案!11 网站风格第一,确定网站风格是建立在有价值的内容之上的。网站建设之后有风格而没有内容,就好比绣花枕头一包草,好比一个性格傲慢但目不识丁的人。因此首先确保网站建设后里面的内容质量和价值性。这是最基本的,毋庸置疑。