网页设计实验报告Word文档格式.docx
- 文档编号:6153158
- 上传时间:2023-05-06
- 格式:DOCX
- 页数:18
- 大小:5.27MB
网页设计实验报告Word文档格式.docx
《网页设计实验报告Word文档格式.docx》由会员分享,可在线阅读,更多相关《网页设计实验报告Word文档格式.docx(18页珍藏版)》请在冰点文库上搜索。
建立站点文件和文件夹结构。
并使用向导创建站点,使用高级设置本地站点、管理本地站点。
4、格式要求:
A设置整体页面属性、制作普通文字页面、在页面中放入图像,制作图文混排页面、制作鼠标经过图像的交互效果,制作导航条的交互效果。
B在页面中插入Flash按钮或Flash文本或Flash动画,丰富网页内容。
C利用框架或表格,对页面做整体规划。
并对表格属性进行设置。
D在网页中制作外部友情网站链接,内部页面链接,选择制作电子邮件链接和同页面或不同页面之间的锚点链接。
E必须要有导航条,导航项必须在4项以上,形式不限。
5、功能要求:
必须能从首页进入二级页面,并且从二级页面返回首页。
二、选题背景
Bigbang是韩国的一个有名的男子组合,意为宇宙大爆炸。
当然它的诞生确实在音乐界造成了一定的影响,他们的多才多艺更是使得他们能一直走到如今。
所以作为他们的铁杆粉丝,我也想要把这个组合介绍给大家,让大家一起了解流行音乐的真正魅力。
三、所用技术
1.用Photoshop处理所用的图片。
2.在Dreamweavercs3中建立布局,插入布局表格。
3插入图片,设置背景图像,设置图像属性。
4.设置鼠标经过图片
5.插入文本,设置文字格式
6.创建超级链接(文件链接,图片链接,网页链接)
四、实施过程(描述网站的总体布局和设计过程,可以通过截图、表格等方式体现设计步骤,描述实施中遇到的问题及解决方案)
(一)、确定网站主题,即韩流明星BIGBANG
(二)、搜集材料,主要从成员简介,社会评价,演艺经历,音乐作品,成员写真,获奖经历,近期活动消息,热门视频等方面搜集资料,然后分类整理成文件夹。
(三)、用Photoshop处理图片
(1)图片合并,以便更好的添加文字如:
+
+
(2)图片的裁剪如:
(四)、在Dreamweavercs中新建站点
(五)、在Dreamweavercs3中插入表格,在完成整体排版布局后插入图片,例如首页
(六)、完成插入文本,插入网页头部内容,设置鼠标经过图像,创建超级链接等页面的设计。
(1)文本插入
(2)插入网页头部内容,包括插入关键字、插入说明、设置刷新等
(3)设置鼠标经过图像
(4)通过创建链接,包括文本链接、文字和图片的热点链接等完成页面与页面之间的跳转,进一步丰富页面的内容。
(5)以上只是以首页的设计为例,除此之外,还逐一完成了网站中每张网页的设计操作。
(七)、测试上传,完成制作。
第二阶段的实验报告
一、本阶段设计要求(教师填写)
对于本阶段应该包括以下几个主要部分:
A、利用CSS来定义网站的样式表。
B、网页要有落款、版权说明。
C、网站中需要至少一个页面分别运用表格、框架等技术。
D、使用行为给网页添加特效,例如:
弹出信息,打开浏览器窗口,添加背景音乐,设置状态栏文本等。
E、在网页中插入Flash动画、Flash按钮、Flash文本等。
(第一阶段做过的就不用做)
F、丰富网页中的各种链接,例如:
图象热点链接,E-mail链接,下载连接,锚点链接等。
二、第一阶段所完成的任务
第一阶段已经完成了,确定主题,收集素材,定义站点,以及对网站作整体规划,在格式方面,已经完成整体页面属性设置,文字属性设置,页面中插入图像,制作鼠标经过图像以及导航栏的插入等。
在链接方面已经完成文字链接和导航栏的链接等。
三、所用技术(本阶段所使用的技术)
1.网页框架技术。
2.添加背景音乐。
3.在网页中插入Flash动画、Flash按钮等。
4各种链接:
E-mail链接,下载连接,图像热点链接等。
四、实施过程
打开Dreamweavercs3,新建一个展示相册的页面。
首先建立框架集,选择框架类型为上方和下方框架,将页面分为上下三部分,在第一部分中利用FLASH创建精美相册,在第二部分插入图片,在底部框架中注明网页的落款和版权说明。
一.创建框架集,并设置框架的颜色和宽度等属性,将页面分成上下三部分,效果如下:
二.利用FLASH制作相册。
(一)运行Dreamweaver,插入并保存FLASH元素,在属性面板中重新设置动画的宽、高值,如下图所示:
(二)设置“Flash元素”的参数,为Flash相册指定调用的图片、设置相册外观等
(三)在中间部分插入图片,底部注明落款和版权说明,在浏览器中预览效果。
打开已经做好的页面,丰富页面的内容,包括插入背景音乐,添加email链接,下载链接以及图片热点链接等技术
一.如在音乐页面中插入音乐和歌曲下载链接,在浏览器中预览效果如下:
二.在主页中设置电子邮件的链接,点击主页菜单栏中contacts便可进入页面。
三.丰富页面,添加更多的链接,例如主页中的图像热点链接
五、小结(本阶段的收获、体会及总结)
在本阶段中,完成了网页制作的很重要的几个步骤,目的是进一步丰富原本静态单调的页面,技术和能力的要求比第一阶段更高了。
区别来说,第一阶段主要是为网站建立主要的大的框架结构,以及做一些简单的图片和文字处理。
而在这一阶段,我添加了FLASH动画,插入和背景音乐,还给各个网页设计的做了进一步的丰富。
完成了这一阶段,自己的收获更大,收益也更多,因为这一阶段难度更高所以自己也有了更多的成就感,所以整个设计的过程自己也很享受。
第三阶段的实验报告
在第一二次设计题目的基础上,对内容进行完善,增加2—4页面。
2、对于本阶段应该包括以下几个主要部分:
A、使用模板制作两个页面,必须定义可编辑区。
B、根据自己的主题插入表单及表单元素,例如:
在线报名,联系我们,在线订购单等。
C、利用Dreamweavercs3的扩展管理器安装必要的插件,制作特殊效果,例如:
彩色渐变文字,使用图像创建漂浮广告,根据不同时间显示不同的问候语,创建随机切换的广告图等。
(选择其中之二来做即可)
D、使用行为继续添加特效,例如:
E、把多个页面中的相同元素创建为库项目,并加以应用。
F、使用站点地图显示站点内页面间的链接关系。
3、课程设计报告编写基本要求:
A.必须独立完成课程设计报告;
B.课程设计报告书写规范、文字通顺、图表清晰、数据完整、结论明确;
C.要求课程设计报告必须打印,装订成册。
二、前两阶段所完成的任务
第一二阶段已经完成了,确定主题,收集素材,定义站点,以及对网站作整体规划,在格式方面,已经完成整体页面属性设置,文字属性设置,页面中插入图象,制作鼠标经过图象,制作导航栏,插入Flash元素,用CSS来定义网站的样式表,用行为给网页添加特效等。
为进一步丰富网页在链接方面已经完成各种链接的制作等。
1.创建模板,利用模板制作页面并定义可编辑区域
2.插入表单和表单元素
3.创建站点地图
4.建立库项目
5.增加“打开浏览器”的特效,以及使用插件
四、实施过程(描述网站的整体结构,使用站点地图显示站点内页面间的链接关系,并对本阶段新增的网站功能加以说明,最后,阐述网站的不足之处及可以继续完善的功能。
)
一.打开在DreamweaverCS,在插入记录中选择创建模板并保存,利用模板制作网页并根据排版要求定义可编辑区域。
之后再利用插入表格等方式对网页进行进一步的内容丰富,下图是创建模板的截图:
二通过插入表单的方式在“最爱bigbang的vip”网页中创建一个”粉丝登陆“
的小窗口,在姓名一栏插入文本域,在密码一栏插入密码域,效果图如下:
三网站中各个网页都涉及完之后,建立站点地图,方便于直观的看清网站的结构,使得整个网站更加完整和完美。
四建立一个版权的库项目如下
五、小结
第三阶段的完成也就意味着本次网页制作的圆满结束。
自己从这次实践中收获的不仅是网页制作的知识,更是一份独立完成作业的满足和欣喜。
在整个过程中我严格按照老师的要求完成制作,同时做到不失自己的风格。
在老师的指导下和自己耐心的钻研下,我尽我最大的努力将网页制作到完美。
当看到自己的最终成果时,不禁发自内心的感叹,感叹一路来的构思、设计、制作、修改最终完美收工。
但网页制作的技术很广泛,自己也只是略懂一二,相信还有很多值得学习的地方。
任务下达日期:
年月日
任务完成日期:
年月日
最终效果图
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 网页 设计 实验 报告