网页毕业设计总结.doc

网页毕业设计总结篇一：网页设计个人小结网页设计个人小结经过为期两个星期的实习，在我们小组成员不懈的努力下终于完成了，从刚开始接触报告的时候到现在全部完成，虽然时间不是很长，但是所做的工作还是很多的，从个人报告，包括日志，个人小结，还有需求分析报告，可行性分析报告，系统分析报告，系统分析总结报告等等，我们觉得这次最大的收获就是小组的配合，在课程设计的过程中，我们不断地从讨论，分析到整理，到最终的完成稿，在其中我们花费的精力虽然很多，但是我们的团队合作精神得到了最大的体现。学习电子商务的这几年，经历过的网站制作工具有很多，比如说Dreamweaver， Fireworks，Flash，FrontPage还有Visual Web Developer，但从来也没有深入而系统的认识和了解，更谈不上如何去分析，如何去整理和归纳。除了作业中自己摸索，了解，运用这些软件，其他更深层次的软件的更是从来没有涉及过，所以不做深层的了解。由于有了这次的课程设计，就给了我们小组这样一个机会，仔细得熟悉Visual Web Developer，更深入的了解了其余软件，分析它相对于其他软件的优势和不足，这样对于我们选择运用也是大有裨益的。设计下来，我觉得收获很多，不仅对于制作网页的软件有一个全新的认识，并且在系统设计的技术方面也有了质的飞跃。关于这次总结，先从网站的页面设计说起，在设计过程中，注意到对于电子商务网站BtoC还是诸多好评的，单单从方便角度出发，已经是一个很重要的优点了，页面设计过程的时候，有些页面设计的填写，可详尽可简略，凸显主题，不是很能体现出这次调查的全面性，页面设计的很好，但从某些方面不是很完善，但是对于这次我觉得我们做的很尽心，我们努力的选择不同风格的页面去设计，并且在网页设计中，我们尽量的全面的问及我们所能涉及的问题，我们发现我们的获益很多，不仅仅单纯从问卷调查的过程，更从讨论中，汇总中我们了解了更多的知识，也全面提高我们对问题的分析能力。这次网站设计，我总结了几点：1）确定网站主题：对于内容主题的选择，要做到小而精，主题定位要小，内容要精。不要去试图制作一个包罗万象的站点，这往往会失去网站的特色，也会带来高强度的劳动，给网站的及时更新带来困难。2）掌握建网工具：在制作网页的时候，一定要熟练掌握软件的运用，要不断的摸索，对于细节的处理，我们需要做很多东西，只有不断的练习，才会更好的运用软件。3）确定网站界面 ：网站的题材确定后，就要将收集到的资料内容作一个合理的编排，尽可能删除那些与主题无关的栏目，尽可能将网站内最有价值的内容列在栏目上，尽可能从访问者角度来编排栏目以方便访问者的浏览和查询；辅助内容，如站点简介、版权信息、各板块要有相对独立性，各板块要有相互关联，各板块的内容要围绕站点主题；按栏目内容建立子目录。子目录的建立，首先按主栏目建立。友情连接内容较多，需要经常更新的可以建立独立的子目录。而一些相关性强，不需要经常更新的栏目，例如：网站简介、站长情况等可以合并放在一个统一目录下。所有程序一般都存放在特定目录，在每个主目录下都建立独立的Images目录。一般来说，一个站点根目录下都有一个默认地Images目录。将所有图片都存放在这个目录里很是不方便，比如在栏目删除时，图片的管理相当麻烦。所以为每个主栏目建立一个独立的Images目录是方便管理的。原因很简单，就是方便维护与管理。4）确定网站风格：“风格”是抽象的，是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI（标志，色彩，字体，标语）、版面布局、浏览方式、交互性、文字、语气、内容价值等等诸多因素，网站可以是平易近人的、生动活泼的也可以是专业严肃的。不管是色彩、技术、文字、布局，还是交互方式，只要你能由此让浏览者明确分辨出这是你网站独有的，这就形成了网站的“风格”。风格是有人性的，通过网站的色彩、技术、文字、布局、交互方式可以概括出一个站点的个性：是粗犷豪放的，还是清新秀丽的；是温文儒雅的，还是执著热情的；是活泼易变的，还是墨守成规的。接下来谈谈报告的撰写，我们这次需要写的报告比较多，但是我觉得这些报告都是必需要写的，在撰写报告之初我遇到了很大的困难，因为我不是很了解整体的结构与布局，并且这是我第一次写关于系统分析报告，而且系统方面知识，我了解的不是很全面，于是在网上我搜集了一些资料，系统设计，分为总体设计和详细设计。总体设计时，主要是一些功能模块的逻辑设计，只是宏观上的把握，具体的页面安排还要在详细设计以及接下来的具体实施中作相应的调整。所以，它只是起到一个指南的作用，或者说，类似于Dreamweaver中图像占位符的作用，它在此构成文档的完整性，也为后面的设计提供参照。这也恰恰反映了系统设计的承前启后的特点，一方面，它是对需求分析的扩展，另一方面，又是对后续系统实施的前提。总体设计是宏观上的把握，逻辑上的概括。详细设计阶段，从完整的信息系统的开发过程来说，包括输入设计，输出设计，数据库设计，代码设计，界面设计。而我们此次课程设计的重点在于网站设计及可用性设计，因此对于数据库方面的内容就涉及的比较少。这是整个设计工作的不足。最后来说说我们小组的网站设计，我觉得最主要从顾客出发，做到方便顾客的使用，对于我们小组的网站设计我觉得要简单，大方，以及美观，说起来容易但做起来真的不易，刚开始在选择网站的架构上大家的意见就不是很统一，最后在大家努力均衡下，最终敲定了架构，慢慢的我们都熟悉了设计的环境，接下来的设计进程加快了好多，在我们热烈的讨论中，慢慢的看着设计的成形，一种喜悦之情油然而生，看着自己的努力得到了回报，最后，在不断的讨论和修改中，我们定稿了，看着大家辛勤劳动的成果，我们小组成员都觉得对于这个课程设计我们收益还是很多的，不单单是界面设计方面，更是从团队合作方面，大家获益很多。最后来说说自己的日记以及个人总结的撰写，在刚开始写日记的时候，感觉思绪很匮乏，不知道该写些什么，虽然一天做的事很多，但是总感觉是流水账，在慢慢的几天适应以后，发现对于课程设计的体会越来越多，虽然在字数方面变化不大，但对于自己的体会感觉真的多了不少，也感觉到了在合作时完成任务的兴奋感和自己独立完成任务的感觉是不同的，在自己完成任务的时候，感觉很充实，但是我想一个人做事，涉及面不会是很广但是都融汇了自己的看法，也是一种突破。在此，我对此次课程设计做出自己的一些总结，在这次课程设计中，我发现了团队的重要性，分工的重要性，从该开始的懵懂，但最后慢慢完成所有的任务，我充分体会到了合作的真谛，在合作的过程之中我体会到了，相互合作是非常重要的，在一些细节方面，多亏小组成员的指点，让我发现许多的不足，在某些逻辑思考的不完善，节约了很多时间，因此最后很好的得完成任务。在此看来，团结合作的智慧和力量是不可忽视的，每个人都有自己所擅长的部分，只有团结一切可以团结的力量，发挥每一个人的才能，同心协力，才能够把任务最好得完成。感谢老师，在学期末能有这样的课程设计，在这课程设计的过程中我获益很多，不仅仅从知识的角度，也从与他人合作完成任务的能力得到提高。最后，我相信在我们小组成员们共同的努力下，虽然这份设计不一定是最完美的，但它凝聚着我们的劳动，我们觉得它是最棒的。篇二：网页制作课程设计报告总结一、引言课程设计是一块“试金石”，是加深对自我能力认识的重要途径。大学的学习基本上都是理论的接受，而缺少能力的熟练与加强，我们缺少的并不是知识的储备，而是能力的积蓄。但由于大学特殊的学习模式和环境，缺少实际情景的见证和实践活动的参与，同学之间缺乏必要的交流和比对，使得我们很多时候很难对自身的能力有明晰的认识，能力缺陷往往被遮蔽起来。而课程设计“前所未有”地考验着我们的知识迁移和运用能力、适应环境的能力、应对突发事件的能力以及如何处理人际关系等各方面的能力，为我们提供了不可多得的见证的机遇和平台。通过这次课设，我们可以新的思考维度有效发现自己能力上的缺陷。综合运用所学理论知识、方法和技能，开展实际工作，巩固专业技能，培养和强化社会沟通能力；树立新的发展起点和目标，通过课设，认识社会的需要，发现自身的差距，培养面对现实的正确态度和独立分析解决问题的基本能力；培养良好的职业精神，适应毕业以后的实际工作需求。二、课程设计目的掌握HTML格式语言，能使用网页设计工具，理解动态页面技术的工作原理三、课程设计任务（1）用HTML或网页设计工具设计网页（2）用IE浏览器浏览所设计的网页，要求页面美观，包含常见的HTML格式元素（3）包含动态页面技术（有脚本代码或后台逻辑代码）四、设计方案选择：选择动态页面和静态页面相结合，取长补短。设计分工：谷加林：主页、留言板、主页动态效果的代码编写协助所有组员完成代码的编写 杜春吉：主页设计、留言板设计、总体排版、协助所有组员完成设计。 蔡旺：注册网页代码编写和学校风貌网页设计及相关资料收集处理。 姜文粹：登录网页代码编写和学校简介网页设计及协助素材收集整理。五、具体设计内容作用：美化网站，提高网页的浏览效率，页面以简单风格为主，背景以白色为主。页面右上角边有网站导航条，背景以半透明白色为主。冲该页面可以看出，该网站主要是宣传学校，所以要简洁大方，不要太花哨。界面如图所示主页面部分代码如下：头部!DOCTYPE html PUBLIC "-/W3C/DTD XHTML 1.0 Transitional/EN"/retype/zoom/058f037d7375a417876f8f0f?pn=2&x=0&y=1851&raww=1325&rawh=578&o=png_6_0_0_166_633_636_278_892.979_1262.879&type=pic&aimh=209.38867924528304&md5sum=e8112525760bd44f83073adc9383e879&sign=5100fbca48&zoom=&png=276-399902&jpg=0-0” target=“_blank”点此查看headmeta http-equiv="Content-Typecontent="text/html; charset=utf-8/title南京工程学院欢迎您/titlelink type="text/cssrel="stylesheethref="css/base.css/link type="text/cssrel="stylesheethref="css/style.css/script type="text/javascriptlanguage="javascriptsrc="js/jquery-1.7.2.min.js"/scriptscript type="text/javascriptlanguage="javascriptsrc="js/common.js"/script script type="text/javascriptlanguage="javascriptsrc="js/flash.js"/script script type="text/javascriptlanguage="javascriptsrc="js/scroll.js"/script /headbodydiv style="border-top:6px solid #128be9;"/divdiv class="wrap"!-header-div class="header clearfix"div class="header-a fl"a href="#class="clearfix"img src="images/logo.jpgalt="#width="140height="140class="fl/img src="images/logo22.jpgalt="#width="211height="76class="frstyle="margin-top:25px;margin-left:25px;"/a/divdiv class="header-b frstyle="margin-top:30px;"ul class="clearfix"li class="fl"a href="index.htmlclass="header-bb"网站首页phome/p/a/lili class="fl"a href="about.html"学校概况pabout/p/a/lili class="fl"a href="news.html"新闻资讯pnews/p/a/lili class="fl"a href="views.html"风貌展示pviews/p/a/lili class="fl"a href="#"招贤纳士pjoin us/p/a/lili class="fl"a href="team.html"小组介绍pconnect/p/a/li/ul/div /导航菜单/div!-index-div class="index clearfix"div class="flash tc"ul/divscript type="text/javascript"$(document).ready(function()$(".scroll").imgscroll(speed: 40, /图片滚动速度amount: 0, /图片滚动过渡时间width: 1, /图片滚动步数dir: "left"/ "left或 "up向左或向上滚动););/scriptdiv style="border:4px solid #CCC;margin-top:50px;"/div /div/div!-friendlinked-div class="index-fri"ul class="clearfix"li class="fl"a href="#"友情链接/a/lili class="fl"a href="#"友情链接/a/lili class="fl"a href="#"友情链接/a/li div class="footer"a href="#"网站首页/a|a href="#"学校概况/a|a href="#"新闻资讯/a|a href="#"风貌展示/a|a href="#"在线留言/a|a href="#"人才招聘/a|a href="#"联系我们/ap学校地址： 江宁区科技园弘景大道1号/p/div/div/div/body/htmlFlashjs/首页焦点图特特效$(function() var sWidth = $(".flash").width(); /获取焦点图的宽度（显示面积） var len = $(".flash ul li").length; /获取焦点图个数var index = 0;var picTimer;/以下代码添加数字按钮和按钮后的半透明长条var btn = "div class=btn"for(var i=0; i len; i+) btn += "span+ "/span"btn += "/div"$(".flash").append(btn);$(".flash .btnBg").css("opacity",0.5);/为数字按钮添加鼠标滑入事件，以显示相应的内容$(".flash .btn span").mouseenter(function() index = $(".flash .btn span").index(this);showPics(index);).eq(0).trigger("mouseenter");/本例为左右滚动，即所有li元素都是在同一排向左浮动，所以这里需要计算出外围ul元素的宽度$(".flash ul").css("width",sWidth*len);/鼠标滑上焦点图时停止自动播放，滑出时开始自动播放$(".flash").hover(function() clearInterval(picTimer);,function() picTimer = setInterval(function() showPics(index);index+;if(index = len) index = 0;,3000); /此3000代表自动播放的间隔，单位：毫秒).trigger("mouseleave");/显示图片函数，根据接收的index值显示相应的内容function showPics(index) var nowLeft = -index*sWidth; /根据index值计算ul元素的position$(".flash ul").stop(true,false).animate("left":nowLeft,500); /通过animate()调整ul元素滚动到计算出的position篇三：网页设计毕业论文-2014大连东软信息学院毕业设计（论文）蜂鸟摄影网的设计与制作系 所： 专 业：学生姓名：学生学号：指导教师： 导师职称： 完成日期：大连东软信息学院Dalian Neusoft University of Information蜂鸟摄影网的设计与制作摘 要随着现代化互联网的普及与发展，电子商务已经越来越深入人们的生活。而在近些年，威客类网站越来越受到人们的关注，基于HTML技术和CSS技术，开发出为人们提供摄影服务的威客型网站。在本网站中，用户可以方便快捷的查询本地城市的摄影服务机构，最近的摄影活动以及查看本地的风景图片，查看电子书信息的详细资料，然后根据各人的不同需求选择不同的电子书信息。通过对网页技术的研究，对HTML技术的调研，以及对CSS+DIV，Photoshop的了解，综合这几项技术，从而产生了整体的网页结构。在主页运用CSS技术，可以有效的对网页的布局，字体，颜色，背景等做一些方便的改变，只要对相应的代码做一些简单的修改和操作，就可以改变整个工程中的不同部分，或者页数不同的网页的外观和格式。并具有良好的可扩展性和可移植性信息平台。关键词：电子书，网络，HTML，CSSDesign and Fabrication of a HummingbirdPhotography NetAbstractAlong with the popularization and development of the modernization of the Internet, electronic commerce has been more and more important in peoples life. In recent years, Witkey websites, more and more peoples attention, HTML technology and CSS technology based on the development of Witkey website, offering the service for the people. In this website, photography services users can easily query the local city, photographic activities recently and view the local landscape pictures, view detailed information on electronic information, and then choose a different book information according to the different needs of. Through the research on webpage technology, research on HTML technology, as well as the CSS+DIV, Photoshop know, this in