网页报告书
- 格式：doc
- 大小：1.68 MB
- 文档页数：21
静态网页制作课程设计报告书班级：2011信息管理与信息系统姓名:彭昭元指导老师：张鑫完成日期：2013-12-20《网页制作》课程设计任务书一、课题名称音乐网站开发二、课题内容用dreamweaver、fireworks、Flash网页制作工具开发个人网站，内容包括：1、网站的需求分析及其规划，并创建站点结构。
2、网站至少有一个主页、一个FLASH片头，六个分页，页面有导航条，页面设计使用表格布局、输入内容，插入合适的图像和FLASH动画，页面大小不得超过50k。
3、网站中至少有一个页面需要用户登陆才能访问，并在该页面中显示访问者用户名，该用户可在该网页中留言。
4、所有页面要求内容充实、布局合理、颜色搭配协调、美观大方、具有特色。
各个页面之间导航清晰、链接准确无误。
二、课题的具体要求。
1、掌握使用dreamweaver管理站点和制作静态网页和动态网页的方法。
2、掌握使用fireworks处理图片大小，Flash制作网页动画。
3、掌握本地WEB服务器的配置以及站点发布的方法。
4、报告书中要详细记录网站的开发和制作过程、源代码以及其涉及的基本概念及原理。
5、报告书不能少于4000汉字6、若有抄袭或迟交，将做不及格处理。
7、完成期限：20xx年x月x日。
工学系2011级信息管理与信息系统专业2013年12月20日目录一、课程设计报告书封面 (1)二、网页制作课程设计任务书报告 (2)三、目录 (3)四、前言 (4)五、网页制作具体内容 (5)第1章网站开发工具的介绍 (6)第2章需求分析 (7)1) 选题\风格 (7)2) 网站说明\网站主要栏目的介绍 (7)第3章网站设计功能模块图 (8)第4章网站的实施步骤 (9)1) 首页、图及代码 (10)2) 分页步骤 (17)第5章网站的测试与发布 (19)六、课程设计小节 (20)七、参考文献 (21)前言在21世界的今天，中国互联网技术已经进入了一个高速发展的阶段，直接通过网络浏览个人网站，已经成为越来越多网民的选择，根据调查，中国大陆目前有3亿多网民，其中50%的网民有过在网络上浏览个人网页对他人的了解或获得他人的帮助的经历，30%的网民有过多次在网上浏览个人网页的经历，而经常性的在网络上浏览个人网站的网民，已经达到了20%以上。
也就是说，在中国大陆，最少有1000万多网民，已经选择了在WEB网中建立个人网站作为主要的展示自己才能方式之一。
在这样的背景之下，成立一个以文字和图片为主的个人网站，为网民提供一个在线获得信息同时也是自我展示的平台，具有非常大的发展空间和市场潜力。
希望网民们喜欢。
一、网站制作具体内容如下：第1章网站开发工具的介绍主要的使用工具有：DreanweaverCS5 、fireworks、flash而在此次设计中主要用到Dreameaver 设置首页，编辑功能，排版功能，设计模版功能，插入文本包括插入文本元素插入图像和图文混排和外部图像的编辑等功能。
关于Dreameaver的插入FLASH功能我用的比较少，在首页的前面里我插入了一副FLASH，当然还有主页的分页里也插入了FLASH。
其中Fireworks的功能我还不是很了解，我相信我以后会更好的使用它。
DreameaverCS5：Dreamweaver CS5是由Adobe公司在并购Macromedia之后推出的最新版本，它是一款专业的Web站点开发软件，可用于Web站点、Web页和Web应用程序的设计、编码和开发工作。
在业界通常将Dreamweaver、Flash、Fireworks称为网页三剑客。
将各种网页制作的相关工具紧密联系起来是Dreamweaver系列的一大亮点，同时良好的插件体系，使Dreamweaver CS5可通过第三方插件进行补充。
另外，Dreamweaver CS5还为开发人员提供了动态语言支持与丰富的模板。
Dreamweaver CS5在功能强大与易用性之间具有很好的平衡，使用Dreamweaver CS5可以有效地提高Web开发的工作效率。
所以在这次网站中主要设计工具就是Dreamweaver CS5。
Flash:Flash是Flash Macromedia公司开发的动画编辑工具。
1997年推出业内最先进的互动内容创作环境，用于交互网站、交互数字体验和高冲击力的移动内容的创作。
Flash由macromedia公司推出的交互式矢量图和Web动画的标准。
网页设计者使用Flash创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。
其中flash的档案格式是“swf ”这是一个完整的影片档，无法被编辑。
有时会被念做“swiff”。
Swf在发布时可以选择保护功能，如果没有选择，很容易被别人输入到他的原始档中使用。
然而保护功能依然阻挡不了为数众多的破解软件，有不少闪客专门以此来学习别人的程序代码和设计方式。
“fla ”是Flash的原始档，只能用Macromedia Flash打开编辑或Adobe Flash CS5及更高版本打开编辑。
Actionscript是一种程序语言的简单文本文件. FLASH档案能够直接包含 Actionscript, 但是也可以把它存成AS档做为外部连结档案(如定义ActionScript类则必须在写在as文件里,再通过import加入类)，以方便共同工作和更进阶的程序修改。
Fireworks:Fireworks是一个强大的网页图形设计工具，你可以使用它创建和编辑位图、矢量图形，还可以非常轻松的做出各种网页设计中常见的效果，比如翻转图象，下拉菜单等，设计完成以后，如果你要在网页设计中使用，你可以将它输出为html文件，还能输出为可以在photoshop,illustrator和flash等软件中编辑的格式。
这里主要是用它来制作网页图片。
第2章需求分析1）选题\风格：网站的选题：网站的选题是一个网站的框架，一个网页的思路和一个网页的源泉。
所以，对于制作一个心仪的网页，首先得选好题目。
在考虑了一番之后，因为我从小喜欢linkin park乐队，所以按照我的构想，通过表格的规划，实现了自己对音乐梦，摇滚梦的追逐。
网站的风格：网站的风格是一个网站的门面，必须要做到色彩搭配均匀，给人一种想要继续去欣赏的冲动感，在我的网页里面，因为是以摇滚为主元素的，所以用到黑色为基底的色彩，以蓝色的图片做为标题图片，旁边搭配颜色靓丽的红色边框，给人一种既有黑色摇滚的气息和时尚的说唱文化。
2)网站说明\网站主要栏目的介绍在我的网页中，添加了Spry菜单栏，里面包括：首页，乐队介绍，视频主场，专辑领袖，歌曲论坛，新闻专题。
在主页部分，用Click事件完成了对图片的交换，使页面拥有了灵气，更有互动感。
接下来添加了两个标题，乐队简介和乐队任务介绍。
在乐队简介里，用红色图片做了底色，使页面的颜色更富有感召力，在CSS里，设置了标题的字体，是否加粗，颜色。
使得在后面的文字编辑上更加方便。
在标题一的右边添加了FLV 格式的视频，并且设置了自动播放。
接下来，在标题二栏目里面，添加了一个2*9的表格，将乐队的简介的人物信息。
在上边的Spry 菜单里，都设置了命名锚记，使得用户浏览的时候更加方便。
在歌曲论坛里边，添加了表单，用户可以注册自己的账户信息，并且通过链接可以发送到我的邮箱里。
专辑领袖里边添加了他们的专辑，并且添加了MP3文件，可以在观看的时候，同时听音乐。
第3章 网站设计功能模块图主页前视频文件Incirisdent. flv主页网页文件linkin park.html图1 网页设计功能模块图网站根目录 所有图片 视频资料栏目二：专辑领袖 栏目三:歌曲论坛 栏目四：乐队简介 栏目一：首页第4章网站的实施步骤首页说明：1)首页设计的步骤、代码及截图在构思好整个网站后，其中网站所需有关的大量资料及图片都是来自互联网，方便以备做网站时的需要。
例如：首页。
1、先是插入一个1行2列的表格，其表格的宽为100%，并使表格居中。
2、在第一行单元格里，插入了乐队图片，在第二列中添加了Click事件，设置了图片交换。
3、在1*2的表格下方添加了Spry菜单栏。
4、接着添加了一个2*9的表格。
5、在表格的左边依次添加了乐队任务的图片，右边配有文字介绍。
6、其中具体设计这里就不多讲了。
我的首页界面如下所示：图2 首页界面首页代码如下所示：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>linkin park</title><script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script><script src="Scripts/swfobject_modified.js" type="text/javascript"></script><link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" /> <style type="text/css">body {backgroun d-color: #333;color:#333;}</style><script type="text/javascript">function MM_preloadImages() { //v3.0var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_swapImgRestore() { //v3.0var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_findObj(n, d) { //v4.01var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];for(i=0;!x&&yers&&i<yers.length;i++) x=MM_findObj(n,yers[i].document);if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script></head><body onload="MM_preloadImages('6.jpg')"><table width="100%" cellspacing="0"><tr><td><img src="54b8db3a5039bfb4f3e85b246fbdb60d.jpg" width="922" height="315" /><img src="m_1246121565585.jpg" name="addtofav" width="389" height="314" id="addtofav" onmouseover="MM_swapImage('addtofav','','6.jpg',1)" onmouseout="MM_swapImgRestore()" /></td><td> </td></tr></table><ul id="MenuBar1" class="MenuBarHorizontal"><li><a name="shouye" id="shouye"></a><a href="#">首页</a> </li><li><a href="#" class="MenuBarItemSubmenu">乐队简介</a><ul><li><a href="#s1">麦克·信田</a></li><li><a href="#s2">查斯特·贝宁顿</a></li><li><a href="#s3">罗伯·巴登</a></li><li><a href="#s4">布莱德·德尔森</a></li><li><a href="#s5">约瑟夫·韩</a></li><li><a href="#s6">菲尼克斯·法雷尔</a></li></ul></li><li><a href="#">视频主场</a> </li><li><a href="专辑.html">专辑领袖</a></li><li><a href="注册.html">歌曲论坛</a></li><li><a href="#">新闻专题</a></li></ul><p> </p><table width="100%"><tr><td bgcolor="#333333"><h1><img src="arrow-2.gif" width="10" height="10" />乐队简介</h1><p><a target="_blank" href="/view/4001.htm">Linkin Park</a>——世界上最优秀的现场表演团体之一，你可以说以前从没有听说过，也可以用你对<a target="_blank" href="/view/5434.htm">音乐</a>对时尚最挑剔的眼光审视他们，但是无论如何，林肯公园的确是这个时代最独一无二的混种音乐霸王，对<a target="_blank" href="/view/259293.htm">流行金属</a>、<a target="_blank" href="/view/1421.htm">Hip-Hop</a>、<a target="_blank" href="/view/464766.htm">Post-Grunge</a>、<a target="_blank" href="/view/32102.htm">说唱金属</a>、Alternative Metal、等各种风格的诠释早已在全球大放异彩，尽情炫出E时代音乐风情。
