《网页设计技术》

实验报告

姓名：           南志贤                         

学号：          100408102                                  

班级：         电气1001班                 

学院：      电气与电子工程学院            

专业：         电气信息类                    

教师：            刘文涛                 

一、实验任务书

1、目 的 和 意 义：

　　    这是我做的第一次网站，也是我第一次接触做网站，做我的个人网页并不是仅仅为了完成老师布置的任务，而是真正地想多掌握一门知识--学习如获使用网页制作相关软件（Dreamweaver、Firework、flash软件）并进行网页制作（其实这些软件并不是只是用于网页设计，学习使用这些软件对于日后的生活是有很大帮助的），同时锻炼自己的自学能力和创造实践能力，怎么说我觉得通过网页设计这门课程，它达到地目的和意义是非常重大的，我觉得主要可以概括为以下几个方面：

（1）利于基础知识的理解

　　通过《网页设计》选修课程的学习，让学生掌握一些信息时代生存与发展必需的信息技术基础知识和基本技能，具备了在日常生活与学习中应用信息技术解决问题的基本态度与基本能力。但是，平时学生对于网页设计及网站管理的机理等知识内容的理解比较肤浅，认为它有一种神秘感。但是，学生如果接触了网页设计，就能真正理解，其实网页设计也不过如此，从而打破计算机的一种神秘感。

（2）、有利于逻辑思维的锻炼

　　在许多常规学科的日常教学中，我们不难发现这样一个现象，不少学生的思维常常处于混乱的状态。写起作文来前言不搭后语，解起数学题来步骤混乱，这些都是缺乏思维训练的结果。然而网页设计却能直接有效地训练学生的创新思维，培养分析问题、解决问题的能力。即使一个简单的网页，从确定网页特色风格到排版布局、界面布局（有时涉及到编写代码）到调试运行，整个过程学生都需要有条理地构思，这中间有猜测设想、判断推理的抽象思维训练，也有分析问题、解决问题、预测目标等能力的培养。

（3）、有利于与其他学科的整合

　　在网页设计中，我们可以解决其它学科有关问题，也利用其它课程的有关知识来解决信息技术中比较抽象很难理解的知识。在信息技术课中整合其它学科的知识，发挥信息技术的优势，例如，在看网页设计的有关代码时，其中很多脚本代码的使用规则和我们今年上半年所学的C语言的规则是相通的。

（4）、有利于治学态度的培养。

　　网页设计设计中，特别是再用表格法布局时，这过程中是需要有条理地构思及判断推理，有时因为粗心可能会导致网页无法正常运行从而可能会导致整个网页需要重新制作，这时我们会有一种哑巴吃黄连——有苦说不出的感觉，。因此，网页设计初学阶段，我们经常会犯这样的错误，可能要通过几次乃至十多次的反复修改、调试，才能成功，但这种现象会随着学习的深入而慢慢改观。这当中就有一个严谨治学、一丝不苟的科学精神的培养，又有一个不怕失败、百折不挠品格的锻炼

                        

2、 内容和要求：

　　　　网页设计这门选修课程需要我们完成一个网站，在此我制作了一个关于90后追求个性和自由的网站，这个网站主要包括有15张网页。因为这个主题跟我们息息相关，我觉得是我们现代学生的思想和追求的一种写照。我的整个网站中含有FLASH动画图片、音乐（例如我的资料网页中的背景音乐，视频多媒体元素中都有相关视频）。 利用表格或层技术进行网页的布局，其中主要是用表格进行布局，层技术使用相对较少，因为层技术在使用时当浏览网页时会错位这个问题我一直没有攻克所以没有过多使用。网站的整体风格比较一致、色彩协调、主题鲜明，整个网站中以各种浅色为主调，各个网页各有特色，但却并不影响整个网站的色彩的协调和主题的表达。其中网页中的2篇日志我认为是比较励志的，所以在此向大家推荐一下。过多的我在此也不都啰嗦，希望通过这个网站的浏览能对我有一个充分的了解。

3、实验环境：

Adobe Dreamweaver CS5

Adobe Dreamweaver CS3 （这个软件用的较少，主要用的是Adobe Dreamweaver CS5）

  

二. 网站功能

三、制作流程

（1） 步骤一：先通过在图书馆查找资料以及网上视频自学Adobe Dreamweaver CS5

（Adobe Dreamweaver CS3 ） Adobe PhotoshopCS5  Adobe Flash CS4

Adobe FireworksCS5，下载这些相关软件，边学边试着操作

（2）步骤二：想好网站的整体风格、色彩协调、主题，然后在A4纸上设计首页布局草图和各个分页的大致草图

（3） 步骤三：:利用 Adobe Fireworks和   Adobe PhotoshopCS5制作一些所需照片以及处理和美化自己的照片使其合乎所用，另外再在网上找一些比较漂亮的背景图片

（4）步骤四：利用利用Adobe Flash CS4制作Flash,分别将设计好的网站LOGO和Flash动画以及在网上寻找一些相关动画

（5）步骤五： 收集其他文本资料并把它打成电子档

（6）步骤六：开始利用Adobe Dreamweaver CS5编辑首页和各个分页（主要利用表格进行布局，层用的较少）

（7）步骤七：在文本专栏编辑文本及文本字体大小和颜色；通过媒体插件等为首页及各个分页插入如背景音乐及视频等多媒体元素，在页脚设置上下页链接

（8）步骤八： 将各个分主页进行浏览看是否达到所需要（其实边做就要边浏览以便及早发现问题并解决问题），有错误及时调整。

（9）步骤九：检查各个分页无误后，将设计好的各分页链接到分页导航栏和主页导航栏再进行预览

（10）步骤十：将所有材料及网页放入一个文件夹，保存修改后的网页

（11）步骤十一：总结及反思，书写实验任务书

四、实验结果分析

见电子稿网页

五、实验总结

       这是我做的第一次网站，也是我第一次接触做网站。自上大学以来一直想做个自己的网站，通过这次选修网页设计这门课程再加上自己的自学，总算完成了自己这一心愿，虽然耗费了大量的时间且做得有点粗糙，但是还是觉得挺高兴的，毕竟这也是自己一次努力地尝试并且也是真正用心地做并不是抱着敷衍和完成任务的态度。

　　　来到大学吧，一直过得比较忙，因为我一直相信古人那句“能忙世人之所闲者，方能闲世人之所忙”，但是忙到如今自己也不知道自己到底做了些什么，但是通过这个网站的制作中的思考，我找到了答案，我恍然明白原来我在理想之路的奔跑中缺乏了对自己的思考，没有正确地思考前方的道路，没有脚踏实地踏踏实实地去做好每一天。做这个网站过程中，通过自己寻找我的详细资料和回忆我的过去生活，我对自己做了一个详细地总结和思考，对自己又有了一个重新的定位，我找回了我自己，或许你有点不敢相信，但是事实就是这样，我很感谢我的这次尝试，也非常感激在这个网站的制作过程中给予指导和帮助的同学和老师。

  

第二篇：网页设计综合实验报告格式

华北科技学院计算机学院综合性实验

实 验 报 告

课程名称        网页制作A                       

实验学期    20##  至   2013    学年 第  一  学期

学生所在系部           计算机学院               

年级   20##级     专业班级     计科B103        

学生姓名      韩海艳       学号   201007014331  

任课教师              邵铁君                    

实验成绩                                      

计算机学院制

《网页制作A》课程综合性实验报告

开课实验室：信息楼基础六实验室                         20##年 11月20日