“巴黎文化之旅”简介
华南师范大学大学网页制作基础课程综合设计性实验报告
年级专业: 协作小组编号:
指导教师:李桂英
摘要:网页是当前Intetnet的最常见应用之一,是人们获取和发布信息的主要途径,掌握网页制作的原理和方法,对今后工作生活有很大的帮助。本综合实验是在了解了网页设计的原则方法,掌握了Fireworks、Dreamweaver等工具处理网页中的图形图像及建立、编辑网页页面的操作技能后,运用所学过的所有相关知识综合设计制作一个介绍巴黎文化和风光的网站。通过设计与制作,了解和掌握了网站的设计建立流程与网页的制作方法。
关键词:图形图像处理、表格布局、网页模板、超链接、框架、音频、视频
一、“巴黎文化之旅”设计要求
1、 绘制网站结构图,将各模块关系用简明的图示描述出来
2、 网站制作时需要使用Dreamweaver建立并管理站点,并在站点根目录下建立images等文件夹。
3、 网站至少包括10个以上的网页,每个同学至少制作2个以上的网页。
4、 要求至少要使用模板技术或框架技术中的一种来搭建网站整体架构。
5、 页面美观,包含多种媒体,如文字、图片、动画(GIF或FLASH等)音频、视频等。
6、 网站制作完成后采用压缩工具将整个网页文件夹转换成压缩文件再上传。
二、“巴黎文化之旅”设计方案
⑴网站标题:巴黎文化之旅
⑵网站内容简介:本网站通过图片、视频、音乐、文字等多种媒体的形式展现花都巴黎的文化和城市风光、并为旅行者提供了旅游信息和建议。
⑶网站结构图

(4)页面脚本(可从网站中任选5张最有代表性的页面)
四、协作小组人员任务完成情况(指最终各人完成的子任务)
作品已提交到课程中心*****(组长学号)的综合实验作业。
五、应用技术与技能:
1、HTML技术
该技术的简介(简单描述一下该技术或方法,可以网上查找)
2、图形图像处理技术
该技术的简介(简单描述一下该技术或方法,可以网上查找)
3、视音频技术(如你在网页中没有使用视音频,可以不填这项)
该技术的简介(简单描述一下该技术或方法,可以网上下载)
六、学习经验报告
此部分主要围绕两个问题总结:在实验过程中你们小组遇到哪些困难及采用的解决方法;回顾整个实验过程,你们学到了什么(不仅是技术方面),以及还有哪些不足之处?这几行字上交前记得要删除。
本小组的5名同学在通过设计和制作“巴黎文化之旅”的实际过程中,真正的经历了一个网站从设计规划到建设完成的全过程。整个过程中我们遇到了不少困难,也有很多体会。
首先谈谈我们遇到的困难及解决方法。我们这个网站需要有部分视频,但是我们所需要的视频总是无法下载,后来询问了辅导老师,学会了视频的下载方法。还有网站背景音乐如何连续播放的问题,也是通过询问老师后,掌握了方法。我们在网站中使用的部分视音频需要简单的剪辑合成,我们小组通过在图书馆借阅相关书籍和网上观看教程自学掌握了“会声会影”初步技能。
在长达一个学期的协作制作网站的过程给我们小组的同学很多共同的感触。首先,我们认识到的是:网站的制作重在设计。一个网站制作的成功与否,很大程度上依赖于其最初的设计思路。大量的讨论,交流彼此的构思,事先绘制结构图,能便成员们对各个模块及相互关系有个清晰的构想,后面的工作才能有条不紊的进行。
其次,带着任务学习的确是掌握网页制作技能最好的方法。因为有任务,所以学习起来才会有动力,很多问题都是在真正完成任务的时候才能遇到,知识也是这样才能学得牢靠。
最后的感受是,协作学习的方法让我们的学习与以往不同。大家经常讨论,共同解决问题。每个同学在制作时的心得,都会和大家分享,这样我们的学习效率真的提高不少。而且通过这次协作,同学间也增进了了解,集体责任感和沟通能力都有所加强,对自己和他人的劳动成果也更加尊重。
当然也有不足,如果我们小组在任务开始时能紧跟老师的日程安排,早些开始沟通讨论整体设计方案,后期制作的时候就能减少一些不必要的时间精力上的浪费,最后网站的效果会更精致美观。这也是这次综合实验中的小小遗憾。
参考文献
[1] 郭锂,柯铭健.网页设计与制作[M] .北京:高等教育出版社,20##年7月第1版
[2]
第二篇:网页制作实验报告
实验一:站点设置
一、实验目的及要求
本实例是通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。
二、仪器用具
1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。
2、安装windows xp操作系统;建立iis服务器环境,支持asp。 3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件;
三、实验原理
通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。
四、实验方法与步骤
1)执行“站点\管理站点”命令,在弹出的“管理站点”对话框中单击“新建”按钮,在弹出的快捷菜单中选择“站点”命令。
2)在弹出的“站点定义为”对话框中单击“高级”选项卡。
3)在“站点名称”文本框中输入站点名称,在“默认文件夹”文本框中选择所创建的站点文件夹。在“默认图象文件夹”文本框中选择存放图象的文件夹,完成后单击“确定”按钮,返回“管理站点”对话框。
4)在“管理站点”对话框中单击“完成”按钮,站点创建完毕。
五、实验结果
六、讨论与结论
实验开始之前要先建立一个根文件夹,在实验的过程中把站点存在自己建的文件夹里,这样才能使实验条理化,不至于在实验后找不到自己的站点。在实验过程中会出现一些选项,计算机一般会有默认的选择,最后不要去更改,如果要更改要先充分了解清楚该选项的含义,以及它会造成的效果,否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。
实验二:页面图像设置
一、实验目的及要求:
本实例的目的是设置页面的背景图像,并创建鼠标经过图像。
二、仪器用具
1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。
2、安装windows xp操作系统;建立iis服务器环境,支持asp。
3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件;
4、安装acdsee、photoshop等图形处理与制作软件;
5、其他一些动画与图形处理或制作软件。
三、实验原理
设置页面的背景图像,并创建鼠标经过图像。
四、实验方法与步骤
1) 在“页面属性”对话框中设置页面的背景图像。
2) 在页面文档中单击“”插入鼠标经过图像。
五、实验结果
六、讨论与结论
实验结束后我们可(转载自第一范文网,请保留此标记。)以看到页面的背景变成了我们插入的图像,并且要鼠标经过的时候会变成另一个图像,这就是鼠标经过图像的效果。当然这种实验效果很难在实验结果的截图里表现出来。这个实验的关键在于背景图像的选择,如果背景图像太大不仅会影响网页的打开速度,甚至图像在插入会
也会有失真的感觉,因此在插入前对图像进行必要的处理能使实验的效果更好。 实验三:表格制作
一、实验目的及要求:
本实例是要创建边框为1像素的表格。
二、仪器用具
1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。
2、安装windows xp操作系统;建立iis服务器环境,支持asp。
3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件; 4安装acdsee、photoshop等图形处理与制作软件;
5、其他一些动画与图形处理或制作软件。
三、实验原理
创建边框为1像素的表格。
四、实验方法与步骤
1) 在文档中,单击表格“”按钮,在对话框中将“单元格间距”设置为“1”。
2) 选中插入的表格,将“背景颜色”设置为“黑色”(#0000000)。
3) 在表格中选中所有的单元格,在“属性”面版中将“背景颜色”设置为“白色”(#ffffff)。
4) 设置完毕,保存页面,按下“f12”键预览。
五、实验结果
六、讨论与结论
本实验主要通过整个表格和单元格颜色的差异来衬托出实验效果,间距的作用主要在于表现这种颜色差异。表格的背景颜色和单元格的背景颜色容易混淆,在实验中要认真判断,一旦操作错误则得不到实验的效果。“表格宽度”文本框右侧的表格的宽度单位,包括“像素”和“百分比”两种,容易混淆,要充分地理解这两种单位表示的意义才能正确地进行选择,否则就不能达到自己想要的效果,设置错误就会严重影响实验效果。
实验四:创建锚点链接
一、实验目的及要求:
本实例的目的是创建锚点链接。
、仪器用具
1、生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。
2、安装windows xp操作系统;建立iis服务器环境,支持asp。
3安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件;
4、安装acdsee、photoshop等图形处理与制作软件;
5、其他一些动画与图形处理或制作软件。
三、实验原理
创建锚点链接。
四、实验方法与步骤
1) 在页面中插入1行4列的表格,并在各单元格中输入导航文字。
2) 分别选中各单元格的文字,单击“”按钮,在弹出的“超级链接”对话框上的“链接”文本框分别输入“#01”“#02”“#03”“#04”。
3) 在文档中输入文字并设置锚记名称“01”,按下“ enter”键换行,输入一篇文章。
4) 在文章的结尾处换行,输入文字并设置锚记名称“02”,按下“ enter”键换行,输入一篇文章。
5) 同样的方法在页面下文分别输入文字和命名锚记为“03”和“04”,并输入文章。
6) 保存页面,按下“f12”键预览。
五、实验结果 六、讨论与结论
添加瞄记的作用是可以帮读者快速找到自己想要的文章,同时也可以使页面更加精简。本实验的关键难点在于链接文本框输入的名称和瞄记的名称要相一致才能达到实验的效果,同时要记得是在上一篇文章的结尾处输入文字并设置瞄记名称,并记得输入对应的文章,否则瞄记可能不能用。熟练程度低在实验中不能很好地使用各种工具,无法一次准确地寻找到适当的位置。实验中忘记选择“不可见元素”,几次实验都失败,最后才得出正确的结论。因此在实验前要先做好预习,否则实验过程会比较吃力。
实验五:设置css样式
一、实验目的及要求:
本实(转载自第一范文网,请保留此标记。)例的目的是通过设置css样式创建表格的虚线边框。
二、仪器用具
1生均一台多媒体电脑,组建内部局域网,并且接入国际互联网。
2、安装windows xp操作系统;建立iis服务器环境,支持asp。
3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件;
4、安装acdsee、photoshop等图形处理与制作软件;
5、其他一些动画与图形处理或制作软件。
三、实验原理
通过设置css样式创建表格的虚线边框。
四、实验方法与步骤
1) 在网页中创建一个表格。
2) 在“css样式”面板中单击“”按钮,在弹出的对话框中进行设置,完成后单击“确定”按钮。
3) 在弹出的对话框中进行设置,完成后单击“确定”按钮。
五、实验结果
六、讨论与结论
对话框中各项指标和属性的设置存在一定的难度,如果没熟练掌握就容易出错使实验失败。对“ccs”样式所要使用的各种按扭不够熟悉在使用的时候觉得很生硬。这个实验成功的关键在于对软件的掌握程度以及对各种属性的认识程度,只要充分地掌握了软件的各种操作,对各属性所代表的含义有充分的认识就能很好地完成这个实验。
实验六:创建表单
一、实验目的及要求:
本实例的目的是创建一个募捐表单。