15、get=blank href=,756519678,&Site=",我是,-,张三丰,"&Menu=yes>
16、加图片。,,3,、按照前面介绍的网页制作技术分别建立不同的网页,(,例如求职意向、成绩单、爱好特长,),，并利用超级链接技术链接到主页,index.htm,上。,,4,、实现网页间过渡效果设计。,实验训练一：个人求职网站,27,,5,、在主页,index.htm,上增加图片热点链接到三个子页上。,,6,、在主页,index.htm,上增加滚动字幕，并有三张不同的图片链接到三子页上。,,实验训练一：个人求职网站,index.htm,求职意向,. h tm,成绩单,.htm,能力展示,.htm,28,,实验训练一之,问题回顾：,1,、到实验室不知道做什么？,不做笔记，不认真听课的结果。,,2,、知
17、道了做什么却不会做：,缺少课前预习。,,3,、文件超链接不能用：,没有保存好就链接了,,4,、文件在哪里找不到：,保存时没有看位置。,,5,、滚动字幕：,不能上下滚动，无超链接。,,6,、图片热点：,应选中图片后点击,“,图片编辑器”,,7,、测试：,按,F12,29,,第二部分：,Flash 2004,,动画制作,,30,,1,、启动,flash,：,“新建,/flash,文档,/,确定” 。,,2,、绘制：,在右侧“工具”下面找到“椭圆工具”或“铅笔工具”等开始作画，在不同的层画出一要表现的图形。,,3,、关键帧：,在“时间轴”上选择一个相邻的帧，右点鼠标，选择“插入关键帧”。,,4,、
18、变化：,选择“任意变形工具”或“箭头工具”，改变你所画图形的样子，使其与上个帧的动作有稍许变化。,,5,、插入关键帧：,重复,3,、,4,动作，通过移动或改变图形的形状、大小、颜色等制作出多幅图片。,,6,、补间：,选择某一祯区间，在“窗口”找到“属性,/,补间,/,形状”，当出现“,,”,箭头时就可以连续动作起来了。,,7,、播放：,控制,/,测试影片（,ctrl+enter,）。,二、制作,flash,动画（,1,）,31,,32,,1,、启动,flash,：,“新建,/flash,文档,/,确定”，如图。,,2,、绘制：,在右侧“工具”下面找到“椭圆工具”或“铅笔工具”等开始作画，画出
19、一个完整的图形。,,3,、组合：,有时需要将图像进行组合后进行变化，以免分散开。利用箭头工具选中要组合的图像，单击“修改,/,组合”。,,4,、变化：,再选择“任意变形工具”改变你所画图形的样式。,,5,、插入关键帧：,在“时间轴”上右点鼠标，选择“插入关键帧”，并重复,3,、,4,动作，移动或改变图形的形状、大小、颜色等。,,6,、补间：,选择某一祯区间，在“窗口”找到“属性,/,补间,/,动作”，当出现“,,”,时就可以连续动作起来了。,,7,、播放：,控制,/,测试影片（,ctrl+enter,）。,一 、制作,flash,动画（,2,）,33,,1,、启动：进入开始,/,程序下启动,
20、flash,动画。,,2,、测试：利用上节的办法制作动画，并测试好。,,3,、发布设置：单击“文件,/,发布设置”，在“格式”中选择“,GIF,图像”复选框，并立即为它命名，然后单击弹出的“,GIF,”选项卡，在“回放”中选择“动画”。,,4,、发布：单击“发布”按钮，一个,gif,动画就做成了。,三、制作,gif,图片动画,34,,35,,36,,gif,动画图片效果,37,,四、将动画插入网页,1,、选择位置：,在网页中选择的合适位置，准备插入做好的动画。,,2,、插入：,单击“插入,/,图片,/flash,动画,/”,，找到你的动画素材，确定。,,3,、预览：,单击“预览”，看一下大小、
21、样式是否合适，通过边框调节钮改变大小。,,4,、插入声音：,在动画的适当位置插入“库”中的声音或其他的声音文件，到时会自动播放。,,38,,五、制作按钮动画,1,、做好一个动画：,在按照前面的办法做好一个动画，并在第一帧上插入“,stop()”,动作，使动画开始时不要自动播放，待按钮按下时开始动作。,,2,、再做好一个按钮：,单击“插入,/,新建元件,”,，给个名称，在行为中选“按钮”，并确定。,,3,、加入按钮：,在动画场景中加一个层，并从菜单栏“窗口,/,库”中将做好的按钮拖入场景中。,,4,、按钮行为：,为按钮添加行为，单击按钮，选择“动作,/,影片控制,/on”,,并添加事件，程序如下
22、：,,on (release) {play();},注释：按下后放开开始播放动画,,on (press) {stop();},注释：按下后不放开就暂停播放,,（示例,-,打球）,39,,六、制作影片动画,1,、新建文档：,命名当前层为“背景层,”,，颜色为绿色,,,大小为,800X600,，并画上一些图案，右击第,60,帧选择“插入帧”。,,2,、创建影片剪辑元件：,单击“插入,/,新建元件,”,，元件名称,”,狐狸”，在行为中选“影片剪辑”，确定。,,3,、脸层：,在元件编辑区，命名当前层为“脸”，利用画笔工具选择一种颜色开始画脸。,,4,、眼身脚：,新建眼睛层，绘制眼睛。同样方法新建其他层
23、，并画出身脚等部分。,,5,、拼合：,调整各层上下顺序，用变形工具改变各部分的大小、角度，拼合成一个完整图形。,,6,、插关键帧：,在每个层的第,3,帧都插入关键帧，并适当改变各层图像的大小、位置、角度。同样分别在各层的第,5,、,7,、,9,帧按照相同的方法改变动作，实现元件的动画效果。,（示例,-,狐狸）,40,,六、制作影片动画,7,、“狐狸”层：回到,场景,1,中，新建层并命名为“狐狸”，从菜单栏的“窗口,/,库”中将做好的“狐狸”影片剪辑拖入场景中狐狸层内并放在适当位置。,,8,、移动：,在狐狸层的第,60,帧创建关键帧，并移动元件到相应位置，可以改变大小、角度。通过复制可以同时出现
24、多个元件，但要组合后才统一行动，不然就要在不同层做。,,9,、补间：,在选中狐狸层的第,1,帧，在属性面板中设置“补间”为“动作”，产生运动渐变动画。,,10,、测试：,按,Ctrl+Enter,键观看效果。,（示例,-,狐狸）,41,,七、动画导出,1,、视频文件,AVI,：,单击“文件,/,导出影片”，文件类型选择“,windows Avi”,，生成可以在视频播放器播放的文件。,,2,、图片,gif,动画：,单击“文件,/,导出影片”，文件类型选择“,gif,动画（*,.gif,）,”,，生成可以具有动画效果的图片文件。,,42,,43,,实验训练二：动画制作,1,、利用,flash,制作
25、一幅,swf,和,gif,动画。,,2,、利用,frontpage,制作一个“个人求职网站”网站，并做好,3,个子页,1,个主页和链接。,,3,、将制作好的动画插入到网站的首页中，并与首页的主题相适应。,44,,1,、在,D,盘上建立一个以你自己的“座号姓名”为名字的文件夹。例如：,88,张三,,2,、启动,FrontPage 2003,，新建一个网页，并以,index.htm,为名保存在形如“,88,张三”的文件夹里面，内容为介绍自己简历，并加图片。,,3,、按照前面介绍的网页制作技术分别建立不同的网页,(,例如求职意向、成绩单、爱好特长,),，并利用超级链接技术链接到主页,index.ht
26、m,上。,,4,、实现网页间过渡效果设计。,实验训练二：个人求职网站,45,,5,、在主页,index.htm,上增加图片热点链接到三个子页上。,,6,、在主页,index.htm,上增加滚动字幕，并有三张不同的图片链接到三子页上。,,实验训练二：个人求职网站,index.htm,求职意向,. h tm,成绩单,.htm,能力展示,.htm,46,,第三部分：,网站建设一条龙,47,,一 、制作个人网站,1,、建文件夹：,在,D,盘下以自己的座号为名建立一个新文件夹，用来存放网站文件。,,如“,web88”,,2,、建站：,在,FrontPage 2003,界面,单击“文件,/,新建”，在右面
27、的“新建”面板栏里面，选择“,新建网站,/,其他网站模板”,,，在弹出的,“,网站模版,”,中选择“,个人网站,”,,3,、找位置：,单击“指定新网站位置”下面的“,浏览,”，在“,查找范围,”下拉框中找到,D,盘下第一步建立的“,web88,”,文件夹。,48,,一、制作个人网站,4,、确定：,单击,“,网站模版,”,中“确定”，于是一个“个人网站”建成了。,,5,、修饰：,对新建的网站的,主页和,各个子页可以采用学过的方法进行必要的修饰、修改，使它变成你自己的个性网站，其中,index.htm,为默认的主页文件。,,6,、保存：,当修改好后，就可以保存了！,,7,、预览：,按,F12,在,
28、IE,下预览所制作的网站，,测试一下各种功能，如果不满意还可以继续在,FrontPage,环境下修改完善，直到满意。,,49,,一、制作个人网站,8,、网站导航：在,FrontPage,编辑状态下，单击“网站”在左下角有个“导航”选项卡，单击可以看到一个直观的网页结构布局，如图所示。,,,,,,9,、测试：,退出,FrontPage,，找到自己刚建立的网站，双击“,index.htm”,文件，于是你刚刚建立的网站便打开了,!,由于未设置成网站服务器，所以“反馈”网页不能正常使用。,50,,二、添加新的子站点,1,、添加：,如果想在已有网站上“添加”新的子站点，可以打开已有网站，再选择“添加到当
29、前网站,”,。 于是新站点就会出现在原来网站的同一个目录下面，如图。,,2,、建立链接：,为了将新加的站点添加到原来的网站中，需要建立超级链接。单击“网站,/,导航”,,,右点主页下的子页，选择“添加已有网页”，找到新建立的子页，确定，并用鼠标拖放到想要的位置。,,3,、测试后保存,。,51,,52,,三、制作动态数据库网站,如何制作具有动态数据处理的网站这是本课的教学难点，也是制作网站的最高境界。它将用到数据库的知识和网站服务器建立的知识。,,动态网站的建立将使你的网站具有用户访问留言功能、表单提交功能，拉近和浏览者的距离。,,下面以“,班级通讯录,”为例，讲解制作数据库网站的过程。它可以实
30、现数据的浏览、添加、修改、删除等功能。,53,,三、制作动态数据库网站,1,、建文件夹：,在,D,盘下以自己的座号为名建立一个新文件夹，用来存放网站文件。,,如“,web888”,,2,、建站点：,进入,FrontPage,界面,单击“文件,/,新建”，在右面的“新建”面板栏里面，选择“,新建网站,/,其他网站模板”，,在弹出的,“,网站模版,/,常规 ” 中选择“,数据库界面向导,”。,,3,、找位置：,单击“,指定新网站位置,”下面的“,浏览,”，在“,查找范围,”下拉框中找到,D,盘下刚建立的“,web888,”,文件夹。,,4,、确定：,单击,,“确定” 。,54,,三、制作动态数据库
31、网站,5,、修饰：,启动“数据库界面向导”，默认各种选项，直接单击“下一步”，由于要链接到一个新建的数据库，于是出现“请输入数据库连结名称”的输入框，请输入：“,tongxunlu”,。,,55,,三、制作动态数据库网站,6,、制作数据表：,修改数据库的列名称、数据类型、表单域类型等，如图。,,7,、编辑：,双击“名称”，将“列名称”改为“姓名”，确定。依此类推，将其他名称全修改了。但主键不要改动。可以添加，顺序可以上下移动。,56,,三、制作动态数据库网站,8,、制作数据表：对,数据库各列都修改好后，点击“下一步”两次，出现：“数据库界面网页”，请将“数据库编辑器”复选框也选中，再单击“下一
32、步”。,,57,,三、制作动态数据库网站,9,、设置管理员：,输入用于访问“数据库编辑器”的用户名和密码，以防止被其他人任意修改数据。当然也可以选择“不使用用户名和密码保护数据库编辑器”选项，这样就允许大家都能改。,都输入,1,58,,三、制作动态数据库网站,10,、完成：,单击“完成”。于是整个数据库网站建立完毕。但是这个网站并不能直接使用，还需要进行,WEB,服务器（,IIS,）设置才可以。,,59,,三、制作动态数据库网站,11,、测试：,找到,web888,网站文件夹，在,IE,下打开 “,index.htm”,文件，看到“数据库界面”网站。点击“,结果网页,”等均不好用，因为目前你的
33、电脑还没有设置成,WEB,服务器。需要进行,IIS,配置。,点击试试看,60,,四、配置,IIS,前言：,IIS,（,Internet Information Server,，互联网信息服务）是一种,Web,（网页）服务组件,,,其中包括,Web,服务器、,FTP,服务器、,NNTP,服务器和,SMTP,服务器，分别用于网页浏览、文件传输、新闻服务和邮件发送等方面。,,要想把你的电脑配置成,WEB,服务器，在网络（包括互联网和局域网）上发布信息或让别人看到你的网站，就要进行,IIS,设置。,,61,,确认,IIS,：,右键单击,“,我的电脑,/,管理”，弹出“计算机管理”界面，双击“服务和应用
34、程序”，如果里面没有“,Internet,信息服务” ，则说明你的电脑没有安装,IIS,程序。,62,,四、配置,IIS,将光盘放入电脑中，单击,“,开始,/,程序,/,控制面板”中的“添加或删除程序”中的“添加,/,删除,windows,组件”，出现“,windows,组件向导”,,,在组件框中选中“,Internet,信息服务,(IIS)”,,并单击“下一步”。,安装,IIS,：,如果你在电脑中找不到“信息服务管理器”,( IIS),，说明你的电脑没有安装,IIS,，这可能需要你提供,windows,安装光盘才能安装成功。如图。,63,,四、配置,IIS,如果想还使你的电脑具有文件传输的功
35、能，请选中,“,文件传输协议,(FTP),服务,”,复选框。并单击“确定,”,，完成添加,IIS,的工作。电脑需重启后方能生效。,安装,FTP,,：,如果你要了解“,Internet,信息服务,(IIS)”,的详细信息,,,请单击“详细信息”按钮。如图。,64,,四、配置,IIS,1,、启动,IIS,：,如果你的电脑有,IIS,，则启动之。右键单击,“,我的电脑” 选择“管理”，弹出“计算机管理”界面，双击“服务和应用程序”，再双击“,Internet,信息服务” ，找到“网站,/,默认网站”，开始进行,IIS,设置。,,2,、建立虚拟目录：,右点“默认网站,/,新建,/,虚拟目录” ，在目录
36、名框内输入虚拟名字：例如：,88,（你的座号），单击“下一步”，输入你的网站的位置，也可以通过“浏览”找到自己建立的站点文件夹，直到“完成”，你的电脑就变成一台网站服务器了。,注意：一定要在默认网站下的一级目录建立，二级以下建立不好用。,,65,,四、配置,IIS,3,、本机测试：,双击“,88”,虚拟目录，在右面窗口找到,index.htm,文件，并右击之，选择“浏览”，这时就可以对动态数据库网站的各个网页进行数据的浏览、添加、修改、删除等操作测试。,66,,四、配置,IIS,4,、完善：,如果发现网站有需要修改完善的地方，就再次进入,frontpage,修改，并保存。,,5,、记住自己的,
37、IP,：,右点“默认站点,/,属性”，查看你所用电脑的“,IP,地址,”,是多少，如果写的是“全部未分配”，请点击下拉钮查看并选中之。,,例如：,192.168.41.200,,6,、局域网测试：,在其他计算机上测试你的网站，在,IE,地址栏中输入你的,IP,地址并回车。,,,,67,,四、配置,IIS,7,、完成：,如果能够正确出现你本机测试时见到的网页，各种功能正常，说明你的网站建设成功。,,注意事项一：,你的电脑一定要链接在互联网或局域网上。,,注意事项二：,你建立的数据库网站一定要在“默认网站”的一级目录下，否则可能无法对数据库进行读写操作。,,如果经过上述的配置后，在,win2000
38、,下应该就好用了。,68,,四、配置,IIS,8,、注意事项：,在,win2003,下还需要进一步配置,IIS,：右点“默认网站”，选择属性,/,主目录下的“配置”按钮，选择“启用父路径”选项才可以。,,69,,五、文件传输,FTP,1,、,FTP,：,文件传输协议,Transfer Protocol),是,Internet,传统的服务之一。,FTP,使用户能在两个联网的计算机之间传输文件，它是,Internet,传递文件最主要的方法。使用匿名,(Anonymous)FTP,， 用户可以免费获取,Internet,丰富的资源。,,,2,、使用,FTP:,在,IE,的地址栏内打入,FTP,服务器
39、的,IP,地址，将你的文件（夹）复制到里面就可以了。用此方法可以将个人网站上传到互联网服务器上。,70,,六、制作高质量网站需要的技术,要有较好的审美观；,,要有较好的文字功底；,,要有较好的色彩和图画水平；,,要有较好的社会学、心理学、人文学等知识；,,要有较好的计算机程序设计技术；,,要有较好的法律法规知识。,,71,,实验训练三：动态网站建立,1,、建站：,按照个人网站建设方法，建立一个“个人求职网站”,,2,、网站包括：,主页、个人简历、学习成绩单、兴趣、就业方向、特长、,意见反馈,共,7,个网页。,,3,、功能：,网页间有过度，动态文字，个性化图片，“,意见反馈”页是用人单位意见反馈
40、，要求使用动态数据库技术完成。,72,,第四部分：,实际技能训练,,理论测试,,技能测试,,综合测试,,课程设计,,技能鉴定,73,,网页制作,理论测试练习题,74,,1,、如何在,D,盘上以自己的“座号”为名建立一个文件夹？,,2,、怎样将你的计算机的,IP,修改成：,192.168.43.135,，默认网关和子网掩码是什么？,,3,、如果你计算机的,IP,目前是,192.168.43.135,，要想用,IE,浏览器访问本局域网内,IP,是：,192.168.41.210,的计算机，你的计算机应该重新设置？,回答下列问题：,75,,4,、如何将文件（或文件夹）复制到,IP,是：,192.16
41、8.41.210,的,FTP,服务器上去？,,5,、如何从,IP,是：,192.168.41.210,的,FTP,服务器上下载文件到你自己的计算机上？,,6,、如何在,D,盘上的一个文件夹里面利用,FrontPage,建立一个“个人站点”？,,7,、如何在已经建立好的个人站点上添加一个用“数据库界面向导,”,创建的“学生通信录”？,,8,、如何利用,IIS,（,Internet,服务管理器）将建立好的站点架设成站点服务器？,76,,9,、怎样测试自己的站点服务器网页能否打开？如果无法打开，可能是什么原因？怎么解决？,,10,、当你的站点服务器建好之后，如何在别人的计算机上看到你的网站？,,11
42、,、想在主页上加一个动态的滚动字幕怎么办？,,12,、如何将一个已有的图片插入到主页中？,,13,、如何将一个,FLASH,动画图片添加到主页中？,77,,14,、如何在自己的主页上做一个超级链接到老师,192.168.41.210,的主页上？,,15,、制作一个,Flash,动画，并插入到网页的首页中，动画演示的是一个皮球自由落下的过程以及你的座号和名字摆动的情景。,,78,,网页制作,技能测试练习题,79,,试写出完成下列实验的,,步骤和方法,,1,、在,D,盘上建立一个以你自己的“座号,+,姓名”为名字的文件夹。,,2,、使用,FrontPage 2003,的“网站模版”在建好的文件夹里
43、面建立一 个“个人网站”。,,3,、修改网站主页的标题为自己的“系,-,班级,-,座号,-,姓名”,,4,、在“收藏夹”子页下建立两个子页：“歌曲收藏夹”、“小品收藏夹”，并使两个子页的网页框架与父页相同。,,5,、修改两个子页的导航栏，使其能够完成返回主页和浏览同级子页的功能。,80,,,6,、设计一个从主页到“收藏夹”子页的“网页过渡”效果为“随机溶解”。,,7,、在主页上添加一个“动态滚动字幕”，上书“我学会做网页啦！”。,,8,、将主页的主题设置为“山花烂漫”、“收藏夹”子页的主题设置为“如梦花季”,,9,、利用画图工具用手工绘制一个“自画像”，然后插入到主页上面。,,10,、为网站添
44、加一个背景音乐，写出查找音乐文件的办法。,81,,网页制作,期末综合测试,82,,试卷样式,课程名称：网页制作,,作业内容：写出建立并修饰网站的步骤,,学生姓名：,,系部专业：,,学 号：,,内容：,,1,、写出在,D,盘上建立一个以你自己的“学号,+,姓名”为名字的文件夹的步骤。,,答：,,2,、,……,,3,、写出你在学习本课程后的感受，并提出建议和意见，以便我们今后更好的提高教学质量。,83,,校选课,《,网页制作,》,课程设计,（样）,课程设计名称：设计一个个性化网站,,设计人员信息：姓名、系别、班级、学号、序号,,指导教师：曲巨宝 副教授,,设计任务：利用本课程所学的知
45、识，设计一个个性化网站,,,并完成下列任务。,,一、写出利用,FrontPage,创建你个性化网站的步骤,;,,（提示：结合你写好的那个网站写、现场做）,,二、写出将该网站架设成服务器的方法,;,,（提示：结合你写好的那个网站写、现场做）,,三、写出你参加本次课程学习的感受，意见和建议（,50,字以上）,,四、设计一个网站；,,（附加上你设计好的网站）,84,,《,网页制作员,》,资格证书,,证书,：由劳动部职业技能鉴定中心统一核发的,《,全国计算机信息高新技术考试合格证书,》,,相应等级：,网页制作员、高级网页制作员,,网页制作员,：,1.1,知识要求 掌握因特网、站点相关知识；
46、 掌握一种中文平台的基本使用方法和知识； 掌握一种网页制作相关软件的基本使用知识；,1.2,技能要求 具有熟练的操作系统使用能力； 具有熟练的网页制作相关软件的使用能力；,,85,,Dreamweaver,第五部分：,简单应用,86,,1,、,开机：,进入,windows,（,2000/2003/XP,）,,2,、,进入：,用鼠标左键单击“,开始,”按钮，选择“,程序,” 下面的,“,Macromedia,”的,“,Macromedia,,Dreamweaver MX2004,”,,一、启动,Dreamweaver,87,,3,、,新建网页：,,,单击命令菜单栏中的“,文件,
47、”，选择“,新建,”，在屏幕的右面出现一个“,新建文档,”,界面：选择“,基本页,”下的,,“,html,”,，单击“,创建,”按钮，一个新网页就产生了。,,4,、插入图片查看器：,,单击菜单栏下的“,插入,/,媒体,/,图片查看器,”,， 出现“,保存,flash,元素,”对话框，输入文件名。记住文件的保存路径、位置。,图片查看器制作：,88,,5,、编辑数据组：,,,单击选中“,图片查看器,”控件，在右侧的,“标签,object,”,下的“,flash,元素,”选项卡下找到“,imageURLs,”,项，并单击“编辑数据组”按钮向图片查看器输入图片。,,6,、添加图片：,,单击菜单栏下的“
48、,插入,/,媒体,/,图片查看器,”,， 出现“,保存,flash,元素,”对话框，输入文件名。记住文件的保存路径、位置。,图片查看器制作：,89,,90,,7,、测试：,,,单击选中“,图片查看器,”控件，在右侧的,“标签,object,”,下的“,flash,元素,”选项卡下找到“,imageURLs,”,项，并单击“编辑数据组”按钮向图片查看器输入图片。,,8,、修饰属性：,,修改控件的播放属性。如自动播放功能：单击菜单栏下的“,slideAutoPlay”,为“,是”,。,,修改“,slideDelay”,可以改变时间； “,slideLoop”,可以改变是否循环显示图片。,图片查看器
49、制作：,91,,9,、插入网页：,,,如果想将这个“动画图片器”放入某个网页中，就先打开该网页文件，复制代码：,,展开 阅读全文
网页制作教程
