网站的创建与管理.ppt

Hunan Railway Professional Technology College,主讲人：湖南铁道职业技术学院陈承欢,网页设计与制作,教学课件,教学单元,3,：,网站的创建与管理,主要教学环节,五、知识讲解与操作示范,一、课程引导,二、明确知识技能目标,三、展示网页浏览效果,四、分析操作任务,六、课堂模仿实践,七、疑难解析,八、归纳总结,九、布置习题,（一）课程引导,认识了,Dreamweaver,8,的工作环境之后，接下来将要迈出制作网页的第一步了。无论是网页制作的新手，还是专业的网页设计师，都要从构建站点开始，理清网站结构。,（二）明确知识技能目标,（,1,）掌握,“,文件,”,面板,（,2,）掌握站点的创建,（,3,）掌握站点的管理,不锈钢软管,（三）展示网页浏览效果,本章所创建的实例网站“长沙世界之窗”的站点结构,效果如图所示。,（四）分析操作任务,（,1,）创建一个命名为,“,长沙世界之窗,”,的网站，该网站保存在本地硬盘的文件夹,“,旅游网站,”,中。,（,2,）在站点,“,长沙世界之窗,”,中创建文件夹,“,00,创建站点,”,，在文件夹,“,00,创建站点,”,创建子文件夹,“,image,”,、,“,music,”,。,（,3,）在文件夹,“,00,创建站点,”,中新建一个命名为,“,00.html,”,空白网页。,（五）,知识讲解与操作示范,3.1,网站的创建,3.1.1,认识文件面板,文件面板主要有三个方面的功能：,（,1,）管理本地站点；,（,2,）管理远程站点，包括文件上传、文件更新等；,（,3,）可以连接网络应用服务器，预览动态网页。,3.1.2,创建本地网站,使用,Dreamweaver,8,创建站点的向导创建第一个本地站点,“,长沙世界之窗,”,，具体操作步骤如下。,步骤,1,：在本地硬盘上建立一个用来存放站点的文件夹，,命名为,“,旅游网站,”,，该文件夹就是本地站点的根目录。,（五）知识讲解与操作示范,3.1,网站的创建,步骤,2,：选择菜单,【,站点,】【,新建站点,】,命令，打开,“,站点定义,”,向导。选择,“,基本,选项卡。,步骤,3,：在,“,你打算为您的站点起什么名字？,”,标签下面的文本框中填写要创建的网站名称：,“,长沙世界之窗,”,。,步骤,4,：单击,【,下一步,】,按钮，选择,“,否，我不想使用服务器技术,”,单选按钮。,步骤,5,：单击,【,下一步,】,按钮，选择,“,编辑我的计算机上的本地副本，完成后再上传到服务器（推荐）,”,单选按钮。,步骤,6,：在窗口下方，,“,您将把文件存储在计算机上的什么位置,”,用来选择保存网站文件的文件夹。,（五）知识讲解与操作示范,3.1,网站的创建,步骤,7,：单击,【,下一步,】,按钮。选择,“,无,”,，等到网站建成后再与,FTP,连接。,步骤8,：单击,【,下一步,】,按钮，站点定义对话框列出了刚才设置的主要内容，如果发现有错误，可以单击,“,上一步,”,按钮退回到合适的步骤进行更正，核对无误后，单击,【,完成,】,按钮，结束站点定义对话框的设置。,（五）知识讲解与操作示范（,2,）,3.2,管理站点,1,切换站点,在文件面板左边的下拉列表框中选中某个已创建的站点，例如单击选中,“,我的班级网站,”,，就可切换到对这个站点进行操作的状态。,2,编辑站点,如果要对站点进行编辑，可以在,“,管理站点,”,对话框中，选择要编辑的站点，然后用鼠标单击,“,管理站点,”,对话框中的,【,编辑,】,按钮，重新打开,“,站点定义,”,向导，根据需要一步一步修改站点的属性即可。,（五）知识讲解与操作示范（,2,）,3.2,管理站点,3,复制站点,对某一个站点进行复制操作。复制站点的功能省去了重复建立多个结构相同的站点的操作,4,删除站点,对某一个站点进行删除操作，网站的文件仍保存在硬盘 原来的位置上，并没有被删除。,5,导入站点,将选中的站点导出成一个,XML,文件，需要的时候还可以再次导入。,6,导出站点,把导出的保存站点设置的,XML,文件再次导入。,（五）知识讲解与操作示范（,3,）,3.3,管理网站中的文件和文件夹,1,创建文件夹和文件,在文件面板中站点根目录上单击鼠标右键，然后从弹出的快捷菜单中单击菜单项,【,新建文件夹,或,【,新建文件,】,，接着给新的文件夹或文件命名。,（,1,）在站点根目录中创建一个名为,“,00,创建站点,”,的文件夹。,（,2,）为刚才新建的文件夹,“,00,创建站点,”,创建两个子文件夹,“,image,”,和,“,music,”,。,（五）知识讲解与操作示范（,3,）,3.3,管理网站中的文件和文件夹,2,移动和复制文件,从,“,文件,”,面板的本地站点文件列表中，选中要移动或复制的文件夹或文件，如果要进行移动操作，则执行,【,编辑,】【,剪切,】,命令；如果要进行复制操作，则执行,【,编辑,】【,拷贝,】,命令；然后执行,【,编辑,】【,粘贴,】,命令，将文件夹或文件移动或复制到相应的文件夹中。,3,重命名文件夹或文件,先选中需要重命名的文件夹或文件，然后单击快捷菜单中的,【,编辑,】【,重命名,】,命令或者按,【F2】,快捷键，文件夹或文件的名称变为可编辑状态，重新输入新的名称，按,Enter,键确认即可。,（五）知识讲解与操作示范（,4,）,3.4,使用,“,资源面板,”,管理网站中的资源,3.4.1,使用,“,资源,”,面板,1,打开资源面板,使用,“,资源面板,”,之前必须先创建一个站点。然后选择菜单,【,窗口,】【,资源,】,命令，将会打开,“,资源面板,”,，资源面板与文件面板在同一个面板组中。,2,将资源加入收藏列表,在,“,资源面板,”,的上方，有两个单选按钮：,“,站点,”,或,“,收藏,”,。如果选择,“,站点,”,表示以资源列表方式显示站点中的所有资源；如果选择,“,收藏,”,，则以,“,收藏,”,资源列表方法进行显示。,（五）知识讲解与操作示范（,4,）,3.4,使用“资源面板”管理网站中的资源,3.4.2,在页面中使用资源,1,向文档中添加资源,（,1,）将光标定位于想要加入资源的位置。,（,2,）打开,“,资源面板,”,，选择资源的种类图标按钮。,（,3,）选择,“,站点,”,或者,“,收藏,”,单选按钮，然后在列表中选择所要的资源。,（,4,）从,“,资源面板,”,中拖动资源到,“,设计,”,视图中或者单击,“,资源面板左下角的按钮，这样资源就被插入到文档中。,2,改变文档中所选文字的颜色,（,1,）选中文档中需要改变颜色的文字。,（,2,）在,“,资源面板,”,中单击颜色选项图标。,（,3,）选择颜色列表中的颜色，然后单击按钮。,3.4.3,选择和编辑资源,1,选择一个或多个资源,可以单击选择一个资源，也可以采用下列方法选择多个资源。,（,1,）按住,【Shift】,键，然后单击其他资源，选择多个连接的资源。,（,2,）按住,【Ctrl】,键，然后依次单击逐个选择多个资源。,2,编辑一个资源,（,1,）打开要编辑的资源,（,2,）对打开的资源进行编辑。,（,3,）编辑完成，进行保存或单击,“,确定,”按钮。,（五）知识讲解与操作示范（,4,）,3.4,使用,“,资源面板,”,管理网站中的资源,3.5,网页文档的基本操作,接着学会创建网页文档、打开网页、关闭网页，完成本章的第,3,项操作任务：创建空白网页,“,00.html,”,。,3.5.1,创建网页文档,1,新建网页文档,新建网页文档的方法主要有以下几种。,方法一：启动,Dreamweaver 8,后，会出现一个功能选择界面，它包括,“,打开最近项目,”,、,“,创建新项目,”,、,“,从范例创建,”,、,“,扩展,”,四个可选项，在该界面单击,【HTML】,便可以直接创建一个,HTML,网页文档。,方法二：单击,Dreamweaver 8,主窗口的菜单,【,文件,】【,新建,】,，打开,“,新建文档,”,对,话框，在该对话框中，,（五）知识讲解与操作示范（,5,）,3.5,网页文档的基本操作,2,保存网页文档,保存网页文档的方法主要有：,方法一：单击,“,标准工具栏,”,中的,【,保存,】,按钮或者,【,全部保存,】,按钮。,方法二：单击,Dreamweaver 8,主窗口的菜单,【,文件,】【,保存,】,或者,【,保存全部,】,。,保存新建的网页文档，该网页文档的保存位置为,“,00,创建站点,”,文件夹，名称为,“,00.html,”,。,（五）知识讲解与操作示范（,5,）,（五）知识讲解与操作示范（,5,）,3.5网页文档的基本操作,3.5.2,打开网页文档,1,打开网页文档,2,打开最近的文档,3.5.3,关闭网页文档,单击,Dreamweaver,8,主窗口的菜单,【,文件,】【,关闭,】,或者,【,全部关闭,】,即可。如果页面尚未保存，则会弹出一个对话框，确认是否保存。,（六）课堂实践,1,操作任务,利用本章所学习的知识，完成以下操作：,（,1,）创建一个命名为,“,课堂实践,”,的静态网站，该网站的所有文件存储在本机上,E,盘的,“,ClassroomPractise,”,文件夹中。,（,2,）在,“,文件面板,”,的站点根目录下创建一个文件夹,“,00,创建站点,”,。,（,3,）在文件夹,00,创建站点,”,中创建三个子文件夹,“,image,”,、,“,music,”,和,“,text,”,。,（,4,）在文件夹,“,00,创建站点,”,中创建一个命名为,“,00.html,”,的网页文档。,（,5,）将所需的图像文件和音乐文件分别复制到,“,image,”,和,“,music,”,文件夹中。,（六）课堂实践,2,效果展示,所创建的,“,课堂实践,”,站点，以及该站点中的文件夹和文件,。,图,3-18,课堂实践网站的站点结构,3,制作要点提示,（,1,）文件夹,“,ClassroomPractise,”,必须在,Windows,操作系统的资源管理器中创建。,（,2,）其他子文件夹直接利用,Dreamweaver,8,的,“,文件,”,面板创建。,（,3,）拷贝图像文件和音乐文件也是在,Windows,操作系统的资源管理器中完成。,（六）课堂实践,(,七,),课外拓展实践,1,利用,“,站点定义,”,对话框中的,“,高级,”,选项卡中的,“,本地信息,”,创建一个学校网站，该网站命名为,“,湖铁职院学院网站,”,，保存在文件夹,“,MyCollege,”,中。,2,在所创建的站点根目录下创建一个文件夹,“,00,创建站点,”,以及多个子文件夹。,（八）归纳总结,本章重点学习了如何创建站点和管理站点，同时也分析了网页文档的基本操作和“资源”面板、“文件”面板的使用方法。这些操作都是最基本的操作，熟练掌握将会有助于以后网页的制作。,