网页设计课程设计报告-动漫网站的设计与制作.doc

网页设计课程设计报告 系别： 信息工程系 班级：网络1002班 姓名： 指导教师： 成绩： 日期: 2011年12月24日沧州职业技术学院 指导教师评语：指导教师签字：年 月 日 设计成绩：网页设计与制作课程设计任务书题目动漫网站的设计与制作专业计算机网络技术班级网络1002班学号003姓名高希希所在系信息工程系指导教师王炳强导师职称讲师一、设计目的1、 训练学生的综合实践能力，培养学生周密的思考问题的能力；2、 全面的训练学生对网页设计知识点的应用与实践；3、 训练并提高学生的动手能力和综合应用能力；二、基本要求1、设计网站的主题内容与收集所需素材；2、布局网站主页，并对网站的主页进行内容的插入与排版；3、布局与设计网站的子页，并输入所需内容；4、在网站的主页上进行链接；5、在主页上进行多媒体元素的插入与制作。三、主要技术指标（或研究方法）1、进行主页的布局与排版；2、进行网站子页的链接；3、对主页进行多媒体的插入。四、应收集的资料及参考文献1、网页设计与制作蔡伯峰 编著；2、相关网站五、进度计划 时间设计内容备注2011-12-19确定网站主题与收集素材2011-12-202011-12-21对网站主页和子页进行制作2011-12-22对网站进行链接和最后的排版2011-12-23制作实习报告指导教师时间年 月 日17目录一、 网站设计目的和任务5二、 网站主题6三、 网站规划思想7四、 网站页面链接总图9五、 综合知识的运用情况10六、网站页面截图及代码11七、动态特效的使用12八、 课程设计心得与体会13九、参考文献15十、 致谢16一、 网站设计目的和任务 一学期的网页设计理论和实践课程都结束了，根据老师的要求及指导，我设计了此网站，本网站属于小型个人网站，目的在于简单的介绍一下个人状况，可以使老师和同学们更进一步的了解我现在以及部分过去的情况，加强老师和同学们对我的认识，深化我们大家的情谊，有利于以后在学习、工作生活当中的团结协作。 此外，这不仅是为了肩负学生的责任而去完成老师交给我的任务，更是对过去学习的知识的温习巩固，是一个把理论转化为实践的过程，是一个把自己的设计思想转化为实物的过程，是一个发挥自己创造力和想象力的过程。 再者，这是对自己在一学期内该学习科目以来的成果的检查，这是一个自我审视的过程：检测我该学期的学习成果，衡量一期以来的收获，更为重要的是扬长避短，发现自己的问题与缺点，使自己及时改正，发觉自身的优点和长处并坚持发扬，有利于我以后的学习和发展。 二、 网站主题 本网站以东北虎和华南虎为主题介绍东北虎和华南虎的生活习性以及其濒临灭绝的危机倡导人们保护生态平衡。三、 网站规划思想 当今社会，靠什么成功?很多成功人士都说过这样一句话：“成功来自百分之八十的人际关系和百分之二十的自身天分和努力。”据此可以发现，扩大人际关系网是十分重要的一项活动，因此就需要一条联系两方的桥梁，这条桥梁是满载信息的大流量的通道，在这信息时代，于是网络成为了这当之无愧的桥梁。我设计这个网站的思路就来源于此。 怎样让更多人了解你？怎么使别人更了解你？怎样扩大自己的接触面？当代是繁忙的一代也是讲究高效率的一代，当今面对这些问题，这时候的内敛不会被认为是好的，最好的解决办法我认为是把自己推销出去，我想通过网络把自己的概况晾晒，方便别人更快捷更省事地得到相关信息，通过这种方式，也可以交到志同道合的朋友，可以一起研究探讨，相互促进，达到共赢。 既然这样，那么网站的风格自然是温和、高雅、柔美的，这样才能达到更高的亲和力效果，同时也应该具有喜悦性、创新性、活泼开朗性，展现个人品格及魅力。最重要的是要呈现一个真诚的自我在大家面前，树立可信性、诚实性，消除虚拟因素，获得大家的真诚对待和好感。 在内容和结构上，具体如下： 整个网站分为九个页面，分别为：主页面、基本信息、个人照片、成长阶段概况（童年、中学、大学）、兴趣爱好（文学、书法、旅游）。各个页面间都是相互连接的，方便读者更快捷地找到想了解的信息。 用表格表示如下： 编号 一级栏目 二级栏目 栏目内容及功能说明 1 基本信息 陈列个人基本信息 2 成长阶段 童年 讲述童年的生活时光 3 中学 叙述中学的坚强成长 4 大学 细数大学的丰富多彩 5 个人照片 展现个人形象 6 兴趣爱好 文学 阐述对文学的看法和认识 7 书法 表达练习书法的感受 8 旅游 介绍某些旅游景点 网站的目录结构如下： flyfish -网站根目录 css -存放外置css文件 flash -存放flash动画 images -存放图片文件 bt -存放所有标题或栏目标题的图片文件 content -存放所有与网页内容相关的图片文件 design -存放所有与网页界面设计相关图片文件 menux -存放所有与导航下拉菜单相关图片 navigation -存放导航栏目图片文件 sight -存放景点图片 linkpages -存放图像或文本超链接的文件 music -存放背景音乐 nagvipages -存放导航下拉菜单连接的网页 js -存放外置js图片 text -存放文本文件 video -存放视频文件 四、 网站页面链接总图 主页 ff2.html 基本信息ff3.html 东北虎 东北虎图片ff4.html 生活习性 物种特点ff5.html 华南虎华南虎图片ff6.html 生活习性ff8.html 华南虎和东北虎面临物种灭绝ff7.html 倡导人们维护生态平衡ff9.html 返回主页 五、 综合知识的运用情况 1、层的使用 在这次网页设计过程中，使用了大量层，因为它灵活好用，可以随便拖动，变大变小都很方便，而框架虽然也能达到这个效果，但是，它不够灵活，不利于我所需要表达的效果的呈现，也许是不习惯的原因吧，觉得太死板了，当然一些地方仍然要用到它，体现清晰的结构。 2、运用photoshop工具 图片的插入和设置背景图像是两个不同的概念，当然可以达到相同的效果，这是很基本的知识运用，也用了很多次，但是当图像较小时在层中插入更方便些，因为作为背景时图片会重复出现造成混乱的局面，但图片过小时，用层将之拉宽大就会使图片变模糊、严重变形，不但没能美化页面反而带来了负面影响，此时最好借助photoshop工具来编辑图片。文本的插入在层内或框架内完成较好，但不能设置为艺术字体，因此需要运用photoshop工具来辅助完成，其实很多地方都可以用到photoshop工具特别是一些要表现自己独特的思想和设计画面。 3、使用flash工具 只要是动态效果都可以用flash工具，音乐、闪动图片等。 4、使用链接 为方便读者的查阅，在各页面底部都设置了页面链接。 5、插入跳转菜单 为了使读者能快捷的回到自己感兴趣的页面，于是在各个页面都插入了跳转菜单。 6、设置交替图像，鼠标放置停止图片切换 7、使用弹出信息行为 8、框架的使用 9、插入音乐文件 六、网站页面截图及代码1、网站主页2、东北虎的简介3华南虎的简介4、 野生华南5、 弹出式菜单七、动态特效的使用 1）每个页面都设置了链接，有链接的地方就设置了鼠标放置时的颜色变化，还插入了flash按钮; 2)首页有上下滚动的图片，插入了背景音乐; 3)基本信息页面使用了交替图像插入了音乐文件; 4)书法页面使用了浮动的图片; 5)旅游页面使用了上下滚动的图片; 6)文学页面运用了滚动字幕； 7）童年页面插入了flash动画。 八、 课程设计心得与体会 这次网页设计实战篇个人网站设计完成后，我收获了很多，感触也很深。 我最大的感受就是理论不用于实践终究是理论，说得难听点那根本就是纸上谈兵，止于理论的学习，将来是没多少成绩的，有前途发展的话也必将是少了更为之锦上添花的一笔。 当然也深刻认识了一点，那就是我们所学的知识虽说是很基础很根本，但没有根基怎么能建好别墅呢?所以说基础知识是很重要的，我们在学习过程中不能小看而去忽略它，它是一笔财富，能引导我们看得更远飞得更高。 通过这次设计，我发现一个很普遍的问题：我们往往是眼高手低，学习这些知识时觉得它就是小菜一桩，但现在真的验证了“看花容易绣花难” 这句话，当我们着手实践时就不像我们想象中的那么简单了，每一个细节都需要注意，稍有不慎页面就在预览中变了样，因此更需要我们细心和耐心地去完成，也就两个字概括认真，只有认真对待才会从骨子里学到东西，才学到心里去了。 我觉得这次确实是很有意义的一次检测，本来自我感觉良好的，结果实战时还是存在很多问题的，平时学起来觉得很轻松就以为掌握了所学知识，但现在都忘记很多细节是怎么样的了，因此开始着手时有些障碍，但我下定决心把以前的实验内容都温习一遍，遇到不懂的就及时查资料，比如翻阅资料书，百度，也可以请教同学，一起讨论，相互学习，于是最后也如鱼得水，水到渠成，因此得到一个非常重要的结论只要自己想学只要自己有那份执着与毅力，虚心的请教，勤于查阅相关资料就一定会有收获的，真的当今没有什么知识是用不着的，在哪，哪里都是知识，只要自己持有高度的学习热忱。当然，我们在学习过程中一定要及时巩固、练习，掌握了也不一定熟悉，熟能生巧啊！我们应该吸取这个教训，否则即使我们最终达到了目的，但我们走了很多弯路，而不是事半功倍的结果了。不过最终，经过长久的坚持与不断的琢磨，看到了自己辛苦后的成果，尽管这还有很多不足，但看着它我心里充满着喜悦，一分耕耘一分收获，这永远是真理。 完成自己的作品后我也观赏了其他同学的作品，对比起来，各有千秋，当然能从其中发现很多值得我去学习的地方，比如说有的页面布局很好，有的页面内容很充实，看起来很有感觉，也可以称之为网站了，而我的有些页面看上去，可能使别人不会产生网站这一个概念，反而会觉得像是ppt演示文稿，这也反映了我的一个问题：心中还没很清楚领悟建立网站的基本要点，还应该加强这方面的知识储备。另外我也发现有的同学的页面设计插入了太多图片或者太多浮动的东西，弄得网页太杂，没有一定的风格，更谈不上凸显主题了从对比中，我学到了很多，能让我扬长避短，吸取他人之精华，去除他人之糟粕。 这次作业对于我来说不是一项任务而是一种享受，因为我发现我越来越喜欢它，不管别人说做这件事做到多晚做得有多累，我都没觉得，甚至还越做越兴奋。对于一个女生来说，特别是对于一个对电脑不感兴趣的女生来说，我觉得这是我最大的收获，我找到了我的兴趣、我的老师，我在计算机专业中找到了方向。真的很感谢老师能给我们这次机会，当然也发现有很多同学跟我一样喜欢上了它，在这方面也做得比较好，于是我也有一种紧迫感，毕竟现在竞争压力很大，“适者生存，弱者淘汰”是亘古不变的自然法则，我想我应该更加努力，抓住机会把。九、参考文献1网页设计与制作蔡伯峰 编著；2吴涛主编，网站全程设计技术（修订本），