1.3 创建和保存网页

本节将介绍使用Adobe Dreamweaver CC创建、保存、打开以及关闭网页文档的基本操作方法。

实战014 创建网页文档

实例位置：无

素材位置：无

视频位置：光盘\视频\第1章\实战014.mp4

实例介绍

要设计出一个网页，首先需要在Adobe Dreamweaver CC中创建空白网页文档。

操作步骤

STEP 01 在菜单栏中，单击“文件”|“新建”命令，如图1-71所示。

图1-71 单击“新建”命令

STEP 02 弹出“新建文档”对话框，在“空白页”的“页面类型”列表框中选择“HTML”选项，在“布局”列表框中选择“无”选项，如图1-72所示。

图1-72 设置相应选项

知识扩展

PowerPoint是一个功能强大的演示文稿制作软件，该软件能够协助用户独自或联机创建永恒的视觉效果。它增强了多媒体支持功能，利用PowerPoint制作的文稿，可以通过不同的方式播放，也可将演示文稿打印成一页一页的幻灯片，使用幻灯片机或投影仪播放。

HTML（Hypertext Markup Language）是用于描述网页文件的一种标记语言。HTML是一种规范和标准，它通过标记符号来标记要显示的网页中的各个部分。网页本身是一种文本文件，通过在文本文件中添加标记符，可以通知浏览器如何显示其中的内容（如文字如何处理、画面如何安排以及图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符的解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。

一个网页对应于一个HTML文件，HTML文件以.htm或.html为扩展名。可以使用任何能够生成Txt类型源文件的文本编辑来产生HTML文档。标准的HTML文档一般包括开头与结尾标志以及HTML的头部与实体两大部分。有3个双标记符用于页面整体结构的确认。图1-73所示为一般HTML的基本组成情况。

图1-73 HTML的基本组成情况

这个文档的第一个Tag是<html>，这个Tag告诉浏览器这是HTML文档的头。文档的最后一个Tag是</html>，表示HTML文档到此结束。

在<head>和</head>之间的内容，是Head信息。Head信息是不显示出来的，在浏览器里看不到。但是这并不表示这些信息没有用处。比如可以在Head信息里加上一些关键词，有助于搜索引擎能够搜索到这个网页。

在<title>和</title>之间的内容，是这个文档的标题。可以在浏览器最顶端的标题栏看到这个标题。

在<body>和</body>之间的信息，是文档的正文部分。在<b>和</b>之间的文字，用粗体表示。<b>就是bold的意思。

HTML文档看上去和一般文本类似，但是它比一般文本多了Tag，比如<html>、<b>等，通过这些Tag，可以告诉浏览器如何显示这个文件。

HTML之所以称为超文本标记语言，是因为文本中包含了“超级链接”点。所谓超级链接，就是一种URL指标，通过启动它，可使浏览器方便地获取新的网页，这也是HTML获得广泛应用的最重要的原因之一。由此可见，网页的本质就是HTML，通过结合使用其他的Web技术（如脚本语言、CGI以及组件等），可以创造出功能强大的网页。因此，HTML是Web编程的基础，也就是说万维网是建立在超文本基础之上的。

需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。

STEP 03 设置完成后，单击右下角的“创建”按钮，如图1-74所示。

图1-74 单击“新建”按钮

STEP 04 执行操作后，即可创建一幅空白的网页文档，如图1-75所示。

图1-75 创建空白的网页文档

实战015 保存网页文档

实例位置：光盘\效果\第1章\实战015.html

素材位置：无

视频位置：光盘\视频\第1章\实战015.mp4

实例介绍

当用户完成网页文档的编辑后，必须马上保存网页文档，防止文件丢失。

操作步骤

STEP 01 在菜单栏中，单击“文件”|“另存为”命令，如图1-76所示。

图1-76 单击“另存为”命令

STEP 02 弹出“另存为”对话框，设置相应的保存位置和文件名，单击“保存”按钮即可，如图1-77所示。

图1-77“另存为”对话框

知识扩展

不同的网页文件，它的后缀也不相同，一般包含CGI、ASP、PHP、JSP和VRML等。通常我们看到的网页都是以htm或html后缀结尾的文件，俗称HTML文件，下面对各种类型的网页文件进行简单的讲解。

CGI:CGI是一种编程标准，它规定了Web服务器用其他可执行程序的接口协议标准。CGI程序通过读取使用者的输入请求，从而产生HTML网页。它可以用任何程序设计语言编写。

ASP:ASP是一种应用程序环境，主要用于网络数据库的查询和管理。其工作原理是当浏览者发出浏览请求的时候，服务器会自动将ASP的程序代码解释为标准的HTML格式的网页内容，再发送到浏览者的浏览器上显示出来，也可以将ASP理解为一种特殊的CGI。

PHP:PHP是一种HTML内嵌式的语言，PHP与ASP有点相似，它们都是一种在服务器端执行嵌入HTML文档的脚本语言，风格类似于C语言。PHP独特的语法混合了C、Java、Perl以及PHP自创的语法。它可以比CGI或Perl更快速地执行动态网页，PHP在大多数Unix平台GUN/Linux和微软Windows平台上均可运行。

JSP:JSP是一种动态网页技术标准，JSP与ASP非常相似。不同之处在于ASP的编程语言是VBScript之类的脚本语言，而JSP使用的是Java语言。此外，ASP和JSP还有一个更为本质的区别：两种语言引擎用完全不同的方式处理页面中嵌入的程序代码。在ASP下，VBScript代码被ASP引擎解释执行；在JSP下，代码被翻译成Servlet并由Java虚拟机执行。

VRML:VRML是虚拟实境描述模型语言，是描述三维的物体及其结构的网页格式。利用经典的三维动画制作软件3ds Max，可以简单而快速地制作出VRML。

实战016 打开网页文档

实例位置：无

素材位置：光盘\素材\第1章\实战016.html

视频位置：光盘\视频\第1章\实战016.mp4

实例介绍

当用户完成网页文档的编辑后，必须马上保存网页文档，防止文件丢失。

操作步骤

STEP 01 在菜单栏中，单击“文件”|“打开”命令，如图1-78所示。

图1-78 单击“打开”命令

STEP 02 弹出“打开”对话框，选择相应的网页文档，如图1-79所示。

图1-79 选择相应的网页文档

STEP 03 在“打开”对话框的右下角，单击“打开”按钮，如图1-80所示。

图1-80 单击“打开”按钮

STEP 04 执行操作后，即可打开网页文档，如图1-81所示。

图1-81 打开网页文档

知识扩展

动态网页的主要特点简要归纳如下。

动态网页以数据库技术为基础，可以大大降低网站维护的工作量。

采用动态网页技术的网站可以实现更多的功能，如用户注册、用户登录、在线调查、用户管理以及订单管理等。

动态网页实际上并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的网页。

动态网页中的？号对搜索引擎检索存在一定的问题，搜索引擎一般不可能从一个网站的数据库中访问全部网页，或者出于技术方面的考虑，搜索之中不去获取网址中？号后面的内容，因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。

实战017 关闭网页文档

实例位置：无

素材位置：无

视频位置：光盘\视频\第1章\实战017.mp4

实例介绍

当用户完成网页文档的编辑后，必须马上保存网页文档，防止文件丢失。

操作步骤

STEP 01 完成网页文档的编辑后，单击“文件”|“关闭”命令，如图1-82所示。

图1-82 单击“关闭”命令

STEP 02 执行操作后，即可关闭网页文档，如图1-8 3所示。

图1-83 关闭网页文档

知识扩展

程序是否在服务器端运行，是区分动态网页和静态网页的重要标志。在服务器端运行的程序、网页和组件，属于动态网页，它们会随不同客户以及不同时间，返回不同的网页，如ASP、PHP、JSP、ASPnet以及CGI等。运行于客户端的程序、网页、插件和组件，属于静态网页，例如html页、Flash、JavaScript以及VBScript等，它们是永远不变的。

静态网页和动态网页各有特点，网站采用动态网页还是静态网页主要取决于网站的功能需求和网站内容的多少，如果网站功能比较简单，内容更新量不是很大，采用纯静态网页的方式会更简单，反之一般要采用动态网页技术来实现。

静态网页是网站建设的基础，静态网页和动态网页之间也并不矛盾，为了网站适应搜索引擎检索的需要，即使采用动态网站技术，也可以将网页内容转化为静态网页发布。动态网站也可以采用静动结合的原则，适合采用动态网页的地方用动态网页，如果必要使用静态网页，则可以考虑用静态网页的方法来实现，在同一个网站上，动态网页内容和静态网页内容同时存在也是很常见的事情。

上一章目录下一章