创建站点

教案首页

（以2课时为单元）

课序：1

第一章第1—2节第二章第1—2节

目的要求：

通过此节的学习，读者应掌握网络相关的基础知识，了解网页制作工具，掌握HTML语言，掌握dreamwever工具的使用，掌握站点创建方法，掌握简单网页的制作。

教学内容：

1.internet基础

2.网页制作工具

3.HTML语言的语法结构

4.利用HTML语言制作简单网页

5.Dreamweaver工具界面

6.了解并掌握站点的创建

7.掌握简单网页的制作

重点与难点：

重点：HTML语言和站点的创建

难点：HTML语言

教学方法：多媒体教学

手段：课程讲授为主，学生讨论练习为辅。

教学步骤：

1.首先介绍当前internet发展情况，然后导入WWW、IP及域名、网页及网站

的概念。

2.首先介绍dreamweaver工具，然后讲解站点的创建和简单网页的制作。

复习提问：

作业题目：

习题1-2

预习内容：浏览网站，分析网站结构特点及配色特点。

第1章网页设计基础知识

本章主要介绍了网页设计前需要了解的准备知识，如网络基础知识、网页制作工具以及HTML语言等。

【本章学习目的】

通过本章的学习，读者应了解与网络相关的基础知识，了解网页制作工具，掌握HTML 语言。

一、Internet基础

1、Internet概述

Internet是相互连接的网络集合。网络协议是网络中的设备进行通信时共同遵循的一套规则，即以何种方法获得所需的信息。

Internet所提供的服务主要是WWW、E-mail、FTP、网上传呼、在线聊天、网上购物等等，而其中WWW和E-mail是最常用的服务。

2、WWW

WWW(World Wide Web)简称为万维网，客户端只要通过“浏览器”（Browser）就可以非常方便地访问internet上的服务器端，迅速地获得所需的信息。

3、网页与网站

什么是网页？什么是网站？两者有什么样的联系与区别呢？

构建WWW的基本单位是网页。网页中包含所谓的“超链接”，通过已经定义好的关键字和图形，只要用鼠标轻轻一点，就可以自动跳转到相应的其它文件，获得相应的信息，从而实现网页之间的链接，从而构成了WWW的纵横交织的网状结构。

通过超链接连接起来的一系列逻辑上可以视为一个整体的页面，则叫做网站。

4、域名与IP地址

在Internet上的每台网络设备都要有一个唯一的地址才能被访问到，这个地址就是IP 地址。

IP地址是由32位的二进制数值构成，分成4组，转化为十进制用点分隔，比如：202.100.4.11。

域名系统是一个分层的树状结构组织。最上面是一个无名的根域，下层为顶级域名，接着是二级……

顶级域名的分类：从组织上和地理上分类，顶级域名的管理和分配由internet网络信息中心控制，网址为：。

美国采用的组织分类形式，而其它国家采用的是地理上分类，用代表国家或地区的顶级域名，中国国内域名由中国互联网信息中心控制，网址为：。

域名的书写格式为：叶节点名.二级域名.顶级域名

例如：，www：web服务器名，sohu：企业名称，com：顶级域名。

二、网页制作工具

目前网页制作工具较多，大多数网页的制作都是通过“所见即所得”的编辑工具完成的，在网页制作过程，还需要进行素材的创作和加工，即图形和动画制作工具。

1、网页编辑工具

网页编辑工具主要分为标记型和所见即所得型。

所见即所得型的编辑软件主要有：微软的Frontpage和Dreamweaver。其中Frontpage 继承了OFFICE系列软件的界面通用、操作简单的特点，十分适合初学者使用。

但Frontpage与MacroMedia公司的Dreamweaver相比，在HTML源代码的精确性、实用性以及对各种新技术的支持上都略逊一筹，本教材主要介绍的网页编辑工具是Dreamweaver。

2、图形和图像处理工具

目前常用的图形和图像处理工具主要是Adobe公司出品的著名的图形图像处理软件：Photoshop和MacroMedia公司推出的Fireworks（MacroMedia公司也已被Adobe公司收购）。

Photoshop的功能十分强大，是目前最为广泛的专业图形图像处理软件之一，它捆绑了Image Ready，能够实现各种专业化的图像处理、动画的制作等。有兴趣的读者可查阅相关的参考书研究和学习。

Fireworks是由MacroMedia公司出品的首选WEB图形图像处理软件。它的独特之处在于其能够优化处理大图片、切割图片、为图片加入特殊效果、制作网页的动态行为等，可以生成Fireworks HTML，直接导入到网页中，使用非常方便。本教材将在以后的章节做详细的介绍。

3、动画制作工具

Flash是目前网页制作中最为出色的动画制作软件，它是一种交互式动画设计工具，用它可以将音乐、声效、动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。Flash所使用的图形是压缩的矢量图形，采用了网络流式媒体技术，突破了网络带宽的限制，可以边下载边播放，这样避免用户长时间的等待，设计者可以随心所欲地设计出高品质的动画，Flash已经慢慢成为网页动画的标准，成为一种新兴的技术发展方向。

三、HTML语言

网页的本质是HTML，HTML即为超文本标记语言，超文本使网页之间具有跳转能力，使浏览者可以选择阅读路径。

使用HTML编写的WEB页面称之为HTML文件，这种文件一般以“html”或者“htm”为扩展名，使用网页编辑工具创建HTML文件。

1、HTML语法结构

HTML文件的所有控制语句称为标签，标签在一对尖括号之间，格式如下：

<标签>HTML语言元素

标签分为成对标签和非成对标签，比如：

…，而
、

---

等属于非成对标签。标签忽略大小写，书写格式非常灵活。可使用标签的属性来进一步限定标签，一个标签可以有多个属性项，各属性项的次序不限定，各属性项之间用空格来进行分隔。例如：。

HTML中使用的注释语句为，注释内容可插入文本中任何位置，注释内容不会显示在网页中。例如：

2、常见的HTML标签

1.…

2.…