第2章教育网站站点创建和管理
《第2章教育网站站点创建和管理》由会员分享，可在线阅读，更多相关《第2章教育网站站点创建和管理（60页珍藏版）》请在文档大全上搜索。
1、为了便于对制作中的网站进行组织和管理，在使用网站制作软件Dreamweaver CS5制作单个页面之前，必须首先创建一个站点，用来存储所有Web网站文件和文档的地方，通过对站点的设置，可以方便地实现对网页统一的管理、在服务器上的远程文件管理及文件传输。2.1.1 任务描述2.1.2 相关知识2.1.3 任务实施2.1.4 任务评价2.1.5 任务小结为了便于对制作中的网站进行组织和管理，在使用网站制作软件Dreamweaver CS5制作单个页面之前，必须首先创建一个站点，用来存储所有Web网站文件和文档的地方，通过对站点的设置，可以方便地实现对网页统一的管理、在服务器上的远程文件管理及文件传
2、输。在网站开发过程中，网站中所有文件、文件夹、图片、CSS类的命名规范，应做到见名知意、容易理解。现将网站开发中常用的命名规则总结如下：（1）网站文件夹命名规则在网站中，与文件紧密相关的另一个部分就是路径，在网站开发中严禁将网站资源统一放在网站根目录下，这样会对后期网站编辑和维护中产生不便。网站资源应该按照事先的规划，按照不同目录进行分类存放。一、网站开发常用的命名规则（1）网站文件夹命名规则表2-1 网站文件夹常用名称一、网站开发常用的命名规则名称说明images(image或img)存放图像文件flash存放flash文件themes存放主题文件style（css）存放CSS样式表文件js
3、存放JavaScript脚本文件video存放视频文件sound存放音频文件web（page）存放网页文件resource存放资料文件（2）网站文件命名规则网页文件命名规则：1.所有的文件名一律使用英文小写；2.不要使用中文命名；3.不要在文件名中加入空格；4.避免在文件名字使用特殊符号，如“&”、“#”或者“？”。一、网站开发常用的命名规则表2-2 CSS样式文件常用名称一、网站开发常用的命名规则名称说明index.css主页CSS样式表文件login.css登录CSS样式表文件pages.css页面CSS样式表文件layout.css布局、版面CSS样式表文件font.css文字C
4、SS样式表文件master.css主要CSS样式表文件form.css表单CSS样式表文件menu.css菜单CSS样式表文件nav.css导航CSS样式表文件search.css搜索CSS样式表文件themes.css主题CSS样式表文件Dreamweaver CS5的工作界面主要由标题栏、菜单栏、“插入”工具栏、“文档”工具栏、“标准”工具栏、“文档”窗口、“属性”面板、“文件”面板组成。如图2-1所示。二、认识Dreamweaver CS5的工作界面（1）标题栏标题栏显示网页的标题和网页文档的存储位置。（2）菜单栏Dreamweaver CS5 的菜单栏包含10类菜单：文件、编辑、查看、
5、插入、修改、格式、命令、站点、窗口和帮助，如图2-2所示。二、认识Dreamweaver CS5的工作界面（2）菜单栏文件：用来管理文件，包括创建和保存文件、导入与导出文件、预览和打印文件等。编辑：用来编辑文本，包括撤销与重做、复制与粘贴、查找与替换等。查看：用来查看对象，包括代码的查看、网格线与标尺显示、面板的隐藏和工具栏的显示等。插入：用来插入网页元素，包括插入图像、多媒体、层、框架、表格、表单、电子邮件链接、日期、特殊字符和标签等。修改：用来实现对页面元素修改的功能，包括页面属性、快速标签编辑器、链接、表格、框架、导航条、排列顺序、转换、末班、库和时间轴等。格式：用来对文本进行操作，包括
6、字体、大小、颜色、CSS样式、段落格式、缩进、凸出、列表、对齐和检查拼写等。二、认识Dreamweaver CS5的工作界面（2）菜单栏命令：收集了所有的附加命令项，包括播放录制命令、编辑命令列表、扩展管理、套用源格式、清理XHTML/Word生成的HTML、创建网站相册、格式化表格和表格排序。站点：用于创建于管理站点，包括管理站点、新建站点、获取、取出、上传、显示取出者和改变站点范围的链接等。窗口：用于打开与切换所有的面板和窗口、包括插入栏、属性面板、站点窗口和CSS样式面板等。帮助：内含Dreamweaver帮助、联机注册、Dreamweaver支持中心和关于Dreamweaver等。二、
7、认识Dreamweaver CS5的工作界面（3）“插入”工具栏Dreamweaver CS5 “插入”工具栏包含用于创建和插入对象的按钮。通过“插入”工具栏可以在网页中快速插入多种网页元素，如图像、动画、表格、Div标签、超级链接、表单和表单控件。二、认识Dreamweaver CS5的工作界面（3）“插入”工具栏常用：创建和插入最常用的对象，例如图像和表格。 布局：插入表格、表格元素、div标签、框架和Spry Widget。我们还可以选择表格的两种视图：标准（默认）表格和扩展表格。 表单：创建表单和插入表单元素（包括Spry验证Widget）。 数据：插入Spry数据对象和其它动态元素，
8、例如记录集、重复区域以及插入记录表单和更新记录表单。 Spry：包含一些用于构建Spry页面的按钮，包括Spry数据对象和Widget。 jQuery：包含使用jQuery移动的构建站点的按钮。 InContext Editing：包含供生成InContext编辑页面的按钮，包括用于可编辑区域、重复区域和管理CSS类的按钮。 二、认识Dreamweaver CS5的工作界面（3）“插入”工具栏文本：用于插入各种文本格式和列表格式的标签，如b、em、p、h1和ul。 收藏夹：用于将“插入”面板中最常用的按钮分组和组织到某一公共位置。 服务器代码：仅适用于使用特定服务器语言的页面，这些服务器语言包
9、括ASP、CFML Basic、CFML Flow、CFML Advanced和PHP。这些类别中的每一个都提供了服务器代码对象，您可以将这些对象插入“代码”视图中。 二、认识Dreamweaver CS5的工作界面（4）“文档”工具栏“文档”工具栏中包含用于切换文档窗口视图的“代码”、“拆分”、“设计”、“实时视图”按钮、各种查看选项和一些常用操作。如图2-4所示。二、认识Dreamweaver CS5的工作界面（5）“标准”工具栏点击“查看”菜单，选择“工具栏”命令，在弹出的子菜单中选择“标准”项，即可显示标准工具栏。“标准”工具栏中包含网页文档的基本操作按钮，如新建、打开、保存、剪切、复
10、制、黏贴等按钮，如图2-5所示。二、认识Dreamweaver CS5的工作界面（6）文档窗口“文档”窗口也成为文档编辑区，该窗口所显示的内容可以是代码、网页，或者两者的共同体。在【设计视图】中，“文档”窗口中显示的网页近似于浏览器中显示的效果。如图2-1所示。二、认识Dreamweaver CS5的工作界面（7）“属性”面板“属性”面板位于文档窗口的下方，用来设置页面上正被编辑内容的属性，可以通过执行【窗口】|【属性】命令或者按“Ctrl+F3”组合键打开或关闭“属性”面板。如图2-7所示。二、认识Dreamweaver CS5的工作界面（8）面板组Dreamweaver CS5包括多个面板
11、，这些面板都有不同的功能，将它们叠加在一起便形成了面板组。如图2-8所示。二、认识Dreamweaver CS5的工作界面（9）“文件”面板网站是多个网页、图像、动画、程序等文件有机联系的整体，要有效地管理这些文件及其联系，需要一个有效地工具，“文件”面板便是这样的工具。点击【窗口】| 【文】命令，可以打开“文件”面板。如图2-10所示。二、认识Dreamweaver CS5的工作界面（10）标签选择器在文档窗口底部的状态栏中，显示环绕当前选定内容标签的层次结构，单击该层次结构中的任何标签，可以选择该标签及网页中对应的内容。在标签选择器栏还可以设置网页的显示比例。如图2-11所示。二、认识Dr
