网页制作与设计教案.doc

网页制作与设计教案 第一讲 网页设计概述 3 1 1 WWW 和 URL 3 1 2 IE5 的使用 3 1 3 网页中所使用的技术 4 1 4 制作网页的基本方法 4 第二讲 HTML 的基本标志与格式标志 4 2 1 HTML 文档的基本结构 5 第三讲 HTML 的文本 图片与超级链接标志 5 2 2 插入文字 6 2 3 插入图片 8 2 4 建立超级链接 8 第四讲 HTML 表格 表单与框架标志 9 2 5 插入表格 9 2 6 表单的应用 10 2 7 框架窗口 10 第五讲 HTML 标志综合运用案例 11 第六讲 DREAMWEAVER 中简单 WEB 站点建立与管理 12 3 1 DREAMWEAVER 概述 12 第七讲 DREAMWEAVER 中静态网页设计 13 3 2 在页面中加入文字和图像 14 3 3 超级链接的运用 14 3 4 表格的应用 14 3 5 在网页中创建表单 15 第八讲 DREAMWEAVER 中动态网页设计 15 第九讲 DREAMWEAVER 综合性网页设计案例 16 第十讲 VBSCRIPT 概述 17 4 1 VBSCRIPT 语言简介 17 第十一讲 VBSCRIPT 的基本元素与输入输出 18 4 2 基本数据类型 18 4 2 表达式和运算符 19 第十二讲 VBSCRIPT 的条件语句 循环语句和过程 20 4 3 VBSCRIPT 基本语句 20 第十三讲 VBSCRIPT 文档对象模型 21 4 4 基于对象的 VBSCRIPT 语言 21 4 5 使用内部对象系统 22 第十四讲 ASP 概述 23 5 1 ASP 概述 23 第十五讲 使用 ASP 对象 24 5 2 ASP 的内置对象 25 第十六讲 使用 ASP 组件 25 5 3 ASP 的内置组件 26 第十七讲 使用 ADO 对象 26 5 5 ADO 数据对象 26 第十八讲 设计实例 论坛 27 第十九讲 设计实例 成绩管理系统 28 第二十讲 网站的设计 制作 发布和宣传 29 第一讲 网页设计概述 教学内容 讲解网页设计的相关术语及网站制作的基本流程 教学目的 使学生对网站及网页有一定的认识 激发学生学习网页设计的兴趣 教学重点 网页设计中的若干术语 教学难点 理解网页设计中的若干术语 教学方式 讲授式 讨论式 案例分析式 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 Internet 网页工场 Wittime 工作室 重庆出版社 3 WEB 网站设计 Joel Sklar 著 高等教育出版社 4 HTML 网页制作教程 材义语编著 铁道出版社 新课内容 1 1 WWW 和 URL 1 1 1 Web 的起源 Web 是 World Wide Web 的简称 一般也称之为 WWW 或 3W 1 1 2 Web 的特点和结构 Web 最大的特点是使用了超文本 Hypertext WWW 采用 C S 客户机 服务器 工作模式 在浏览器和服务器之间应用 HTTP Hyper Text Transfer Protocol 超文本传输协议 作为网络应用层通信协议 1 1 3 URL URL 的完整格式 协议 主机名或 IP 地址 端口号 路径名 文件名 1 2 IE5 的使用 Web 浏览器是浏览 Internet 资源的客户端软件 在 Windows 环境下使用的浏览器主要有 Internet Explorer Netscape Navigator Mosaic 等 1 2 1 IE5 的界面 1 2 2 IE5 的使用 1 3 网页中所使用的技术 1 3 1 HTML 语言和 XML 语言 1 HTML 语言 HTML 只使用 SGML 中很小一部分标记 HTML 语言 Hyper Text Markup Language 超文本标记语言 HTML 是纯文本的语言 其源代码可以用各种文本编辑工具进行编辑 常用的网页 制作软件如 FrontPage Dreamweaver 等实际上是自动生成 HTML 源代码的工具 2 XML 语言 XML eXtensible Markup Language 1 3 2 动态网页 1 3 3 多媒体技术的应用 1 3 4 Web 服务器端程序 1 4 制作网页的基本方法 1 4 1 制作网页的基本步骤 1 确定网页的内容 2 设计网页的组织结构 3 资料的收集与整理 4 选择网页的设计方法 1 4 2 制作网页时要注意的问题 1 网页的标题要简洁 明确 2 在文本中要使用水平线 以分割不同部分 3 对重点段落要强调显示 4 网页中插入的图片要尽量的小 5 图形要附加文字说明 以便关闭图像时查看 6 网页中引用的资料及商标 或图标 不能侵犯版权 课后小结 通过学习 认识网络 网站 网页及相关信息 理解网页制作的流程及了解相应开发 工具 为设计网页做准备 第二讲 HTML 的基本标志与格式标志 教学内容 讲解 HTML 基本标志对和格式标志 教学目的 使学生标志对与格式标志对的使用 教学重点 格式标志的使用 教学难点 列表标志的使用 教学方式 讨论式 案例分析式 练习式 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 Joel Sklar 著 高等教育出版社 3 HTML 网页制作教程 材义语编著 铁道出版社 新课内容 2 1 HTML 文档的基本结构 2 1 1 HTML 语法 1 双标记 语法 内容 2 单标记 语法 最常用的单标记是 3 标记属性 语法 例子 4 注释语句 格式 例子 2 1 2 HTML 文档的基本结构 课后小结 通过本次课的学习 要求能熟练掌握网页面的基本标志与格式标志 并能灵活运用 列表 有序列表 无序列表标志及属性 第三讲 HTML 的文本 图片与超级链接标 志 教学内容 讲解 HTML 标准中的文本 图片与超级链接标志 教学目的 使学生了解标题元素 掌握字体 上下标 及特殊字符的标志 使学生掌握图片标志 声音标志及相应的属性 学会利用标志在网页中插入声音与图片 使学生掌握超级链接标志的使用 教学重点 字体 图片和超级链接标志的使用 网页中特殊符号的输入 教学难点 理解特殊符号对应的标志 理解 img 标志中属性的意义 理解书签超级链接的意义 教学方式 讨论式 案例分析式 练习式 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 Joel Sklar 著 高等教育出版社 3 HTML 网页制作教程 材义语编著 铁道出版社 新课内容 2 2 插入文字 2 2 1 划分段落 格式 段落内容 2 2 2 插入标题文字 格式 标题内容 2 2 3 字号属性 设置基准字号 网页内的其他文字 采用下面的格式来定义 Size 的有效范围是 1 最大 到 7 最小 如果在 Size 的值前面带上 号或 号 则表示相对于基础字体增大或减小若干字号 2 2 4 颜色属性 两种方式 字符串 2 2 5 字体属性 2 2 6 文本修饰 文字以粗体显示 文字显示为斜体 显示下划线 中心线贯穿文字 强调文字 通常用斜体 特别强调的文字 通常用黑体 以等宽体显示西文字符 使文字大小相对于前面的文字增大一级 使文字大小相对于前面的文字减小一级 使文字成为前一个字符的上标 使文字成为前一个字符的下标 使文字显示为闪烁效果 2 2 6 文本修饰 2 2 7 预格式化文本 使用预格式化标记 不再忽略在此之间的空格 制表符与回车符等元素 2 2 8 转义字符与特殊字符 一般转义符都是以 alert 这是紫星的电脑世界 课后小结 VBScript 是程序开发语言 Visual Basic 家族的最新成员 可以将灵活的脚本应用于更 广泛的领域 包括 Microsoft Internet Explorer 中的 Web 客户端脚本和 Microsoft Internet Information Server 中的 Web 服务器端脚本 掌握 VBScript 是开发动态网站的必要条件 第十一讲 VBScript 的基本元素与输入输出 教学内容 讲解 VBScript 的数据类型 常量 变量 运算符以及 VBScript 的基本语句 教学目的 使学生对 VBScript 这种开发语言的基本语法有个初步认识 教学重点 VBScript 的基本元素与输入输出 教学难点 对 VBScript 的数据类型 常量 变量 运算符建立起基本概念 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 4 2 基本数据类型 数值 整数和实数 字符串型 用 号或 括起来的字符或数值 布尔型 使用 True 或 False 表示 空值 VBScript 采用弱类型的形式 因而一个数据的变量或常量不必首先作声明 4 2 1 基本数据类型 1 常量 1 整型常量 可以使用十六进制 八进制和十进制表示 2 实型常量 由整数部分加小数部分表示 如 12 32 193 98 使用科学或标准方法表示 5E7 4e5 等 3 布尔值 只有两种状态 True 或 False 4 字符型常量 使用单引号 或双引号 括起来的一个或几个字符 5 空值 null 6 特殊字符 以反斜杠 开头的字符串 2 变量 变量的主要作用是存取数据 提供存放信息的容器 对于变量必须明确变量的命名 变量的类型 变量的声明及其变量的作用域 1 变量的命名 必须是一个有效的变量 即变量以字母开头 中间可以出现数字如 test1 text2 等 除下划线 作为连字符外 变量名称不能有空格 或其它符号 不能使用 JavaScript 中的保留字作为变量 2 变量的类型 3 变量的声明及其作用域 使用 var 关键字对变量作声明 有全局变量和局部变量 4 2 表达式和运算符 表达式 可以分为算术表述式 字串表达式 赋值表达式以及布尔表达式等 运算符 1 双目运算符和单目运算符 双目运算符 操作数 1 运算符 操作数 2 如 50 40 This that 等 单目运算符只需一个操作数 其运算符可在前或后 2 算术运算符 3 比较运算符 4 逻辑运算符 3 注释符 在本行中所有在 符号之后的字符将被解释器忽略 在 和 之间的所有字符 可持续多行 将被解释器忽略 课后小结 本节介绍了 VBScript 的基本元素 包括 VBScript 的数据类型 常量 变量和运算符 并且初步提到了 VBScript 的输入输出基本语句 为下节课的内容作好准备 第十二讲 VBScript 的条件语句 循环语句 和过程 教学内容 讲解 VBScript 的一些基本语句以及过程 教学目的 使学生基本掌握对 VBScript 的基本语句语法格式和过程 教学重点 VBScript 的基本语句语法格式 教学难点 VBScript 的基本语句语法格式和过程过于概念化抽象化 学生掌握有难度 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 4 3 VBScript 基本语句 4 3 1 控制程序流程 if 条件语句 if 表达式 语句段 1 else 语句段 2 2 for 循环语句 for 初始化 条件 增量 3 while 循环 while 条件 语句集 break 和 continue 语句 break 语句使得循环从 for 或 while 中跳出 continue 使得跳过循环内剩余的语句而进入下一次循环 4 3 2 函数 函数可以封装那些在程序中可能要多次用到的模块 并可作为事件驱动的结果而调用 的程序 从而实现一个函数与事件驱动相关联 事件可以是页面调入 单击 表单送 出等 课后小结 本节详细介绍了 VBScript 的基本语句语法格式和过程 这些概念过于抽象化 学生掌 握过程中有很大难度 这就要求我们教师不断的耐心的详细的进行讲解 第十三讲 VBScript 文档对象模型 教学内容 讲解 VBScript 的文档对象模型 教学目的 使学生掌握对 VBScript 文档对象模型的理解和运用 教学重点 什么是 VBScript 的文档对象模型 教学难点 VBScript 文档对象模型的灵活运用 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 4 4 基于对象的 VBScript 语言 4 4 1 对象的基础知识 1 对象的基本结构 2 引用对象的途径 3 有关对象操作语句 1 for in 语句 用于对已知对象的所有属性进行操作的控制循环 它将一个已知对象的所有属性反复 赋值给一个变量 而不是使用计数器来实现 此语句无需知道对象中属性的个数即可 进行操作 2 with 语句 说明要引用的对象 在该语句体内 任何对变量的引用被认为是这个对象的属性的引 用 这种方法可节省一些代码 避免引用混乱 使用形式为 with object 3 this 关键词 4 new 运算符 4 对象属性的引用 使用点 运算符 通过对象的下标实现引用 通过属性名称字符串的形式实现引用 对象的方法的引用 静态对象 在引用该对象的属性或方法时不需要为它创建实例 动态对象 在引用它的对象属性或方法时必须为它创建一个实例 4 4 2 常用对象的属性和方法 字符串对象 string 1 string 对象的属性 该对象只有一个属性 length 2 String 对象的方法 锚点 anchor 有关字符显示的控制方法 Big Italics bold blink small fixed fontsize size 字体颜色方法 fontcolor color 字符串大小写转换 toLowerCase toUpperCase 字符搜索 indexOf charactor fromIndex 返回字符串的一部分字符串 ubstring start end 算术函数的 math 对象 日期及时间对象 date 4 4 3 VBScript 中的系统函数 1 eval 字符串表达式 返回字符串表达式中的值 如 test eval 8 9 5 2 返回的 test 值为 19 5 而不是字符串 8 9 5 2 2 unEscape string 返回字符串 ASCII 码 3 escape character 返回字符的编码 4 parseFloat floustring 返回实数 5 parseInt numbestring radix 返回不同进制的数 radix 是数的进制 numbestring 是 字符串数 4 4 4 创建新对象 4 4 5 VBScript 中的数组 4 5 使用内部对象系统 4 5 1 浏览器中的对象 1 文档对象的作用 把文档中的链接 表单 标签等基本元素包装起来 提供给编程人员使用 2 文档对象中的属性 1 alinkcolor 2 linkcolor 3 vlinkColor 4 bgcolor 5 fgcolor 6 LastModified 7 Location 8 title Document 对象中的对象 Links Anchors Forms 这三个对象分别组成各自的数组 网页中每个对象的数目包含在属性 length 中 4 5 2 窗口元素的控制 课后小结 文档对象模型是可以被任何脚本引擎访问的对象的集合 它提供了对 Web 浏览器的访 问 但 VBScript 语言没有其对象模型 它使用 Microsoft Internet Exploer 浏览器的对象 模型 这是一种具有层次结构的对象模型 其中每个对象都有属性 方法和事件 而 属性本身也是对象 它又包含属性 方法和事件 这是学生应该注意的地方 第十四讲 ASP 概述 教学内容 讲解 ASP 的基本理论概念 教学目的 使学生掌握对 什么是 ASP 有个基本的认识 教学重点 什么是 ASP 教学难点 又一个新的概念 ASP 要求学生掌握 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 5 1 ASP 概述 5 1 1 ASP 简介 1 ASP 的含义 ASP Active Server Pages 动态服务器网页 是一种基于服务器的编程技术 它并不 是一种脚本语言 它提供的只是一种服务器端的脚本环境 从某种意义上说 ASP 是一 种附加特性扩展了的 HTML 文件 2 ASP 的特点 纯文本文件 设计方便 与平台无关性 较强的安全性 扩充能力强 访问数据库方便 3 ASP 的用途 ASP 可以实现计数器 留言本 聊天室等应用程序 在网站中设计滚动显示的广告栏 从 HTML 的表单中接受信息并保存到数据库中 可以根据不同的访问时间显示不同的内容 以创建个性化的网页 在网页中添加计数器 根据用户的浏览器的版本和类型显示不同档次的内容 跟踪用户网站上的活动并存入日志文件 5 1 2 ASP 的工作原理 ASP 工作的过程分为下面的几步 用户在浏览器的地址栏中输入要访问的主页地址并按回车键触发这个申请 浏览器将 ASP 申请发送到含有 IIS 的 Web 服务器上 Web 服务器接受这些申请并根据 asp 的后缀意识到这是一个 ASP 文件 Web 服务器从本地硬盘或内存读取适当的 ASP 文件 然后向特定的名为 ASP DLL 程序发送文件 Web 服务器将 ASP 文件从头到尾执行并根据命令要求生成标准的 HTML 文件 并 将生成的 HTML 文件传送给浏览器 传送回来的 HTML 文件将被用户的浏览器所解释 并将其结果显示在用户的浏览 器上 课后小结 ASP 的英文全称是 Active Server Page 翻译为中文就是动态网页 ASP 对 WEB 服务 器的增强 让 HTML 网页浏览器从服务器取得 WEB 页面的工作方式有所改变 理解 ASP 的工作原理对以后的进一步学习制关重要 第十五讲 使用 ASP 对象 教学内容 讲解 ASP 对象的使用 教学目的 使学生掌握对 ASP 对象的使用方法 教学重点 什么是 ASP 的对象 教学难点 每种对象的运用都不相同 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 5 2 ASP 的内置对象 5 2 1 Request 对象 利用 form 集合获取数据 利用 QueryString 集合获取数据 5 2 2 Response 对象 向浏览器输出数据 Response write 文字打字效果 清除数据 Response Clear 使网页转向 Response redirect 停止向浏览器输出数据 Response end 5 2 3 Application 对象 5 2 4 Session 对象 5 2 5 Server 对象 Server 对象提供对服务器上的方法和属性进行的访问 最常用的方法是创建 ActiveX 组件的实例 其他方法用于将 URL 或 HTML 编码成字符串 将虚拟路径映射到物理 路径以及设置脚本的超时限期 向浏览器输出 HTML 代码的方法 Server HTMLEncode 取得文件路径的方法 Server MapPath 设置脚本运行时间 课后小结 在面向对象编程中 对象就是指具有一组实体的属性数据和操作方法的变量 ASP 是 一种面向对象的程序语言 它具有许多对象 通过本节的学习 要求学生熟练掌握 ASP 对象的使用方式 第十六讲 使用 ASP 组件 教学内容 讲解 ASP 组件的使用 教学目的 使学生掌握对 ASP 组件的使用方法 教学重点 什么是 ASP 的组件 教学难点 过多的组件使学生掌握起来需要花费很多精力和时间 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 5 3 ASP 的内置组件 5 3 1 文件访问组件 1 文件操作组件 文件的处理 3 对文件夹和驱动器进行操作 5 3 2 广告轮播组件 1 Ad Rotator 组件的属性 5 3 3 浏览器信息组件 Browse Capabilities 组件的主要属性 Browse Capabilities 组件的工作原理 使用 Browse Capabilities 组件前必须先创建该组件实例 Set 实例名 Server CreateObject MSWC BrowserType 5 3 4 内容链接组件 课后小结 当用 ASP 编写服务器端应用程序时 必须依靠组件来增强 WEB 应用程序的功能 事 实上组件是其他人已经编写好的一些程序 我们只要掌握它们的使用方法就可以了 第十七讲 使用 ADO 对象 教学内容 讲解 ADO 对象的使用方法 教学目的 使学生掌握对 ADO 对象的使用方法 教学重点 什么是 ADO 对象 教学难点 如何运用 ADO 访问数据库 教学方式 讲授式 项目模块式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 新课内容 5 5 ADO 数据对象 5 5 1 Connection 对象 1 Connection 对象的方法 Open 方法 Execute 方法 Close 方法 BeginTrans 方法 CommitTrans 方法 RoolbackTrans 方法 2 Connection 对象的属性 5 5 2 Recordset 对象 1 Recordset 对象的方法 Open 方法 Close 方法 Move 方法 Update 方法 CancelUpdate 方法 UpdateBatch 方法 CancelBatch 方法 AddNew 方法 Delete 方法 5 5 3 Command 对象 1 CreateParameter 方法 2 Excute 方法 3 Command 对象所提供的属性包括 ActiveConnection 属性 CommandText 属性 CommandType 属性 CommandTimeout 属性 Name 属性 State 属性以及 Prepared 属性 课后小结 ASP 环境下对数据库的访问主要是通过 ADO 数据模型 ADO 访问数据库更类似于编 写数据库应用程序 ADO 是 ASP 技术的核心之一 它集中体现了 ASP 技术丰富而灵 活的数据库访问功能 学好本节是制作动态网站的关键 第十八讲 设计实例 论坛 教学内容 实例讲解利用 ASP 进行论坛的制作 教学目的 使学生掌握 ASP 网站的制作方式及其流程 教学重点 一个简单 ASP 网站的制作方式及其流程 教学难点 要求学生综合运用所学过知识 教学方式 案例分析式 讨论式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 4 ASP 数据库系统开发实例导航 宣小平 但正刚 张文毅编著 人民邮电出版社 新课内容 1 论坛系统功能概述 2 创建数据库 3 查看主题 4 发表主题 5 保存主题 6 回复主题 7 保存回复 课后小结 论坛是网络上非常流行的一个功能 通过对以前所学知识的综合运用完成这一网站的 设计和建设 对于学生来说有一定难度 但是通过实例的讲解 帮助学生们更快的上 手 效果非常显著 第十九讲 设计实例 成绩管理系统 教学内容 实例讲解利用 ASP 进行成绩管理系统的制作 教学目的 使学生进一步掌握 ASP 网站的制作 教学重点 一个稍复杂 ASP 网站的制作方式及其流程 教学难点 要求学生加深对动态网站的理解 教学方式 案例分析式 讨论式 演示教学 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 3 网页编程技术与实例 谭浩强主编 人民邮电出版社 4 ASP 数据库系统开发实例导航 宣小平 但正刚 张文毅编著 人民邮电出版社 新课内容 1 成绩管理系统功能概述 2 创建数据库 3 用户验证 4 学生资料管理 5 课程设置管理 6 成绩数据管理 课后小结 成绩管理系统事实上是个利用 ASP 强大功能制作的一个小型系统 通过实例的教学 让学生们对动态网站有更进一步的理解和认识 第二十讲 网站的设计 制作 发布和宣传 教学内容 讲解一个网站建设基本的流程 教学目的 使学生完全了解一个网站建设的全部过程 教学重点 网站建设的基本流程和注意事项 教学难点 网站的创意设计 教学方式 讲授式 讨论式 项目模块式 教学参考 1 网页设计与制作 杨尚森 曲宏山 贾文峰等著 电子工业出版社 2 WEB 网站设计 张锦祥主编 科学出版社 新课内容 1 网站的美化管理 2 网站的创意构思 3 网站的规划 4 网站的整体设计和分工 5 网站的发布 6 网站的后期管理和维护 课后小结 网站的设计是网站建设中一个非常重要的环节 一个创意新颖 设计精美 结构合理 的网站会自然而然的吸引用户 因此 应该要求学生多看多想多动手 这样才能把网 页制作这门课程学好学精 成为社会直接可用的人才