《网页设计与制作(HTML+CSS)》课程教学大纲（精选）

第一篇：《网页设计与制作(HTML+CSS)》课程教学大纲（精选）

《网页设计与制作(HTML+CSS)》课程教学大纲

任课教师：张志慧 编写时间：2018-12-14

一、课程的性质与目标

《网页设计与制作(HTML+CSS)》是面向计算机相关专业的一门专业基础课，涉及计算机基础、互联网等内容，通过本课程的学习，学生能够了解网页web发展历史及其未来方向，熟悉网页设计流程、掌握网络中常见的网页布局效果、学会制作各种企业，门户，电商类网站。

二、课程的主要内容及基本要求

第二篇：网页设计与制作课程教学大纲

网页设计与制作课程教学大纲

1.课程设计的指导思想

（一）课程性质

1．课程类别：专业选修课 2．适应专业：软件工程 3．开设学期：第二学期

4．学时安排：周学时2＋2，总学时72 5．学分分配：

（二）开设目的

本课程是计算机类专业的专业选修课,它是一门操作性和实践性很强的课程。本课程开设的主要目的，是为了适应web技术的飞速发展，为学生今后在学习、工作中建立网站及网页制作打下基础。通过本课程的学习，让学生了解一定的网络应用基础知识；能够熟练掌握网页制作工具——网页三剑客Dreamweaver、Fireworks、Flash的使用，能自行设计各种网页、编辑一定的平面图像、网络动画。具备网站的建立、规划、管理、发布的相关技术及网页制作的操作技能，能独立设计 WEB 站点。

（三）基本要求

1、知识要求：

（1）网页设计基础知识（2）DREAMWEAVER 的使用（3）FIREWORKS 图像处理（4）FLASH 的使用（5）网站制作实例

2、能力要求：

（1）学会熟练运用 Dreamweaver、Flash 和 Fireworks 应用软件；（2）熟练掌握使用绝对和相对 URL，创建超链接，图像链接；（3）熟练掌握设置颜色、文本格式和列表；（4）掌握在网页中添加 CSS 的方法

（5）掌握在网页中嵌入图像、声音、多媒体信息的方法；（6）熟练掌握表格的使用方法，学会利用表格布局网页；（7）掌握框架制作网页的方法，会使用框架设计网页；（8）掌握用 Fireworks 处理矢量图和位图。（9）掌握用 Flash 制作网页动画。

3、素质要求：

（1）具有勤奋学习的态度，严谨求实、创新的工作作风；（2）具有良好的心理素质和职业道德素质（3）具有高度责任心和良好的团队合作精神

（4）具有一定的科学思维方式和判断分析问题的能力（5）具有较强的网页设计创意思维、艺术设计素质。

（四）主要内容 计算机网站基础知识、网页三剑客DREAMWEAVER 的使用、FIREWORKS 图像处理、FLASH 的使用。

（五）先修课程 计算机基础

（六）后继课程 Web 程序设计

（七）考核方式 上机考试

（八）使用教材

（九）参考书目

1、《网页设计与制作技术教程》 作者：王传华、段青玲、马钦? 清华大学出版社?第二版.2、网页和网站制作基础操作与实例教程.陕西科学技术出版社

3、Dreamweaver8PhotoshopCS2Flash8网页制作教材.陈笑；李景池.清华大学出版社

4、《使用网站技术基础》作者：德力、卢明波、王化宇.内蒙古教育出版社 教学内容

第一部分 网页设计与制作基础知识 教学目的

使学生了解什么是网页，网站，网页元素等概念 主要内容 什么是网页，网站;2 Html语言基础； 构建网站的一般过程； 教学要求

了解：网站设计与制作的前期准备 掌握： 绘制网站首页效果图 第二部分 网页制作软件Dreamweaver 教学目的

使学生了解网站设计概念；掌握软件界面及站点建立，Dreamweaver的基本功能，表单和CSS样式表的应用及网页制作的高级技术。主要内容

1、网站设计概念，要求达到“了解掌握”程度 网站的主题定位

网站的风格和创意设计 准备材料和结构规划 页面布局

定义站点、申请域名、空间 认识HTML语言

2、初识软件界面及站点建立，要求达到“了解掌握”程度 Dreamweaver软件界面 对象控制面板的使用 建立本地站点 建立远程站点 站点的更新和管理

3、Dreamweaver的基本功能，要求达到“掌握”程度，添加文本 插入图片 插入表格

超级链接和导航条的创建 插入多媒体

4、表单和CSS样式表的应用，要求达到“了解掌握”程度 插入表单

插入表单对象

创建并链接到外部CSS样式

5、网页制作高级技术，要求达到“了解掌握”程度 创建层 设置层

层与表格的相互转换 创建框架 行为操作 创建模板 模板的应用 教学要求

了解：网站设计概念

掌握：软件界面及站点建立，Dreamweaver的基本功能，表单和CSS样式表的应用及网页制作的高级技术。

第三部分 图形制作与处理软件Firewoks 教学目的

使学生了解Fireworks软件界面；掌握图像的绘制和编辑，文本与颜色的使用，层与元件的使用，滤镜和特效的使用，按钮和动画的制作。主要内容

1、Fireworks简介，要求达到“了解掌握”程度 Fireworks概述

Fireworks的系统需求 Fireworks的新增功能 Fireworks窗口界面 创建新文档

导入和导出文档

2、图像的绘制和编辑，要求达到“掌握”程度 绘制图像 编辑图像

3、文本与颜色，要求达到“掌握”程度 文本的使用 颜色的使用 设置画布

4、层与元件，要求达到“掌握”程度 层的使用 元件的使用

5、滤镜和特效，要求达到“了解掌握”程度 使用滤镜 使用特效

6、按钮和动画，要求达到“了解掌握”程度 按钮 动画

教学要求

了解：Fireworks软件界面

掌握：图像的绘制和编辑，文本与颜色的使用，层与元件的使用，滤镜和特效的使用，按钮和动画的制作。第四部分 动画制作与编辑软件Flash 教学目的

使学生了解Flash基本工作环境；掌握Flash绘图工具的使用方法，Flash动画基础及FIash影片制作和发布。主要内容

1、初识Flash，要求达到“了解”程度 Flash基本工作环境 认识舞台与时间轴.认识不同作用的面板

2、Flash绘图工具，要求达到“掌握”程度 矢量图与位图 线型与颜色

线条的绘制与修改 填充图形的绘制，选取工具 文本

变换工具 其他工具

3、Flash动画基础，要求达到“掌握”程度 层 帧 元件

Flash的基本操作

4、FIash影片制作和发布，要求达到“掌握”程度 动画基础 逐帧动画 形状渐变 动作渐变 蒙板

运动导线 按钮

轨迹追踪 导入声音 加入视频 测试发布 教学要求

了解：Flash基本工作环境

掌握：Flash绘图工具的使用方法，Flash动画基础及FIash影片制作和发布。第五章 综合实例 教学目的

使学生能够熟练掌握网页制作工具Dreamvwaver、Fireworks、Flash的使用，能自行设计各种网页、编辑一定的平面图象、网络动画。具备网站的建立、规划、管理、发布的相关技术及网页制作的操作技能，能独立设计 WEB 站点。主要内容

综合实例，要求达到“掌握”程度 网页设计准备工作

用Fireworks设计网页结构 用Dreamweaver生成网页 用Flash制作网页动画 整理网页

完成小型WEB站点网页的规划、设计、管理与维护 教学要求

掌握：Web网站建设的基本方法，掌握网页制作工具的使用方法和技巧，培养学生设计网站的能力。课时分配及其它

（一）课时分配

课程总教学时数为90学时，安排在第二学期，每周3＋2学时，上课18周。具体分配如下

教学内容 讲授学时数

章次

第一部分 网页设计与制作基础知识 4 第二部分 网页制作软件Dreamweaver 12 第三部分 图形制作与处理软件Firewoks 8 第四部分 动画制作与编辑软件Flash 8 第五部分 综合实例 4 合计

实验学时数 10 8 2 36

（二）考核要求

平时成绩（含考勤、作业与实验）占50%，期末（上机考试）成绩占50%。

第三篇：《网页设计与制作》教学大纲

《网页设计与制作》教学大纲

一、课程基本信息

课程编号：

中文名称：网页设计与制作

英文名称：Web Design and Production 课程类别：选修课 适用专业：所有专业

开课学期：2011-2012第2学期 总学时：24学时 总学分：1 课程简介：

本课程突出网页设计与制作的现代特点，从Internet的基础知识入手，重点介绍HTML超文本标记语言，以及所见即所得的网页设计制作工具Dreamweaver的基本操作流程。从静态页面到动态页面由浅入深的介绍网页设计与制作全过程。采用案例分析和亲自实践的方式突出、突破课程的重点和难点。并指导每一名选课的同学为自己建一个博客网站，以此提高同学对网页设计与制作的兴趣和爱好。参考书：

1、网页设计与制作教程，熊前兴 闵联营，科学出版社;

2、网站与网页设计，张贵明，清华大学出版社;

3、网页美术设计原理及实战策略，王晓峰 焦燕，清华大学出版社;

4、网站建设典型案例，张枭，清华大学出版社；

二、课程教学目标：

网页和网站是Internet的重要组成部分，企业、公司和机构通过网站来宣传推介自己的技术和产品，个人发布主页展示自己的风采，人们从不同类型的网站来获取需要的信息。因此，设计与制作网页已经成为计算机应用技术的一个重要方面。本课程的主要教学目的是使学生掌握网页设计与制作的基础知识，能运用网页工具设计和制作常用网页。

三、理论教学内容与要求

第一章、网页的基础知识（1学时）（1）Internet基础知识

（2）www简介

（3）网页制作的技术和工具介绍

第二章、超文本编辑语言HTML（8学时）（1）HTML文件的基本结构（2）文字和段落标记

（3）列表标记

（4）图片标记（5）表格标记（6）超链接标记（7）表单标记（8）框架标记

第三章、JavaScript语言（4学时）（1）JavaScript语言简介（2）JavaScript编程基础（3）基于对象的JavaScript语言（4）JavaScript程序实例

第四章、层叠样式表CSS（1学时）（1）CSS概述（2）CSS属性

第五章、可视化网页设计工具Dreamvawer8.0（1）网页的基本操作（2）图像、表格与超链接（3）表单与框架（4）添加网页元素（5）发布站点

第六章、动态网页设计语言ASP（4学时）（1）ASP简介（2）VBScript脚本基础（3）ASP的内置对象（4）实用Global.asa文件

4学时）（第七章、利用AD0访问数据库（1学时）（1）数据库的连接（2）数据库的检索（3）数据库的操作

总结复习（1学时）

四、实验教学内容与要求

五、作业

六、考核方式

期末考核每个同学为自己设计制作一个博客网站。

七、成绩评定

1.自制网站（80%）2.平时考勤、作业(20%)平时成绩分配：

平时考勤5次，每次2分，共占10% 作业5次，每次2分，共占10%

八、执行大纲时应注意的问题

根据学生对课程内容的掌握和理解程度会对进度做适当的调整。

执笔人：邢雁平

第四篇：网页制作与设计教学大纲

《网页制作与设计》教学大纲

课程编号：

总学时数：36学时（其中讲授：20学时，实验：16学时）

一、课程性质、目的和要求

本课程是我系各专业必修专业课程之一。该课程以Dreamweaver和CSS为蓝本，全面介绍与网页设计制作有关的知识，向学生阐明Web基本工作机制，并使学生具有解决静态网页制作和设计等方面问题的能力。通过对WWW的基本概念、网页设计的基本原则、网页设计编程的基本技术与技巧的学习，使学生对于网页设计中所涉及的相关知识有一个全面的了解。

在网络技术迅速发展的今天，网页制作已成为当今社会上一种比较热门的技术，也是计算机专业学生的一门必修课，通过课程学习要求学生能够掌握静态网页的制作工具的使用以及HTML标记语言的运用，并基本掌握JavaScript脚本语言编程的常用方法与技巧。通过与前期课程的融会，运用掌握的Flash等其他制作工具软件，在具体的网页设计过程中要很好的将几者结合起来使用，从而能够生成功能强大、丰富多彩、生动活泼的高质量的网页。通过本门课程的学习，学生能够具备以下能力：网站建设、网络广告、多媒体课件、网络游戏、汇报材料，MTV等。同时培养学生以下素质：服务意识：能够为他人提供优质的服务；文明法制意识：网站内容应积极健康向上，不做违法的事；合作精神：能够与他人进行合作，具有协调工作能力和组织管理能力；较强的自我知识及技术更新能力：快速跟踪网页制作的新技术及市场应用动态。

二、教学内容、要点和课时安排

第一章 Dreamweaver MX概述 1．Dreamweaver MX简介

2．Dreamweaver MX的工作界面介绍

3．窗口和面板

4．Dreamweaver MX的新特性

要求：熟悉Dreamweaver MX的操作界面，DreamweaverMX版本的最新特性，掌握如何自行设置具有独特的工作环境，对Dreamweaver MX的主界面认识透彻，便于以下课程的深度学习。

第二章 创建站点 1．站点的规划

2．创建本地站点 3．创建ASP站点 4．连接数据库

2学时

2学时 5．站点的管理与维护 6．发布站点 要求：了解站点的基本概念，熟悉掌握使用DreamweaverMX定义站点的方法，能根据自己的实际情况定义站点，定义ASP站点，掌握通过DreamweaverMX软件连接简单数据库的方法。

第三章 文本及其格式化 1．文本及其格式化概述 2．文本的输入 3．创建文本列表 4．CSS样式文件的创建

5．将文档中的样式导出为CSS样式文件 6．文本格式化综合实例

要求：学习如何插入文本、设置字体类型、大小、颜色和对齐属性，使用层叠样式表创建和应用自定义样式。通过学习掌握利用CSS样式格式文本，掌握导出和使用CSS样式文件的基本方法。

第四章 图像

2学时

2学时

1．常用图像文件格式 2．插入图像 3．设置图像的属性

要求：通过学习，学生必须完全掌握如何在DreamweaverMX软件中插入图像、修改图像的属性，利用外部图象处理软件编辑图像以及创建图像地图等方法。实现图像与文本的完美结合。

第五章 表格 1．概述

2．表格的基本操作 3．表格及其属性设置 4．表格排序

要求：掌握使用DreamweaverMX建立表格、设置表格以及使用表格对网页进行布局和美化。通过表格定位文本和图像在页面出现的位置。对表格的修改主要是添加内容、修改表格或单元格行/列属性，复制或者粘贴多个单元格等操作。

第六章 框架 1．创建框架

2．框架和框架页的基本操作

3．设置框架和框架页的属性、大小及背景色

2学时

2学时 4．框架及框架页综合实例

要求：掌握框架的创建、保存以及框架属性的设置，难点在于框架的链接设置，掌握框架结构的主要功能在于导航。注意框架和框架集的区别。

第七章 页面布局视图的使用

1．布局单元格和布局表格 2．绘制布局表格和布局单元格 3．布局表格和布局单元格的基本操作

4．设置布局宽度

要求：重点掌握如何创建布局表格和布局单元格，掌握布局视图的切换方法，掌握布局表格和布局单元格属性的设置和意义。

第八章 链接

3学时

3学时

1．链接、路径与锚

2．建立链接 3．建立特殊链接

要求：了解链接、路径与锚的使用条件、掌握链接的几种设置方法和他们的区别，学会使用特殊链接（书签、电子邮箱、网站URL）,理解掌握链接目标的指定。

第九章 表单 1．表单概述 2．创建表单 3．表单对象 4．客户注册表单 5．网上调查表单

要求：掌握如何创建表单，以及如何在表单中添加表单对象，掌握常见的表单对象的功能和使用方法，理解表单处理的原理，能够完成基本的表单设计。

第十章 层

1．关于层

2．创建层

3．显示隐藏层实例

4．下列菜单实例 5．层综合应用实例

要求：让学生掌握层的概念和层的分类，掌握关于层的属性，掌握建立层的基本方法，掌握层的各种属

2学时

2学时 性的设置。

第十一章 行为

1．什么是行为

2．行为面板的用法

3．行为的基本操作

4．使用Dreamweaver自带的行为

5．行为应用实例

要求：重点掌握DreamweaverMX自带的行为的使用方法，掌握这些常用行为事件的设置，了解行为的意义以及行为面板的使用方法，能根据具体的行为设置对应的行为事件，能对所使用的行为事件进行修改。

第十二章 时间轴与动画

1．时间轴面板

2．使用时间轴创建动画

3．修改时间轴

4．创建录制路径动画 5．在时间轴中改变对象属性

6．在时间轴中使用行为

7．时间轴动画实例

要求：掌握如何使用时间轴创建时间线动画，重点掌握如何修改时间线及其对象的属性，添加和删除祯、修改动画的起始时间、修改动画路径的位置等。

第十三章 Dreamweaver MX程序设计

1．Dreamweaver MX程序设计基础 2．建立数据库连接 3．定义记录集

4．动态数据绑定 5．应用服务器行为

要求：掌握基本的术语和如何建立数据库连接，掌握如何建立记录集，以及记录集中数据的绑定，了解各类服务器行为的功能，重点掌握如何定义记录集和应用服务器行为，掌握WEB应用程序的构建。

第十四章 模板与库

1．什么是模板和库

2．创建模板

3．定义可编辑区域

2学时

2学时

2学时

2学时 4．应用模板建立网页 5．应用模板更新站点 6．库的使用

7．模板的创建与设置实例

要求：掌握模版和库的原理和优势，掌握掌握如何建立和使用模版，掌握库的使用和添加到库文件。第十五章 代码片断

1．使用代码片断 2．代码片断的创建

3．代码片断的使用

4．代码片断的创建与使用综合实例

要求：理解代码片断的概念，掌握创建代码片断的方法，掌握如何使用代码片断。第十六章 经典实例

1．个人网站 2．网站论坛

要求：了解页面的整体设计，掌握表格的高级应用技巧，了解交互网站的运行机制，掌握服务器行为的应用，学生通过锻炼，掌握创建网站的全部过程和机制，能够独立网站一个小型的全面的个人网站。

4学时

2学时

三、教学方法

要求：

1、结合DreamweaverMX软件使用的特点，以上机演示教学方法为主，辅之教学课件等方法进行教学。

2、结合本学科特点在教学过程中，使学生形成多动手、积极探究、勤于思考、学会学习等良好的学习习惯，培养学生搜集和整理素材的能力、理解实验能力、分析和解决程序设计中的问题的能力等。

四、成绩考核方法：

要求：

1、课后试验作业每周一次。

2、期末考试采取理论考试为主、大作业（完整的个人网站）为辅的形式。

3、平时成绩30%、期末成绩70%，期末考试（笔试70%，大作业30%）。

五、教材与主要参考书目

教材：

路甬祥：《DreamweaverMX职业技能培训教程》，电子科技大学出版社，2004年3月。参考书： 位元文化：《CSS/HTML网页设计》，中国铁道铁道出版社，2002年2月。

刘洪武：《网页设计与制作（高职教材）》，大连理工大学出版社，2003年7月。李卓玲：《java程序设计语言》，大连理工大学出版社，2003年8月。

执笔人： 审订人：

第五篇：网页设计与制作教学大纲

网页设计与制作教学大纲

(供医学影像学、护理学本科各专业用)

前 言

《网页设计与制作》是一门应用性和理论性都很强的课程，是医学影像和护理学专业的选修课程。通过学习本课程使学生初步了解网页制作及建立网站的基础知识，掌握制作网页和建立网站的技术。

总学时：18学时，实际教学中采用理论教学中穿插上机实践。

第一章 网页设计基础知识

一、目的和要求

(一)了解Internet的功能

(二)理解WWW和网页、网站的相关概念(三)了解常用的网页制作工具(四)理解建设网站的基本方法和思路

二、教学内容

(一)网页基本概念:了解网页、网站、万维网（www）、浏览器、统一资源定位符（URL）、IP地址、域名、超级链接、静态网页和动态网页的基本概念。

(二)网页设计的相关知识

1、设计网页的原则: 了解网页设计的基本原则。

2、网页设计的一般步骤:了解网页设计的一般步骤。

3、Web服务器架构:了解Web服务器的概念、会建立IIS，会进行Web站点的设置与管理。

4、网页制作的常用工具:了解Frontpage、Macromedia Dreamweaver、记事本；了解图像处理工具Photoshop,Firework，了解动画制作工具：Macromedia Flash等。

5、客户端技术：了解HTML、DHTML、XML的概念。

6、服务器端技术：了解ASP、PHP、Java的概念。

第二章 HTML语言

一、目的和要求

(一)熟悉HTML标记语言的基础知识；(二)熟悉HTML语法基础；

(三)掌握文本格式标记、列表标记、表格标记、表单及表单控件标记，熟练利用标记编写页面代码；(四)掌握超链接、图像、音乐及流动字幕的设置方法。

二、教学内容

(一)HTML语言基本概念：了解HTML、超文本、Web页的概念。(二)HTML文档架构:掌握HTML文档基本架构。(三)

HTML常用标记

1、掌握文本格式标记：,,,。

2、掌握段落格式标记：,,

5、掌握多媒体标记：,,。

7、掌握超链接标记：。

8、掌握表格标记：

9、掌握框架标记：。

10、掌握表单及表单域标记：

第三章 Dreamweaver 8网页设计

一、目的和要求

(一)熟悉Dreamweaver 8操作界面；(二)掌握Dreamweaver 8建立与管理站点；

(三)掌握如何使用Dreamweaver 8对文本、图像、表格进行插入与编辑；(四)掌握如何使用Dreamweaver 8创建超链接、表单、样式表；(五)掌握如何在Dreamweaver 8中使用层与框架。

二、教学内容

(一)Dreamweaver 8基础知识:会启动、关闭中文Dreamweaver 8，了解Dreamweaver 8的功能、主窗口，标题栏、菜单栏、工具栏、网页编辑窗口、状态栏、属性面板、浮动控制面板组。

(二)站点的建立：熟练掌握利用Dreamweaver 8建立站点、管理站点。

(三)Dreamweaver 8页面设计: 熟练掌握利用Dreamweaver 8插入文字、插入图像、插入表格、插入超链接、插入媒体元素、插入表单，会使用样式表控制页面格式。

(四)页面布局:熟练掌握利用表格控制页面布局，会使用框架进行特殊的页面布局，了解利用层实现页面布局。

第四章 VBScript脚本语言

一、目的和要求

(一)了解VBScript的基本概念；(二)熟练掌握VBScript语法；

(三)熟练掌握VBScript的sub过程与function函数；(四)会使用VBScript进行简单编程。

二、教学内容

(一)VBScript的基本概念

1、了解在网页中如何嵌入VBScript。、了解VBScript语句书写规则、数据类型、变量、常量、运算符和内置函数的概念。(二)

VBScript的过程与函数

1、熟练掌握VBScript中SUB过程的建立。

2、熟练掌握VBScript中FUNCTION（）函数的使用。

（三）程序设计流程:了解条件语句和循环控制语句

（四）VBScript对象的使用：掌握Window对象、History对象、Form对象的语法格式及使用方法。

并利用案例熟悉对象。

第五章 ASP动态网页制作

一、目的和要求

(一)深刻理解动态网页技术和静态网页技术的区别和联系。(二)掌握ASP运行环境的搭建方法及建立ASP动态网站的一般方法。(三)理解Request和Response对象的作用，熟练掌握其使用方法。(四)

能够综合运用网页设计方法创建动态网站。

二、教学内容

(一)ASP概述：了解ASP的概念，ASP的工作过程，ASP与HTML的区别。(二)

ASP动行环境：IIS的安装，IIS下站点的建立与管理。

(三)ASP的内建对象：掌握Request对象，Request对象可访问的变量Querystring、form、cookies和server variable；掌握Response对象，Response对象提供的方法write,redirect,end的使用。

(四)ASP动态网站的创建：利用ASP技术验证表单中用户填写的信息。

第六章 网站制作实例

一、目的和要求

(一)巩固Dreamweaver 8中网站设计的基本方法；(二)巩固编制HTML和ASP代码的方法；(三)综合运用所学知识设计制作小型网站。

二、教学内容

(一)网站的规划设计：确定网站的主题和名称，确定网站的形象，确定网站的栏目，确定网站的目录结构，确定网站的链接结构，网站的整体风格，首页的设计，站点的创建。(二)

静态网页设计(三)

动态网页设计

教材：李京文主编，网页设计与制作，高等教育出版社，2012。

李京文主编，网页设计与制作实训与考试指导，高等教育出版社，2012。

参考书：曾鸿主编，网页设计与制作高等教育出版社，2009。