网页制作设计报告
青岛大学
网页制作实训报告专业 09级电子商务
二0一一四年七月十二日
实训报告任务书
目的:
掌握Dreamweaver 8.0在网页设计制作中的运用，学习一些网页制作的基本技术，学会Dreamweaver8.0中所提供的层、框架、模板和库、表单、层叠样式表、行为等各种网页元素的功能和使用方法，对Dreamweaver8.0的高级使用有一个全面的认识。
地点：
青岛大学东校区
内容:
设计一个宣传介绍“江北水乡，运河古城—台儿庄”的相关网站。经过设计这个网站，体现其独特的水乡魅力，让人们了解“天下第一庄—台儿庄”。
进度:
第1天，明确任务，按照要求创建站点及页面。
第2-5天，创建、编辑页面，书写实训报告。
第6天，页面和实训报告初步实现，迎接老师初步检查。
第7-8天，进一步完善页面和实训报告，力争达到符合要求并完美。
第9-10天，总结设计情况，上交实训报告和课题。
目录
实训任务书 (1)
目的 (1)
地点 (1)
内容 (1)
进度 (1)
目录 (2)
一．网站框架结构图 (3)
二．网站设计理念 (3)
1.整体理念 (3)
2.网站设计使用技术 (3)
三．网站设计过程 (3)
1.首页设计过程 (3)
2.台儿庄简介设计过程 (4)
3古城文化设计过程 (4)
4.古城荣誉设计过程 (5)
5.玩在古城设计过程 (5)
6.吃在古城设计过程 (6)
7.住在古城设计过程 (6)
8.购在古城设计过程 (7)
9.海峡基地设计过程 (8)
四．设计风格 (8)
1.色系风格 (8)
2.图标设计风格 (8)
3.特效风格 (8)
4.架构风格 (8)
5.内容风格 (8)
五．心得体会 (9)
六．参考文献 (10)
1教材 (10)
2.素材文章 (10)
3.素材图片 (10)
七．评语备注 (11)
一．网站框架结构图
二．网站设计理念
1.整体理念
古韵简洁，清新舒适，淡雅美观，风格精致，内容充实。
2.网站设计使用技术
使用Dreamweaver 8.0设置站点，插入层，插入表格，插入FLASH，CSS 技术，插入插件，设置连接，使用了模板。另外还使用了Photoshop，光影魔术手，画图等修饰了素材。使用Word修饰字体，并将网站各网页的标题使用了“毛泽东字体”映衬网站整体风格。
三．网站设计过程
1.首页设计过程
首先搜索下载了网站首页设计所需要的相关Array素材。
然后,首先建立了网站的站点和设计了一个
模板，为了营造网站的整体特色，插入了一张金
黄色的背景图片作为背景,体现网站整体的古韵
典雅的特色。在主页的设计中,第一行先设计了
一个表格并插入了一个网站表头的图片,在第二
行插入了一个一行9列的表格,在表格内进行了
分类,分别为主页、台儿庄简介、古城文化、古
城荣誉、玩在古城、吃在古城、住在古城、购在
古城、海峡基地。之后插入了一个层，在层中插
入了一个ＦＬＡＳＨ，在首页中插入了插件，插
入了背景音乐。这样一来可以让网站首页展现出一种古城的魅力风彩，在开始的时候就能给浏览者一种继续浏览的想法，好的网站首页是成功网站的开始。建立一个合理的站点可以大大减少网站的制作时间，一个好的模板可以将网站整体的特色显现出来。建立好网页之间的链接将
方便浏览者的浏览，使用了CSS技术。所以首页对于一个网站非常重要。
2.台儿庄简介设计过程
首先搜索网页台儿庄简介所需要的
素材，之后在运用所建立模板的前提下
再插入表格，在第一行表格内插入一个
图片，展现出台儿庄的整体城市景点，
还在这个表格里插入一个层，在层中添
加一个下雨的FLASH，设置其FLASH
参数。在第二行中插入一个图片，并写
入了一些介绍性的文字。在第三行中插
入了一个国家湿地公园的图片，插入了
一个层并在层中添加了一个下雨的ＦＬ
ＡＳＨ，设置其ＦＬＡＳＨ参数，在其
中也添加了一些文字说明，展现了湿地
公园的美丽。在第三行中主要是写入了
一些景点的介绍性文字。在第四行中插
入了一个台儿庄大战纪念馆的图片，并
写了一些介绍性文字。在第五行中插入
一个大战纪念碑，并写入了介绍性文字。在第六行中插入一个层，插入了一个插件，插入了一个背景音乐。通过文字加图片，使用CSS技术，FLASH动漫的展现，把台儿庄的水上古城和大战故地展现的生动如画。网页的大标题都使用“毛泽东的字体”展现古色韵味.映衬网站整体风格。
3.古城文化设计过程
首先搜索相关素材，插入了表
格，在表格里分别插入了一张代表
性的图片，之后在表格里分别插入
了层，在层中编写了一些介绍性文
字。展现出运河文化，大战文化，
地方文化。将台儿庄的文化以图文
的形式生动的展现出来，之后插入
一个层，在层中插入了一个插件，
在插件中添加了音乐，使网页有了
背景音乐，使用CSS技术。和主页
之间都建了良好的链接。网页的大
标题都使用“毛泽东的字体”展现
古色韵味.映衬网站整体设计风格。
4.古城荣誉设计过程
在网上搜集了相关的网页素材，建立了表格，在表格中插入图片，使用Photoshop,画图,光影魔术手等
软件修饰照片素材,在图片周围
编写了一些介绍性的文字，插
入了一个层，在层中插入了Ｆ
ＬＡＳＨ插件，在插件中插入
音乐，设置了此网页的背景音
乐，使用CSS技术。台儿庄荣
誉网页的设计采用愉快的旋律
衬托出台儿庄古城未来的发展
会越来越好,经济发展在旅游产
业的带动下会变得更加强大。
网页的大标题都使用“毛泽东
的字体”展现古色韵味，映衬
网站整体设计风格。
5.玩在古城设计过程
在网页的布局中采用图文并茂的效
果，选择的素材都是在一定程度上能反
映出台儿庄古城的特色建筑物。首先，
插入了表格，在第一行中插入了一个叫
做参将署的图片，然后，在第一行的表
格中插入了一个层，在层中插入了一个
FLASH，这个FLASH门窗的开合，表
示古城欢迎游客来光临。第二行插入了
古城的一个标志性景点石船舫的图片，
并采用文字进行了介绍。第三行插入图
片谢裕大茶行,此为古城茶艺展馆，第四
行插入文汇酒楼的图片，文汇酒楼集
“运河文化”和“大战文化”于一体，
融“齐鲁豪情”和“江南韵致”于一
身，是极具人文魅力的旅游目的地，也
是沿运独有、世界知名的休闲旅游度假
区理想用餐场所,并用文字介绍。第五行
插入图片水陆通街牌坊，并用文字说明.
第六行插入图片船形街，此为古城的典型景点，并用图文介绍，在表格中插入层，在层中插入FLASH，设置参数，展现出古城特色。第六行插入图片天后宫，并采用文字介绍。第七行插入图片水门，将古城著名景点都給以介绍。在第八行中插入插件,添加音乐，使用背景音乐。网页的大标题都使用“毛泽东的字体”展现古色韵味.映衬网站整体设计风格。
6.吃在古城设计过程
搜索素材，使用画图,Photoshop、
光影魔术手等软件进行修饰图片，插入
两个表格，在表格中插入图片，并采用
图片加以文字说明的形式，不但让从观
看上看到美味，而且在文字说明中看到
其营养价值和食品来源，浏览中介绍，
让人未吃先馋。插入层，插入插件，添
加音乐，设置背景音乐。网页的大标题
都使用“毛泽东的字体”展现古色韵味
展现整体设计风格。
7.住在古城设计过程
搜索素材，使用
画图、Photoshop等
软件进行修饰图片。
插入两个表格,在表
格中插入图片,而且
图片还有文字说明,
不但让从观看上看到
居住环境的幽美雅静,
而且在文字说明中看
到其服务特色,浏览
中细读,让人未住先
感到住宿的舒适。插
入层,插入插件,添加
音乐,设置背景音乐。
衬托出一种恬雅的居
住环境，网页的大标
题都使用“毛泽东的字体”展现古色韵味.映衬网站设计风格。
8.购在古城设计过程
搜索素材，使用画图,Photoshop、光影魔术手等软件进行修饰图片,插入两个表格,在表格中插入图片,而且图片还有文字说明,不但让从观看上看到购物环境的幽美雅静,而且在文字说明中看到其购物的服务特色，浏览中介绍,让人未逛先感到购物的美好。插入层，插入插件,添加音乐,设置背景音乐，衬托出一种舒适恬雅的购物环境。网页的大标题都使用“毛泽东的字体“展现古色韵味.映衬网站设计风格。
9．海峡基地
搜索素材,使用画图、Photoshop
等软件进行修饰图片,插入一个表格,
在表格中插入图片,又在图片背景本身
的基础上插入一个层，再添加一个拥有
文字的图片,这样使网页拥有文字说明
的形式，不但让从观看上看到海峡基地
的幽美雅静,而且在文字说明中看到其
是中国第一个海峡交流基地,标志性建
筑物和背景的相衬呼应,展现两岸友好
交流的向往,展现了华夏儿女的心声。
插入层,插入插件,添加音乐,设置背景
音乐，衬托出一种恬静优雅的居住环
境。网页的大标题都使用“毛泽东的
字体”展现古色韵味，映衬网站设计风
格。
四、设计风格
1.色系风格：
所设计的页面背景颜色均以金黄色为主调，主要为了突出该网页“台儿庄古城”的闲适淡雅风格,展现古色美景，安逸生活。
2.图标设计风格：
以古城江北水乡的幽静特色,展现出古城的独特魅力。
3.特效风格：
页面使用了HTML、Flash、Word文字处理，增强了页面的动感，从而使浏览者增加了深刻的印象。
4.架构风格：
每一个页面只是简单的介绍了台儿庄古城的简单信息，为浏览者大体的了解台儿庄的基本情况做铺垫，展现古韵典雅，优美景区——台儿庄。
5.内容风格：
网站主题闲适、内容主题充实、多采。动态感十足、内容切合度高，文字都是用一些简单易懂的词语，就是为了浏览者了解我所介绍的台儿庄的简单信息。
五、心得体会
在这次网页设计中，我综合运用了以前专业所学课程的理论和实际运用知识，进行这次课程实训设计，从而进一步提高了我的设计能力，巩固扩充了我网页设计等课程所学的内容，更灵活的掌握了网页设计的方法和步骤，懂得了分析软件的综合运用，怎样确定设计方案，了解网页的基本结构，提高了设计能力，熟悉了规范和标准，最重要的是我的独立思考的能力也有了提高。
在这次设计过程中让我觉得自己在平时的观察中不太注意，观察的太少，因此让作为浏览者的我平时在百度浏览中，开始对网站页面排版动态设计开始留意和关注。现在知道要做好一个网站并不是想象中的那么简单，需要我们平时多积累多操作，一个网站的整体性当然包括色彩图片的搭配，所以还需要提升自己的审美观。最主要的是设计一个网站必须要先制定一个完整合适的框架图，使浏览者对整个页面有种和谐、简易、明了的感觉。同时要收集丰富的主题素材，以展示网页的可读性。
由于我的设计能力有限，在设计过程中难免会出现错误，望在此指导老师多多指教，我十分乐意接受您的批评与指正，我将会认真听取您的指正，使我在以后的网页设计中设计的更好。
在此感谢青岛大学给我这次展示制作网页的机会。
六、参考资料
1.教材:
《HTML网页制作》—作者：王映雪出版社：清华大学出版社
《网页设计与制作》—作者：丁淼出版社：东南大学出版社
《网页特效精彩实例制作》-作者：张怀志出版社：人民邮电出版社
《网页制作教程》--作者：郭初生出版社：人民邮电出版社
《网页设计艺术》——作者：郭根生出版社：齐鲁电子出版社
《网站全程设计技术》—作者：吴涛出版社：清华大学出版社
《网页设计与制作》---作者：任学文出版社：中国科学技术出版社
《网页设计探索之旅》---作者：武创、王惠出版社：电子工业出版社《网页设计超级梦幻组合》---作者：杜巧玲出版社：清华大学出版社
《网页设计教程》---作者：吴黎兵、罗云芳出版社：武汉大学出版社《网页设计三剑客白金教程》---作者：庄王健出版社：电子工业出版社《网页制作技术教程》---作者：赵小林出版社：国防工业出版社
2.素材文章：
百度，谷歌，自己编写
3.素材图片：
搜狗，谷歌，百度
Web网页设计实验报告
WEB系统开发 综合实验报告 题目红尘客栈网上订房页面 专业计算机科学与技术（信息技术及应用） 班级计信2班 学生蒋波涛 重庆交通大学 2013年
目录 一、设计目的 (3) 二、设计题目 (3) 三、结构设计 (3) 四、技术分析 (4) 五、设计过程 (7) 六、实验心得 (10) 七、实验总结 (11)
一、设计目的 在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet 应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。我们当代大学生更是离不开网络给我们带来的好处与便利.但是,我们成天浏览的网站网页到底是如何制作的呢?我想这一点很多同学都没有去深究过.所以,这学期我选择了”web网页设计”这门课, 本课程的设计目的是通过实践使同学们经历网页制作的全过程. 通过设计达到掌握网页设计、制作的技巧。 了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求，给出网页设计方案，可以按要求，利用合适图文素材设计制作符合要求的网页设计作品。 熟练掌握Photoshop cs3、Dreamweaver cs等软件的的操作和应用。增强动手实践能力，进一步加强自身综合素质。学会和团队配合，逐渐培养做一个完整项目的能力。 二、设计题目 《红尘客栈》 三、结构设计 选定主题，确定题目之后，在做整个网站之前对网站进行需求分析。首先，做好需求调研。调研方式主要是上网查阅资料，在图书馆里翻阅相关书籍。 然后，调研结束之后对整个网站进行功能描述，并对网站进行总体规划，接着逐步细化。 我们选做的主题是个人主页，并且选定题目为“红尘客栈”，其目的是做一个简单的网站，介绍酒店概况，提供一定的资讯信息。 四、技术分析 (一)建立布局 在这次的网页设计中用到大量的布局，所以怎么样建立布局是关键。Dreamweaver cs3是大多数人设计网页的称手兵器，也是众多入门者的捷径。特别是其在布局方面的出色表现，更受青睐。大家都知道，没有表格的帮助，很难组织出一个协调合理的页面。 1.点击“ALT+F6”键，进入布局模式，插入布局表格。建立一个大概的布局。 2.使用背景图片：选中该项，按浏览可以插入一幅准备好的图片作为表格的背景，因为图片是以平铺的形式作为表格背景，所以表格大小和图片尺寸都要控制好。 （二）网页中的图像
web简单网页课程设计报告
设计内容及要求 <1>使用各种HTML标记，CSS各种常用样式及简单的JavaScript 技术，完成的网页没有错误 <2>首页设置导航栏，命名为 <3>利用CSS技术对网站进行布局，网站风格统一 <4>灵活运用JavaScript使网页生动 一、设计思路 首页： 二、设计结果及分析 首页：
1.对于主页，因为不太喜欢类似于搜狐类似的全文检索，更青睐于百度类似比较简洁的页面，随后设计出主页，虽然很简单，但我认为很精练，突出了这次设计的主题。 东营： 2.对于主页，因为不太喜欢类似于搜狐类似的全文检索，更青睐于百度类似比较简洁的页面，随后设计出主页，虽然很简单，但我认为很精练，突出了这次设计的主题。
广饶简介： 联系： 3.第四章做了根据js的一个互动。可以对前台邮箱的内容进行判断。
图片欣赏： 4.第五章，由于需要用到表格的内容，所以将照片用着种形式呈现出。 三、总结 通过本次网页的制作过程，我学到了很多实用的东西，也充分了解了editpuls这个软件的强大，对学习了一个学期的课程也有了深入的了解。在这段时间里，一方面，我尝试着讲课本上所学的知识运用到制作中，另一方面，我又时刻在网上学习自己需要的知识，学习到了很多有用的知识。虽然之前对于代码的编辑不是很明白，但这几天不断搜集各种网站模板，不断学习设计思路。虽然呈现出的作品很不完整，基本达不到观赏性和实用性，但我还会不断练习。争取作出属于我的风格的web。 五、附录（源代码）
首页：
我大东营
网页制作课程设计
网页制作课程设计设计题目：职业技术学院学生会 系别：职业技术学院 班级：09 计网 学号：092114010028 姓名：谯辉 指导教师：徐老师董老师 2011.7.4—2011.7.15
前言 都是可以通过网络来获得。但是什么为这所有的一切提供平台的呢。我们又是通过什么来获取这些消息的呢——对就是网页。现如今，数以万计的网站以网页的方式提供了丰富、精彩的信息。在人类社会进入信息时代的时候，在网络成为通信的主要手段的时候，在计算机网络普及的今天，网页也在它自己的岗位对于现在的社会，科技的飞速发展已经成为社会发展的标志。其中计算机的发展可谓快中之快，而在计算机的发展中计算机网络的发展又是首当其冲的。计算机网络从为我们所知，到现在才经历的短短的几年时间，在这几年中随着计算机网络的广泛应用，特别是Internet的普及和发展，网络已经成为了不可或缺的通信手段。不论是最新的新闻信息、新产品的出台、新游戏的发布、最新的各种IT 动态，包括等候就业人才的个人简历，我们上做出了突出的贡献。网页是我们在网络上的“代言人”。我们将什么样的信息传达给浏览者，要讲述什么样的事情，网页在这里起着重要的作用。 企业网站在企业的网络营销当中占有及其重要的地位，只要是涉及网络宣传的企业，都应该建立属于自己的个性企业网站。他不仅能够让企业在网络上展示自己的产品，促进实际销售的增长，更能够通过一根网线，向目标客户展示企业自身的形象。 对于企业网站设计的观点，偏重网站的形象设计，即在功能务实、体系完善的情况下，重点结合企业理念打造网站的形象。Logo就能很好的表现企业的形象。企业标志(Logo)是指用于代表企业形象的独特的、有意义的图案，是企业形象识别当中最核心的环节，可用于与企业形象相关的所有环节。由于企业标志所处的特殊地位，决定了其不能够随意更换，因此能否设计一个有内涵、有文化、便于识别的标志，并建立相关的应用系统，关乎到企业长远的发展，不容小视。 建设网站的一般过程包括：前期内容确立、网站架构搭建、创意策划、设计、网站建设。网站的功能版块一般分为首页（含引导页）、新闻部分、产品部分、信息交流部分、定制系统、零散页面等。根据不同的企业需求，各网站的功能版块数量、布局、结构各异。 要做一个有特色的网站，我们首先要熟练的掌握Dreamweaver、Photoshop 和flash等多种制作网页的工具，我们在掌握它的基础上要善于合理的利用这些工具，这样我们相才能做出一个让人看了后感到舒服的网页。
网页制作课程设计报告
网页制作课程设计报告学院: 专业班级: 姓名: 学号: 成绩: 阅卷教师:
目录 1、设计目的 (1) 2、设计思想 (1) 2、1网站整体结构规划思想 (1) 2、2 主页设计思想 (1) 2、3子页的设计思想 (1) 3网页详细设计分析 (1) 4结论 (1)
1、设计目的 阐述该个人网站的设计意图与创意,简单介绍自己的个人网站。 2、设计思想 阐述网站的整体设计思想,包括: 2、1网站整体结构规划思想 要求阐述网站整体结构的选择、设计的思想,绘制网站结构草图。 2、2 主页设计思想 要求对主页的布局思路进行阐述与分析。 2、3子页的设计思想 要求对子页的设计以及网页对象的选取思路进行阐述与分析。 3网页详细设计分析 要求选取一张网页,对网页的设计实现过程进行阐述与分析,详细说明制作该网页的步骤,所使用的网页对象以及该网页对象的操作方法。 4结论 对整个设计报告做归纳性总结,并分析设计过程中的困难及如何解决的,最后提出展望。 一、设计目的
本课程的设计目的就是通过实践使同学们经历Dreamweaver cs3开发的全过程与受到一次综合训练,以便能较全面地理解、掌握与综合运用所学的知识。结合具体的开发案例,理解并初步掌握运用Dreamweaver cs3可视化开发工具进行网页开发的方法;了解网页设计制作过程。通过设计达到掌握网页设计、制作的技巧。了解与熟悉网页设计的基础知识与实现技巧。根据题目的要求,给出网页设计方案,可以按要求,利用合适图文素材设计制作符合要求的网页设计作品。熟练掌握Photoshop cs3、Dreamweaver cs3等软件的的操作与应用。增强动手实践能力,进一步加强自身综合素质。我本次主要就是设计的一“新加坡之旅”为主题的网页,针对新加坡的美丽风景做了介绍。 二、设计思想 利用Dreamweaver8、0制作一个关于“新加坡之旅”的网站,利用表格、行为、层与链接等网页设计技术设计页面。 本网站以新加坡旅游为素材,主要讲解了与新加坡景
网页制作课程设计报告
网页制作课程设计报告 学院： 专业班级： 姓名： 学号： 成绩： 阅卷教师：
目录 1.设计目的 (1) 2.设计思想 (1) 2.1网站整体结构规划思想 (1) 2.2 主页设计思想 (1) 2.3子页的设计思想 (1) 3网页详细设计分析 (1) 4结论 (1)
1.设计目的 阐述该个人网站的设计意图和创意，简单介绍自己的个人网站。 2.设计思想 阐述网站的整体设计思想，包括： 2.1网站整体结构规划思想 要求阐述网站整体结构的选择、设计的思想，绘制网站结构草图。 2.2 主页设计思想 要求对主页的布局思路进行阐述和分析。 2.3子页的设计思想 要求对子页的设计以及网页对象的选取思路进行阐述和分析。 3网页详细设计分析 要求选取一张网页，对网页的设计实现过程进行阐述和分析，详细说明制作该网页的步骤，所使用的网页对象以及该网页对象的操作方法。 4结论 对整个设计报告做归纳性总结，并分析设计过程中的困难及如何解决的，最后提出展望。
一、设计目的 本课程的设计目的是通过实践使同学们经历Dreamweaver cs3开发的全过程和受到一次综合训练，以便能较全面地理解、掌握和综合运用所学的知识。结合具体的开发案例，理解并初步掌握运用Dreamweaver cs3可视化开发工具进行网页开发的方法；了解网页设计制作过程。通过设计达到掌握网页设计、制作的技巧。了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求，给出网页设计方案，可以按要求，利用合适图文素材设计制作符合要求的网页设计作品。熟练掌握Photoshop cs3、Dreamweaver cs3等软件的的操作和应用。增强动手实践能力，进一步加强自身综合素质。我本次主要是设计的一“新加坡之旅”为主题的网页，针对新加坡的美丽风景做了介绍。 二、设计思想 利用Dreamweaver8.0制作一个关于“新加坡之旅”的网站，利用表格、行为、层和链接等网页设计技术设计页面。
Web动态网页课程设计 题目及要求
Web动态网页课程设计 (总学时数：16课时) 一 Web动态网页 课程设计性质：本课程是一门计算机相关专业实践性环节。以HTML和CSS为基础，全面学习网页设计制作有关的知识，让学生通过实践理解Web基本工作机制，并使学生具有一般网页制作的能力。与此同时，通过对Web页制作技术和制作工具的学习，使学生对网页设计中所涉及的相关知识有一个全面的了解。 二课程设计目的 通过对ASP对象的使用，实现对WEB数据库的访问。通过本课程的学习，使学生全面了解网站建设与网页设计的基本概念、基本理论及业务运作模式，了解网站建设与网页设计的特点及工作过程，掌握网站的建立及网页设计制作的方法，能够完成一般性网站的建设。同时学会Web数据库系统开发的基本方法与过程并能够实现B/S结构的数据库管理系统。 三课程设计地点 公共基础实验室3（A504） 四课程设计内容 本次课程设计题目方案如下：
题目1：基于Web的实验室信息管理系统 题目2：网络商店（见web程序设计课本案例） 题目3：学生自拟（需经过教师审核） 内容要求： （1）掌握Web网页常用的开发工具Deamweaver或.Net的使用； （2）学会IIS的配置，或者netbox的安装与设置； （3）学会Html、CSS、Javascript、VBscript或C#的简单开发和应用 （4）学会B/S模式下，asp与数据库的连接，建议采用Access 数据库。动态新闻管理系统。在系统中，必须完成文章的添加，删除、修改、文章内容显示、题目列表显示 五课程设计时间安排 第一周 安排计划 第二周 数据库的设计 第三周 完成HTML静态页面和 CSS设计； 第四周开始至第六周 开始JavaScript、Javascript、VBscript或C#的程序代码设计
网页设计课程设计报告
网页设计课程设计报告 系别：计算机科学系 班级：09级计师二班 姓名：邓桂香 学号：200914340229 指导教师：李发英 成绩： 日期：2011年5月
网页设计课程设计报告 一、网站设计目的和任务 一学期的网页设计理论和实践课程都结束了，根据老师的要求及指导，我设计了此网站，本网站属于小型个人网站，目的在于简单的介绍一下个人状况，可以使老师和同学们更进一步的了解我现在以及部分过去的情况，加强老师和同学们对我的认识，深化我们大家的情谊，有利于以后在学习、工作生活当中的团结协作。 此外，这不仅是为了肩负学生的责任而去完成老师交给我的任务，更是对过去学习的知识的温习巩固，是一个把理论转化为实践的过程，是一个把自己的设计思想转化为实物的过程，是一个发挥自己创造力和想象力的过程。 再者，这是对自己在一学期内该学习科目以来的成果的检查，这是一个自我审视的过程：检测我该学期的学习成果，衡量一期以来的收获，更为重要的是扬长避短，发现自己的问题与缺点，使自己及时改正，发觉自身的优点和长处并坚持发扬，有利于我以后的学习和发展。 二、网站主题 本网站以个人从小到现在的大概情况介绍为主题，阐述喜好，表现本人的性格特点。
三、网站规划思想 当今社会，靠什么成功?很多成功人士都说过这样一句话：“成功来自百分之八十的人际关系和百分之二十的自身天分和努力。”据此可以发现，扩大人际关系网是十分重要的一项活动，因此就需要一条联系两方的桥梁，这条桥梁是满载信息的大流量的通道，在这信息时代，于是网络成为了这当之无愧的桥梁。我设计这个网站的思路就来源于此。 怎样让更多人了解你？怎么使别人更了解你？怎样扩大自己的接触面？当代是繁忙的一代也是讲究高效率的一代，当今面对这些问题，这时候的内敛不会被认为是好的，最好的解决办法我认为是把自己推销出去，我想通过网络把自己的概况晾晒，方便别人更快捷更省事地得到相关信息，通过这种方式，也可以交到志同道合的朋友，可以一起研究探讨，相互促进，达到共赢。 既然这样，那么网站的风格自然是温和、高雅、柔美的，这样才能达到更高的亲和力效果，同时也应该具有喜悦性、创新性、活泼开朗性，展现个人品格及魅力。最重要的是要呈现一个真诚的自我在大家面前，树立可信性、诚实性，消除虚拟因素，获得大家的真诚对待和好感。 在内容和结构上，具体如下： 整个网站分为九个页面，分别为：主页面、基本信息、个人照片、成长阶段概况（童年、中学、大学）、兴趣爱好（文学、书法、
网页课程设计心得体会
网页课程设计心得体会 不知不觉,二个星期的《页面规划与网站建造》课程的实操即将曩昔,回忆这一段日子,真的令我领会很深,也学会许多东西,懂得许多曾经不明白的东西,也理解了一些工作. 自从第一天触摸《页面规划与网站建造》课程,我以下定决心要把页面这门课学好,做出一个优异的网站.所以我时刻没有错失任何学习的机会,不管在课堂上,还是在课外上.更何况这一次实操.回忆今次的实操我觉得我过得很充实,很有含义,由于我能够诚笃的说我在实操没有玩过一次游戏,我每时每刻都在规划网站,还记得晚上做网站做到一、二点，也许
有人会说我傻，但正由于这个傻的举动，令我学会许多东西，学会他人不明白的东西，做出一个令自个满意的网站，也许跟他人比还需要持续完善，但我不会由于实操结束，就把页面规划抛到无影无踪，我会持续学习页面规划技能，把它变为自个的一项专长。 回忆第一天的《页面规划与网站建造》课程实操，教师叫咱们持续完善曾经规划的网站，做出留言板、注册的功用。我很快就完成了，但也许我是一个寻求完善的人，所以虽然一个网站做好能够立刻交给教师。但我做出一个他人都不附和的决定，从头开始做一个网站。由于我觉得曾经那个真的不是太好，虽然实操的时刻曩昔了一半，虽然他人对我说你交本来这个不就行了吗!何须再做一个呢?但真由于我的固执，寻求成功，寻求完善的人，才会使我今日交出一个令自个满意的答卷。 在制造自个网站时咱们首先： 一、必需进行自个网站前台功用规
划 包括自个网站主题的断定，前台功用规划与办理、自个网站主页规划、自个网站留言板、注册、忘掉暗码、查找等页面规划与办理。 二、对自个网站后台办理功用规划 包括自个网站后台办理功用的规划、后台办理信息体系功用的规划、后台体系权限办理、后台文件办理、自个网站后台办理体系主页规划。 三、网站的发布 一般咱们发布一个网站也许以能过域名注册，但咱们也能够使用自个主机，装了iis他人就能够通过我的ip地址来访问我的主页。首次做的那个页面我现已发布在上彀了。 四、自个网站推行 一个网站做好了，就要对自个网站进行推行，这是一个电子商务网站必需做得的一步，由于假如你不对你的网站进行推行，就算你发布了也没有人会知道的。
网页设计课程设计报告
课程设计 课程名称：HTML5开发技术课程设计 专业班级：计科1201 学生姓名：伍志强 学号： 201216010506 指导教师：刘宏月 学期：2013-2014学年第一学期
HTML5开发技术专业课程设计任务书 说明：本表由指导教师填写，由教研室主任审核后下达给选题学生，装订在设计（论文）首页
1 需求分析 本课程设计为一个商业网站，大的框架为整个网站分为5个页面，分别为：主页面、公司的业务面，公司产品问题咨询面，公司产品的技术支持面，校园招聘界面。各个页面间都是相互连接的，方便读者更快捷地找到想了解的信息。在每个界面拥有的公司logo ，登陆界面，和一些视频的宣传和校园招聘网页的背景音乐，友情链接，插入的各种静动态图片，搜索栏。每个界面链接的公司的最新各种动态，和基本的各种文字说明，采用的是中英双板模式书写。 网站的目录结构如下： 伍志强------网站根目录 Css ------存放外置CSS文件 Images ------存放图片文件 Music ------存放背景音乐 ＪＳ------存放的ｊａｖａｓｃｒｉｐｔ代码 ．ｐｒｏｊｅｃｔ------编译时建立的一个工程 Index系列------存放的网站的各个网页 2 概要设计
3 详细设计 页面的布局和风格 DIV+CSS的基本过程是先布局，对网页进行总体设计，再设计内容，对布局的每一部分进行设计。 DIV+CSS对内容的设计也体现内容和表现相分离的思想。对内容的表现的描述都在CSS中，内容可以应用CSS样式，不需要额外的HTML标签进行内容的修饰。 CSS网页布局的原理，就是按照HTML5代码中对象声明的 body { background:#131b20; font-family:Arial, Helvetica, sans-serif; font-size:100%;
网页制作课程设计
课程设计报告 课程名称《网页设计》 课题名称南岳衡山旅游网页制作 专业信息管理与信息系统 班级信管1301 学号201303110125
姓名肖宏亮 指导教师余新宇、赵锦元、谢雅 2015年6 月10 日 湖南工程学院 课程设计任务书 课程名称《网页设计》 课题南岳衡山旅游网页制作 专业班级信管1301 学生姓名肖宏亮 学号201303110125 指导老师余新宇赵锦元谢雅 审批 任务书下达日期2015 年 6 月10 日 任务完成日期2015 年6 月27 日
目录 1设计的思路 0 2网站总体风格 0 3网站的分析与设计 (1) 4总体设计图 (1) 5详细设计 (2) 5.1各页面的内容 (2) 5.2首页的布局 (2) 5.3制作二级页面 (4) 5.4制作三级页面 (6) 5.6特效 (10) 6错误调试 (11) 7总结 (12) 8心得体会 (13) 9评分表 (14)
第一部分:课设目的 21世纪是一个信息时代，Internet已经进入人们生活与工作的各方面，而网页作为Internet信息传递的重要载体，其重要也日趋突出。所以实训的目的就是要我们更好的掌握好这一学期的网页知识和提高自己的动手能力，并且上传到网上去，让更多人认识我，更好的宣传自己。 个人网站的总体规划和步骤 1设计的思路 我的个人网站主要是以蓝色基调为主，使人一看就了然，很容易一看就形成系统的逻辑，而且与我们南岳衡山的旅游风景相衬显得十分融洽。 2网站总体风格 我设计的这个网站使用蓝色基调主要是给人舒服，能够一目了然，而且能够吸引人的眼球，更重要的是这期主题是南岳衡山，大体基调使用蓝色与大山的图片颜色相当协调。 网站的总体风格主要是以蓝色为主，以淡色为辅，充满活力，生机。具有个性色彩。 网站的布局其实并不复杂，主要是先规划还一个大致布局，可以参考很多旅游网站他的大体布局，但不能照搬全抄，要结合自身网站的特点做一些较之其他网页相对有特色的东西，这样才能更吸引人，在网页顶部，我们必须做一个能代表我们网站的LOGO，所以做好一个模版，模版做好框架了，那网站就初步先采用ps技术设计好自己网站的LOGO，然后创建导航栏，再根据导航栏制作其他的页面。在整个网站的制作过程中我们必须得切记整体风格必须一致，这样才会给人形成一个整体舒服的感觉，否则会显得很唐突。 绿色网站的内容结构也很简单，分类清楚。页面链接的层次也很明确，访问
网页制作设计报告1
关于设计报告 网站设计说明书 姓名： 学号： 班级： 完成时间： 2011年 04 月 25日
一、 网站框架结构图 二、网站设计理念 简洁，舒适，淡雅，精致， 三、网站设计过程 1.首页设计过程 先插入一个4行3列表格，在第1行的第2 列拆分2行，分别插入图片。第2背景颜色 设置，34 行2列嵌入表格插入布局图片，手绘墙画及 画第4行 3列嵌入表格分别实现了 首页实现技术详述
2.富之岛家具商城设计过程 插入16行两列，第一行合并单元格插 入图片。第2行1列拆分单元格插入图片 2列插入 3、5、7、9、11、13、15行 的第1 明超级链接主页。 3.网上购买注册设计过程 注册表单插入14行2列表格。第3、7、8 行2列插入文本域，4、5行2列插入隐藏 域，6行2列插入单选，9行2列插入复选 框，10、11行2列插入文本域，12行2列 插入跳转菜单，13行2列插入列表/ 4.名牌家居展示设计过程 插入1行8列的表格分别插入图片，在左 侧框架插入2行1列的框架在第2
5.了解现代家居设计过程 首页布局结构说明、首页实现技术详述、 首页动态效果描述 插 6.餐台的详细介绍、穿衣镜、床、组合柜、沙发、梳妆台、衣柜详细介绍的设计过程（七个子页面） 插入9行1列，1、2列分别插入图片。第3 行拆分单元格8列，第1列插入 超级链 接。第4行拆分单元格2列，第2 5行插入图片，第6行插入文本。最后一行实现单选。在餐台、穿衣镜、床、组合柜、沙发、梳妆台、衣柜详细介绍的子网页的排版方式相同。
四、设计风格 色系风格：所设计的页面背景颜色一粉红为主调，主要为了突出该网页家具产品的浪漫轻松的风格。 图标设计风格：以富之岛富丽为特点，从而突出了富之岛的独特魅力。特效风格：页面使用了HTML、Flash、Word文字处理，增强了页面的动感，从而使浏览者增加了深刻的印象。 架格风格：每一个页面只是简单的介绍了富之岛系列的简单信息，让浏览者大体的掌握富之岛的基本情况做铺垫，只为了突出通俗易懂的这样一个目的。 内容风格：网站主题、主题实用性、文件关联性、内容切合度，都是用一些简单易懂的词语，就是为了读者掌握我所介绍该产品的简单信息。 五、设计感受 在这次网页设计中，我综合运用了以前专业所学课程的理论和生产实际知识，进行这这次网页设计比赛，从而也进一步提高了我的设计能力，巩固与扩充了我网页设计的等课程所学的内容，更灵活的掌握了网页设计的方法和步骤，懂得了这样分析软件的综合运用，怎样确定设计方案，了解了网页的基本结构，提高了设计能力，熟悉了规范和标准，最重要的是我的独立思考的能里也有了提高。 在这次设计过程中让我觉得自己在平时的观察中不大注意，观察的太少，然而让平时在百度中作为浏览者的我，开始对网站页面排版动态设计开始留意和关注。现在知道要做好一个网站并不是想象中的
网页设计课程设计报告书
武汉理工大学华夏学院课程设计报告书 课程名称：网页设计 题目：俄罗斯方块游戏 系名：信息工程系 专业班级： 姓名： 学号： 指导教师: 2016 年1月14 日
课程设计任务书 课程名称：网页设计课程设计指导教师：苏永红 班级名称：软件1131 开课系、教研室：软件与信息安全一、课程设计目的与任务 网页设计与制作课程设计是《网页设计与制作》课程的后续实践课程，旨在通过一周的实践训练，加深学生对网页设计中的概念，原理和方法的理解，加强学生综合运用HTML、CSS、JavaScript、asp网页设计技术进行实际问题处理的能力，进一步提高学生进行分析问题和解决问题的能力，包含系统分析、系统设计、系统实现和系统测试的能力。 学生将在指导老师的指导下，完成从需求分析，系统设计，编码到测试的全过程。 二、课程设计的内容与基本要求 1、课程设计题目 俄罗斯方块游戏的设计与实现 2、课程设计内容 俄罗斯方块游戏是一个单击休闲小游戏。在俄罗斯方块的游戏界面中，有一组正在“下落”的方块(通常有4个，组成各种不同的形状)，游戏玩家需要做的事情就是控制正在“下落”的方块的移动，将这组方块摆放到合适的位置。只要下面“某一行”全部充满方块，没有空缺，那么这行就可以“消除”，上面的所有“方块”会“整体掉下来”。 对于HTML5、JavaScript学习者来说，学习开发这个小程序难度适中，而且能很好地培养学习者的学习乐趣。开发者需要从程序员的角度来看待玩家面对的游戏界面，游戏界面上的每个方块(既可以涂上不同的颜色，也可以绘制不同图片)在底层只要使用一个数值标识来代表即可，不同的方块使用不同的数值标识。 开发俄罗斯方块游戏除了需要理解游戏界面的数据模型之外，开发者还需要理解为游戏添加监听方法，通过事件监听可以监控玩家的按键动作，当玩家按下不同按键时，程序控制正在“下落”的方块移动或旋转。本程序稍微有点复杂的地方是，当方块组合旋转时，开发
Web网页课程设计
Web网页课程设计 (总学时数：1周，学分数：1) 一Web网页课程设计性质 本课程是一门计算机科学与技术及相关专业实践性环节。以HTML和CSS为基础，全面学习网页设计制作有关的知识，让学生通过实践理解Web基本工作机制，并使学生具有一般网页制作的能力。与此同时，通过对Web页制作技术和制作工具的学习，使学生对网页设计中所涉及的相关知识有一个全面的了解。 二课程设计目的 通过对ASP对象的使用，实现对WEB数据库的访问。通过本课程的学习，使学生全面了解网站建设与网页设计的基本概念、基本理论及业务运作模式，了解网站建设与网页设计的特点及工作过程，掌握网站的建立及网页设计制作的方法，能够完成一般性网站的建设。同时学会Web数据库系统开发的基本方法与过程并能够实现B/S结构的数据库管理系统。 三课程设计地点 计算机机房 四课程设计内容 （1）掌握Web网页常用的开发工具Frontpage或Deamweaver的使用； （2）学会IIS的配置，或者netbox的安装与设置； （3）学会Html、CSS、Javascript的简单开发和应用 （4）学会B/S模式下，asp与数据库的连接，建议采用Access数据库。 动态新闻管理系统。在系统中，必须完成文章的添加，删除、修改、文章内容显示、题目列表显示（学生可根据自己的情况，自拟题目也可）。如图： 文章添加
文章题目列表 文章修改 五课程设计时间安排 第一天完成HTML静态页面和 CSS设计；完成基本JavaScript和数据库的设计 第二天完成动态添加和动态列表显示两个页面； 第三天完成内容显示和删除两个页面； 第四天完成课程设计报告。 六评分标准 成绩包括两部分：考勤和课程设计报告。 课程设计完成后必须提交打印的纸质课程设计报告，这是成绩评定的主要依据。报告必须按照指定格式，详细写出设计过程，并且截取系统运行图片（4张基本图片），附加相关重要代码，最后写出心得体会。页数不得少于10页。 七课程设计要求 课程设计严肃认真，不得无故迟到、缺席。报告书写规范正确，如有抄袭，一律按照不及格处理。
《网页设计与制作》课程设计报告
《网页设计与制作课程设计》 实验报告 院系名称：管理学院专业班级：电子商务XXX 学生姓名： XXX 学号： XXXXXXX 2016年 06 月 一、实验目的 本实验属于设计性实验，在学习完《网页设计与制作》课程的基础上，通过实验学习网页制作的步骤与方法，使用CSS+DIV制作一个简单的网站，能够对网站有一个清晰的认知和规划。进一步熟悉和领悟HTML语言、CSS样式表和JAVASCRIPT语言的语法结构。将理论与实践相结合，加深对本课程的理解。 二、实验步骤 1、进行网站整体规划，包括网站主题、栏目以及界面的构思，确定网站结构，形成初步设计思路。 2、设计网站的主页以及栏目，利用CSS+DIV制作网站主页和弹出式导航条菜单，利用JavaScript制作动态效果，并用firework软件对主页进行切图。 3、设计并利用CSS+DIV制作列表页，并用firework软件对列表页进行切图。 4、设计并利用CSS+DIV制作内容页，并用firework软件对内容页进行切图。 5、进行调试和修改已形成最终实验结果。 三、网站设计思路 1、参照“唯品会”“折800”等电商网站，确定网站主题为“轻奢电商”。 2、设计网站主页,主页设置首页、美妆、服饰、零食、母婴、关于我们、在售分类等七个一级栏目。其中美妆、服饰、零食、母婴四个栏目含有二级栏目。
3、首页设置品牌热卖、限量抢购等图片展示，并利用Javascript设置用户名和密码的表单验证，在图片之下设置一个新闻列表提供有关网站的最新消息，右侧设置账户、密码的表单验证，并在网页结尾处写上官方微信和版权信息。 4、由主页导航栏上的的在售分类引出列表页，在列表页中采用新闻列表样式具体展示本企业的全部商品分类并设置超链接。 5、由列表页中美妆|女士护肤|洁面弹出具体的内容页面，主要由图片以及相应的文字介绍组成。 四、网站的核心代码 1、主页