网页制作实训报告1.docx

1、网页制作实训报告1天津电子信息职业技术学院暨国家示范性软件职业技术学院网页制作实训报告姓 名： 系 别： 专 业： 班 级： 指导教师： 完成时间： 2012 年 6 月 1日 目录一、题目的意义 1二、网站的设计 32、软件的选择 4三、首页的设计及制作 41、首页的制作 4四、素材的制作 71、flash的制作 72、gif动画的制作 8六、网页设计实训总结 11一、题目的意义网站的作用信息技术的飞速发展，带来了全球信息资源不可逆转的网络化发展趋势。信息技术对人类社会、经济、文化的影响是全方位的，多层次的，对于教育亦是如此。信息科学技术、人工智能等的研究与开发，不仅对我国现行的教育与教学理

2、念提出了挑战，而且为我们实现素质教育的理想提供了切实可行的方案、方法与工具。高新技术已成为营造新型文化学习的强有力的催化剂。全球信息资源的网络化趋势对现代人的能力素养，尤其是信息素养，提出了新的要求。它要求人们在网络环境下学会基于资源的学习，学会有效地收集、整理、加工信息。目前，教育信息化已成为教育界最热门的话题之一，也是近些年来投入较大的方面。在一些学校，多媒体、校园网已像校舍、教学仪器一样成为学校的必备设施，给教育教学注入了生机和活力。 组建学校教育网站，可以把学校信息和教育方式推到网上，以获取更多的学生的注意，这是学校走近招生的第一步。您在筹集资料及以后的维护中要注意，这是一个增加学校招

3、生渠道的方式。 学校网站能够更好的树立学校形象,展示学校风采.Internet最初始层面的作用就是展示学校形象，就象利用各种传统媒体发布的学校形象宣传广告，所不同的是费用低廉、有效时间长、速度快、更新便捷，仔细考虑您的竞争优势在哪里，如学校是否获得过什么奖励、教学先进等，提高学校的知名度 在此时，网络的技术手段不再是早期的简单通讯 ,也不再是冷冰冰的、单向传播的传统意义上的媒体 ,它是实时的、双向的、交互的、是可控的,是多种媒体的。我们觉得，这才是网络教育真正具有革命性的意义所在。其优势有以下几方面： （1）极大的增强了教师之间的交互性、打破了学校与教师、教师与学生之间的相对孤立状态。这种交互

4、性是近乎实时的、而且可以利用多种渠道实现，比如：电子邮件，BBS，WWW，网上在线交谈等等; （2）学习的异步性：利用网络进行远距离教育，可全天24小时进行，每个教师都可以根据自己的实际情况来确定学习时间、内容和进度，可随时在网上下载相关学习内容或向同行、专家进行请教； （3）学习信息的广泛性：网络同多媒体技术、虚拟现实技术相结合，可实现虚拟图书馆、虚拟实验室、虚拟课堂等；为教师提供多层次、全方位的学习资源，可引导教师由被动式学习向主动式学习转变； （4）评价的及时性：在传统的远距离教育中，对教师进行评价是件非常困难的事，要耗费大量的人力和物力，而学习过程中的形成性评价是提高学习效率的有效途径

5、。通过网络上评价系统，可使教师及时得到有关自己学习过程的反馈及有针对性的诊断，使得教师能够及时调整自己的学习。 利用Internet克服了传统教育的局限性，它将形成一种主动的、协作的、开放的学习模式，并充分考虑双向学习环境，采取有提问、有反馈、有交流的方法，既保留了传统远教中的生动形象性和不受空间限制等优点，又有相互访问，双向交流，学习资源、学习内容广泛等优良特性。 我们觉得 ,网络教育和学习的研究发展到今天 ,已经走过了最初大胆假设的阶段,现在正在步入小心求证的时期，前途一片光明，我校的网络建设的尝试可见一斑。 学校网站为学校管理提供了一个可实现交互性的范本，学校网络利用率得到提升，学校的通

6、知，学校的新闻，建立的学习专题，备课资源和课件资源可在第一时间实现上传和下载的共享方式，校园留言板成为学校管理及时反馈的一个舞台，网络的优势逐步展示出来。学校因此被中国教育先锋网评?第二届互联网知名学校，这也是对于我们充分利用网络，实现管理优化的一种充分肯定。 实践证明，计算机，创造了一个美丽的神话；多媒体，展示了一个多彩的世界；互联网，连接了一份梦想与光荣；如果我们网住了今天；那么明天我们就能做得更好! 国家的希望在教育，教育的希望在教师，教师在教育教学改革中的关键作用得到了人们更广泛的认同。教师专业化、教师的专业发展，无论在理论上还是实践上都成为世界教师教育关注的焦点。 顾泠沅曾

7、说过这样的话，大意是，如果说过去的校长以教学质量为他的责任的话，那么现在的校长的职责有两条，还应把教师的发展作为他的职责。二、网站的设计 1、颜色的选择 蓝色被看作是代表理智的色彩，它象征着一种清新、明晰、合乎逻辑的态度，人们看到蓝色时会感到开阔、博大、深远、平稳、冷静。实验也证明，蓝色会使人的呼吸变弱、脉搏减慢、血压降低。表格背景颜色选为白色，能使紫色沉闷的感觉消失，变得优雅，标题字选为蓝色能配合淡紫色的网页背景色使人能更好的放松心情 。2、软件的使用Dreamweaver 8Fireworks 8Flash 83.主题的选择我采用六一儿童节为主题，就是因为“六一儿童节”到啦，希望能联想起大

8、家儿童共同美好的“那一年”。三、首页的设计及制作1、首页的制作1、在F盘创建一个文件夹，作为站点文件夹，将素材文件和文件夹存入其中。如图1-1所示。图3-12、双击打开Macromedia Dreamweaver 8图3-2 图3-23、编辑站点首页然后点击文件窗口的站点管理如图3-3图3-34、点击新建按钮选择站点建立站点 如图3-4图3-45、框架的建立 如图3-5图3-5 6、最终形成如图3-6图3-6四、素材的制作1、flash的制作1、在站点文件夹中创建一个文件夹，作为素材文件夹，将素材文件存入其中。2、打开FLASH8，如图4-1图4-1然后把所需要的素材执行“文件导入导入到库”，

9、 在图层1的第一帧添加一个关键帧，然后插入一张图片，再在15帧添加一个关键帧，最后在第一帧处创建补间动画，以后的几个图层按同样的方法做，最终形成 如图4-2图4-2 3、保存并发布2、gif动画的制作1、打开Firework 8 如图4-3图4-32、在“开始页”中选择“新建Firework文件”，新建一个空白文件。在弹出的“新建文档”中设置画布的“宽”为952，“高”为200，画布颜色选择白色，然后单击“确定”按钮。3、制作图片选择“文件”|“导入”菜单命令，在“导入”对话框中选择需要导入的图片。3、导入一张图片并调整打小如图4-4 图4-44、选择“文件”|“另存为”菜单命令，将文件以“图

10、片.png”为文件名保存在指定文件夹下。五、模板的制作及设计1、打开Dreamweaver,新建一个基本页，插入一个表格，设计成为你想要的模板格式，然后 另存为模板 如图5-1图5-12、然后把想编辑的地方设置为可编辑区，变成自己想要的布局 如图5-2图5-23、然后在打开分别新建四个子页，在资源里边找到模板如图5-3图5-34、把模板拖放到子页中，然后对子页进行编辑具体操作和首页一样5、最后用超链接把各个独立的网页连接起来五、最后变成一个完美的网页如图5-1六、网页设计实训总结通过这次实训对这门课程的学习，做好主页，并不是一件容易的事，它包括个人主页的选题、内容采集整理、图片的处理、页面的排

11、版设置、背景及其整套网页的色调等很多东西。所以我得出一下总结：1、准备资料和挑选符合目的主题的合适素材做主页当然要收集、准备资料。在网上多转转，看到什么漂亮的网页，把它保存起来，作为以后自己设计主页时的参考。另外，还包括搜集美化主页可能要用到的各种材料，如背景、小动画图标等等。你可以在硬盘上建一个文件夹，下分“图片、声音、动画”等文件夹，养成上网时看到有创意、新鲜的图像，就按鼠标右键存入你硬盘相应文件夹的习惯，时间一长你就有拥有了一个可观的图库，等做主页时随手拈来或加以修改就成你自己的东西了。2、 规划好整个网站主页的设计应以醒目优先，应该令人一目了然，切勿堆砌太多不必要的细节，或使画面过于复

12、杂。切记，页面给人的第一观感最为重要！在网上到处浏览网站的人很多，如果你的主页给人的第一印像没有吸引力，很难令他们深入观赏，而且他们恐怕再也不会访问你的网站了。3、 善用图片，增强艺术效果 我记得老师说过网页的迷人之处之一，要算它上面能点缀许多漂亮的图片。精美的图片设计，可以使自己的网页增辉不少，令人过目不忘。图片的内容应有一定的实际作用，切忌虚饰浮夸，同时还要注意与文字的颜色搭配。最佳的图像集美观与资讯于一身。4、善于借鉴他人主页制作中的设计技巧由于在网上用浏览器浏览任何主页时，都能查看到该主页制作时所编写的绝大部分网页编程源代码。因此，如果你想知道并掌握一些优秀的主页采用的设计技巧，试着将其源代码调出来仔细揣摩，并模仿着一步一步去实现。