网 页 制 作 教 程.docx

1、网 页 制 作 教 程网 页 制 作 教 程(未完)1.网页基本概念什么是网页（Web Page）？ 网页就是一种以超文本和超媒体形式显示信息的载体文件。其中的重要概念就是超级链接，它使网页的信息量更大，阅读起来更加方便。 什么是网站（Web Site）？ 网站就是由多个信息相关的网页构成，网页之间通过超级链接互相连接在一起的网络组织，又称为站点。 2.网页制作的相关术语 国际互联网因特网（Internet） 统一资源定位器（URL） 万维网（WWW） 超文本传输协议（HTTP） 浏览器 超文本标记语言（HTML） 主页 3.Internet简介 Internet是遍布全球的各种网络系统（如：

2、局域网、数据通信网、公用电话交换网等）组织在一起的世界性计算机网络系统，它是通过统一的网络协议TCP/IP协议连接在一起所组成的。 Internet的功能： 电子邮件、文件传输（FTP）、远程登录（Telnet）、网上查询（IE、Netscape、Gopher等浏览器）和网上交流（BBS、网络新闻组USENET、QQ等）。4.URL地址 URL（Uniform Resource Locater）即统一资源定位器，俗称“网址”。 Internet中的各种资源实际上分散在各地的计算机主机中，定位器（Locater）的作用就是要指出这些资源的所在位置。URL就是一个可以带领用户到所要资源的所在位置，

3、并通过适当的方式取得该资源的工具。 例如下面的URL地址： 其含义是该URL地址使用的通讯协议为HTTP协议，要查找的主机是，在该主机的news文件夹中的china文件夹里，有一个名为index.htm的文件。 5.WWW简介 万维网也就是World Wide Web，又称WWW（3W），它是Internet世界最为重要的成员之一。 WWW是一个基于超文本（Hypertext）和超媒体（Hypermedia）方式的信息检索服务工具。 超文本：由文本组成，可以与其它文件相关联。 超媒体：可以与多种形式的数据文件相关联。6.HTTP协议 为了能够实现网络资源的网上传输和共享，就必须制定一个客户端与

4、服务器端双方在交流信息时都能够理解的统一的“共同语言”，这就是网络传输协议。它要求每个使用者必须遵循相同的标准，以保证信息和数据的传输畅通无阻。 HTTP协议（Hypertext Transfer Protocol，超文本传输协议）就是实现这一功能的WWW中的主要协议，允许数据以任意的类型（包括多媒体文件）在网络中通信，并支持超文本和超媒体的形式。 7.网页浏览器 浏览器（Browser）：阅读浏览网页信息的应用程序。它是一个翻译器，它将各种控制字符翻译成合适的屏幕显示方式，从而得到人们最后看到的网页。 浏览器有很多种，如：Microsoft Internet Explorer（IE）、Net

5、scape Navigator（网景）、Tencent Traveler（腾讯TT）等。 由于各个浏览器对同一控制字符的解释方式不完全相同，所以即使是同一个网页，在不同浏览器下的显示也可能有所不同。8.HTML简介 HTML语言（HyperText Markup Language，超文本标记语言）是一种用于网页制作的排版语言，是用来表示网上信息的符号标记语言。 HTML并非是一种编程语言，我们只需要用HTML给文档添加标记，并保存成扩展名为.Html或.Htm的文件（即网页的源文件），发布到网上即可。 浏览器可以识别用HTML编写的文件，并将这些HTML符号标记翻译成人们可以识别的信息，就是网

6、页。 9.HTML的编辑环境 HTML是一种纯文本文件，我们可以用任何文本编辑器（包括记事本、写字板、Word、WPS）来编辑和创建它，保存时文件扩展名要改成.htm或.html。 在网页上点击鼠标右键，选择菜单中的 “ 查看源文件 ” ，就可以通过记事本看到网页的HTML内容。HTML的常用标记 HTML文件开始和结束的标记 HTML文件头标记，可以省略 我的个人主页 网页的标题，显示在浏览器窗口的标题栏，可以单独出现 HTML文件主体标记，定义了网页上显示的主要内容与显示格式 *你好！欢迎光临本站* 网页标题概括了网页内容，能迅速了解网页的大意，加入收藏夹时和使用搜索引擎时显示的结果都是网

7、页的标题。HTML的构成 一个HTML文件是由标记组成的，不同的标记代表不同的元素和效果。 大多数标记是成对出现的，名称多数是其英文缩写。 如：表示一条水平的分割线，表示一个段落（Paragraph），表示一个图片（Image），表示设置字体。 标记的格式 标记的格式 标记的基本格式为： 受标记影响的内容 其中：（1）标记必须用“”围住，否则认为是普通文本，表示结束标记。标记字母不区分大小写（2）对一段内容可以用多个标记来共同作用，产生一定的效果。此时，各个标记间的顺序也是任意的，但是不能交叉使用。（3）根据需要可以只用该标记的几个属性，也可以不用属性，在使用时属性之间没有顺序。不是所有的标记

8、都有属性和结束标记，如单标记表示换行。 标记的使用:例如： 这是6号字，隶书，红色 ；：这个标记是用来插入图片的，其中的“”代表的是图片的URL地址。例如：该标记的意思是在网页中插入图片pic.gif，该图片存放的位置在站点文件夹根目录下的images目录下。二、网页构成的基本要素 在制作网站之前要先了解网页的基本要素： 页面标题（Title） 网站标志（Logo） 页面尺寸、整体造型 导航栏（主菜单） 主体内容、超级链接 版权说明 三、建站的基本流程 第一步对站点进行规划。包括：网站主题、网站名称、网站标志、网站色彩、页面尺寸。 第二步规划和创建站点的基本结构。建立站点的各类文件夹，并在各个

9、文件夹中合理的安置文档。 第三步具体的网页制作过程。包括：制作Logo、创建导航栏、制作超级链接、设计网页的框架和版式、添加网页内容。 第四步上传站点到远程服务器。发布与推广网站，包括：申请空间、上传网页、推广网站。 四、Dreamweaver 8简介 Dreamweaver是一种较好的所见即所得的网页编辑工具，它对网页有很强的控制能力，可以直观方便的设计网页。 主要优点：1：使用方便，易学易用，既可以使用可视化的编辑器又可以使用HTML编辑器设计网页。2，提供了强大的设计工具和模板，不用编写代码就可以快速的创建各种极具动态HTML特性的网页，如动画和分层等。3，兼容性好，适用于各种平台和浏览

10、器。4，产生的HTML代码精简高效。 Dreamweaver 8功能简介 Dreamweaver 8 的工作界面 站点的创建和管理 文档的基本操作 基本网页制作（插入对象、设置格式等） 网页的布局技术（表格、层、框架） 表单、模板和库项目的使用 行为和时间轴（动态网页技术）初识Dreamweaver 8启动： “开始”菜单所有程序Macromedia选择Macromedia Dreamweaver 8，工作区布局设置： 工作区布局选择：第一次启动Dreamweaver 8会显示“工作区设置”对话框，请选择“设计器”方式 ；以后再更改布局：“窗口工作区布局”使用起始页 ；打开最近使用过的网页 ；

11、创建新的网页 ；显示与隐藏起始页：“编辑首选参数” Dreamweaver 8的工作界面 基本组成： 由标题栏、菜单栏、工具栏、编辑区、状态栏、插入栏、属性面板和面板组等组成。 插入栏 标准工具栏 文档工具栏 状态栏 面板的展开与折叠、打开与关闭站点的相关概念 站点：一个网站所有文档的集合。 一个设计良好的网站通常具有科学的结构，用不同的文件夹分门别类的保存不同类型的文件，便于管理和更新。 Internet服务器：它只是一个逻辑名称，就是用于提供Internet服务（包括WWW、FTP、E-MAIL等）的计算机。主要用于存储我们所浏览的Web站点的文件。 远程站点：指存储于Internet服务

12、器上的站点文件。 本地站点：在本地计算机的磁盘上构建的站点文件。站点的相关概念 静态站点：网页的内容在建立网页时确定，以后不能根据浏览者的意愿改变。 动态站点：网页的内容是由程序自动生成的，随着浏览者的意愿改变，例如用户注册页面，留言板等。创建本地站点的必要性及方法1. 在某个驱动器的根目录下新建一个文件夹, 用英文命名，作为站点文件夹，用来存放本地站点的相关文件。2. 执行“站点新建站点”，在“站点定义”对话框中进行选择。 3. 执行“窗口站点”或“文件站点”，或按F8快捷键，打开“文件”面板，在面板中管理站点文件。 管理站点：在站点面板中，单击下拉列表中的“编辑站点”，或“站点编辑站点”，

13、可以进行以下操作： 1. 编辑站点2. 删除站点3. 复制站点 4. 创建文件和文件夹5. 删除文件和文件夹：从磁盘上真正删除6. 移动和复制文件和文件夹创建站点内容：创建站点目录结构：站点中的文件需要分类分层管理，例如图片存放在images文件夹中，声音文件存放在music文件夹中等。 创建首页文件（主页）：首页文件的名称通常为index.htm、index.html、default.htm或default.html，这个名称不能随便起，由你所申请空间的远程服务器决定。 网页文档的基本操作：新建网页 ：保存网页 ；关闭、打开网页 ；重命名文件与文件夹 ；移动或复制文件与文件夹 ；删除文件与文

14、件夹。网页制作时需要注意的要点；1，在网页中若插入中文名的网页元素文件，浏览时出错的话，可在【代码视图】中作相应的修改，用合适的中文替换乱码。一般最好不要使用中文命名的文件，包括站点文件夹名字，文件名以及图片、视频和音频的文件名，都不要使用中文命名。 2，初次在本地计算机上制作网页时，就先规划好存放文件的文件夹，建立好本地站点，以后每次制作网页时应检查本地站点是否正确。3、把网页中用到的全部素材复制到规划好的文件夹内。制作好的网页也要放在本地站点中。 4、每次新建一个网页时，应该先设置好网页的页面属性，然后将该网页保存在本地站点中，以后在该网页中插入的网页元素都能以相对路径插入。网页中的图像文件、声音文件、动画文件以及超级链接都要以相对路径的方式来处理。 5、每个网站至少要有一个默认主页，一般主页可以使用index.html为文件名。