第1章  网页制作基础
在学习制作一个网页之前，首先应了解一些网页与网站的基本知识，了解常用的网页制作工具，熟悉网站开发的工作流程。本章主要介绍与网页制作相关的一些基本知识及Web常用术语、网页制作工具、网页图像、动画制作工具与网站开发的工作流程。
任务1  认识网页基础知识
WWW（World Wide Web），中文称为万维网，是Internet中最为精彩的部分。为了与传统的网络区别，人们将WWW简称为Web，或称为3W，Web上具有共同的主题、性质相关的一组资源就是Web站点。Web直译为“网”，Web的含义是指通过超链接将各种文档组合在一起，形成一个大规模的信息集合。
知识点：网页的基础知识
1．Web网页的特点
浏览Web时所看到的文件称为Web页，又称为网页。网页可以将不同类型的信息（例如文本
、图像、声音和视频等）组合在一个文档中。由于这些文档是用超文本标记语言HTML表示的，其文件扩展名为.htm或.html，因此又称为HTML文档或超文本。超文本可以给浏览者带来视觉和听觉的享受，所以Web技术又称为超媒体技术。
一个Web由一个或多个Web页组成，这些Web页相互连接在一起，存放在WWW服务器中，以供浏览者访问。浏览者通过Web页可以进行跳跃式的查询与浏览，可以在世界各地的网络计算机之间自由地、高效率地选择和收集各种各样的信息，而不必知道所浏览的信息来自于哪台计算机。Web所包含的是双向信息，一方面浏览者可以通过浏览器浏览他人的信息，另一方面浏览者也可以通过Web服务器建立自己的网站和发布自己的信息。
2．Web网页常用术语
当用户制作网页时，了解与熟悉Web站点的有关术语对网页设计是十分重要的，如HTML、URL、网页、主页等术语。
1）HTML
Web页是用超文本标记语言HTML（Hyper Text Markup Language）表示的。HTML是一种
规范，一种标准。HTML通过标记符（Tag）标记网页的各个组成部分，通过在网页中添加标记符，指示浏览器如何显示网页内容。浏览器按顺序阅读网页文件（HTML文件）。以IE浏览器为例，在浏览器窗口的菜单中选择“查看”|“源文件”命令后，系统将自动启动记事本或写字板，并显示该网页的HTML源文件，如图1-1所示。
图1-1  查看网页源文件的选项操作和在记事本中查看网页源文件（HTML文件）
2）URL
URL是Uniform Resource Locator的缩写，其含义是统一资源定位器。URL的表示可以是绝
对的，也可以是相对的。绝对的URL将完整地给出协议种类（例如HTTP、FTP）、服务器的主机域名、路径和网页文件名。如图1-2所示是URL为http：//www.163/ index.html的网页。其中，http表示使用的是超文本传输协议，www.163表示主机的域名，index.html表示网页文件名。
3）网页
网页是使用HTML语言所写的文本文件，网页里可以包含文字、表格、图像、链接、声音和视频等。每个网页都是磁盘上的一个文件，可以单独浏览。
4）主页
主页（Home Page）也称为首页，它是一个单独的网页，可以存放各种信息；它又是特殊的网页，是浏览者浏览一个网站的起点。
3．Web网页的基本元素
Web网页是一个纯文本文件，通过HTML、CSS等脚本语言对页面元素进行标识，然后由
浏览器自动生成的页面。构建网页的基本元素有文本、图像、超链接、导航栏、表格、表单、多媒体及特殊效果等。

图1-2  浏览器与主页
1）文本
网页的主体一般以文本为主。在制作网页时，可以根据需要设置文本的字体、字号、颜以及所需要的其他格式。
2）图像
图像可以用作标题、网站标志（Logo）、网页背景、链接按钮、导航栏、网页主图等。图像使用最多的文件格式是JPEG和GIF格式。
3）超链接
超链接是从一个网页指向另一个目的端的链接，该链接既可以指向本地网站的另一个网页，也可以指向世界各地的其他网页。
4）导航栏
导航栏能使浏览者方便地返回主页或继续下一页的访问。导航栏可以是按钮、文本或图像。
5）表格
网页中的表格是一种用于控制网页页面布局的有效方法。
6）表单
表单通常用于收集信息或实现一些交互式的效果。表单的主要功能是接收浏览者在浏览器端的输入信息，然后将这些信息发送到浏览者设置的目的端。
7）多媒体及特殊效果
网页还包含有声音、动画、视频等多媒体元素，以及悬停按钮、Java控件、ActiveX控件等特殊效果。 
4．Web网页的常见类型
目前，常见的网页有静态网页和动态网页两种。静态网页的URL通常以.htm、.html、.shtml、.xml等形式为后缀，而动态网页的URL一般以.asp、.jsp、.php、.perl和.cgi等形式为后缀。
5．浏览器
浏览器的作用是“翻译”HTML标记语言，并按照规定的格式显示出来，因此使用IE等浏览器可以直接访问网页。浏览器是浏览Internet资源的软件，通过它可以显示各种多媒体网页，连接到不同的Internet服务器，获取各种各样的有用信息。因此，浏览器是浏览者用于获得Web资源的有力工具。
如图1-2所示，浏览器窗口一般由标题栏、菜单栏、图标组成的工具栏、URL地址栏和页面等部分组成。浏览器具有以下基本功能：
● html网页设计超链接获取Internet资源。
● 保存访问记录。
● 阅读超文本文件。
● 具有字符格式化功能。
● 发送或接收E-mail。
● 具有安全保密功能。
● 具有书签功能。
● 处理具有交互功能的FORM表单。
6．网页制作新手须知
假如你从来没有制作过网页，现在希望体会一下制作网页的快乐，那么，你的工作步骤通常包括如下几步。
（1）使用Windows资源管理器规划网站的目录结构。例如，假定希望创建一个个人站点，其中大致包括个人兴趣（xingqu）、爱好（aihao）和自我简介（jianjie）等内容，那么网站的目录结构可以按图1-3所示进行安排。
图1-3  网站目录规划示例
因此，规划站点目录结构实际上是一个信息分类管理的过程，用户完全可以自由安排，不
过此时应特别注意下面几个问题。
● 最好在驱动根目录下创建站点文件夹，如在D盘下建立站点根文件夹mywebsite。
● 文件夹名、网页文件名及网页中所用到图像等素材文件名最好不要使用大写、中文及空格，因为很多网站使用的都是Unix操作系统，该操作系统对大小写敏感，且不能识别中文文件名。
● 不要将与网页无关的文件放置在站点文件夹中。
（2）启动网页编辑软件Dreamweaver，配置站点。由于将来必须将上面创建的文件夹结构及以后制作网页时产生的HTML文件及各种图片文件全部发送到某个ISP处，并且要不断更新文件。因此，用户必须让Dreamweaver了解自己的网站配置情况，以便让它自动完成这些工作。
（3）制作网页并将某个网页作为网站的入口网页，即主页。尽管在Dreamweaver中用户可将任何一个网页设置成主页，但是，由于很多ISP要求将主页名称命名为index.html，因此，用户最好遵守此规定。
（4）在某个ISP处申请一块地皮（空间），此时网站就有了自己的域名。请你留意ISP授予的FTP服务器名称、用户名、口令。
（5）利用Dreamweaver将本计算机上的站点内容上传到所申请的空间中。
以后的工作就是网站维护了，主要包括改进创建的网页、制作新网页、同步更新网站内容等。
任务2  认识网页制作工具
知识点：网页编辑工具及图像、动画制作工具
1．网页编辑工具
过去的网页一般是专业人员利用HTML语言编写实现的。目前已出现多种可视化程度很高的网页制作工具，设计者不需要掌握专业的网页制作技术也能创作出富有特、动感十足的网页。
1）FrontPage
FrontPage是Microsoft公司出品的入门级网页编辑软件。FrontPage支持所见即所得的编辑方式，它不需要用户掌握很深的网页制作技术，甚至可以不了解HTML的语法规则。只要会使用Word，就能很快学会使用FrontPage，因为它的基本使用方法同Word很相似，可以像Word文档一样在文章中加入表格，加入图像，甚至可以加入声音、动画和电影。FrontPage带有的向导和模板能使初学者在编辑网页时感到更加方便。
FrontPage最强大之处是其站点的管理功能。在更新服务器上的站点时，不需要创建更改文件的目录，FrontPage将自动跟踪文件并复制那些新版的文件。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。