网页制作教程

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