(完整版)《网页设计与制作》课程教学大纲.docx

《网页设计与制作》课程教学大纲课程名称：网页设计与制作学分及学时：4 学分 总学时 72 学时，理论 36 学时适用专业：网络工程开课学期：第四学期开课部门：计算机与互联网学院先修课程：计算机文化基础 计算机网络考核要求：考试使用教材及主要参考书：向知礼主编：《网页设计与制作》 航空工业出版社 2017 年杨松主编：《网页设计案例教程》 航空工业出版社 2015 年一课程性质和任务：本课程全面地介绍网页制作技术的基本理论和实际应用全书共 10 章，分为 3 大部分前 5 章为第 1 部分，主要介绍网页制作的基本理论——HTML，同时穿插介绍 Fireworks， Flash，Anfy 等软件在网页制作过程中的应用；第 6 章～第 8 章为第 2 部分，主要介绍网页制作技术，包括 CSS 技术、客户端脚本技术(DHTML)以及 XML 技术；第 9 章～第 10 章为第 3 部分，主要介绍当前最流行的网页制作工具——Dreamweaver，通过应用实践能够从实际应用的角度进一步巩固所学知识课程内容不但包括各种网页制作技术的基础理论，而且强调网页制作的具体应用，使读者既能打下坚实的理论基础，又能掌握实际的操作技能。

二课程教学目的与要求以 Dreamweaver 的使用为主线，介绍网页制作的相关技术使学生理解网页制作的基本概念和理论,掌握站点的建立和网页的设计,能用 HTML 语言修改网页;掌握网页制作和站点的基本知识;掌握站点的创建和网页的编辑;掌握超链接、图像、CSS 样式的使用;掌握表格、框架、表单、多媒体对象的使用;理解行为、模板、库、CSS 布局的概念和使用;理解 HTML 语言、网站的测试与的发布；要求：教学过程中，须注重学生实践操作能力的培养，采取“面向实践、能力为先”的教学思路，教学内容应结合当前 WEB 技术的发展趋势，把握未来企业级 WEB 页面开发的发展方向，兼顾各行各业的需求变化，力争面向社会，服务于企业“互联网+”战略章节教学内容理论教学实践教学学时其他（习题、大作小计三、课程学时分配项目一网页设计与制作基础知识学时2实验4业）学时6项目二网站创建与管理44项目三创建简单图文网页4610项目四为网页设置音视频和超链接22项目五应用 CSS 设置网页样式246项目六构建网页布局4610项目七在网页中应用表格246项目八模板和库的应用22项目九应用表单和行为22项目十测试和发布网站22项目十一创建移动设备网页4610项目十二综合应用——制作酒店网站6612合计363672四课程教学中应注意的问题理论课讲解 WEB 页面开发的原理及方法，并在多媒体教师机上进行演示操作；实验课在专业机房协助学生解决课上遗留问题，并安排学生进行实践操作巩固学习效果；考核方法：期终考试占 40％，实验成绩 20％，平时成绩和作业占 40％。

项目一 网页设计与制作基础知识学习目标案例一 指出当当网主页的构成元素——认识网页和网站案例说明相关知识一、网页、网站和主页二、网页的构成元素 三、网页的本质案例实施案例二 了解网页设计与制作岗位职责——网页设计基础案例说明相关知识一、网页颜色的选择与搭配二、网页版式设计五课程教学内容三、网页尺寸案例实施案例三 企业网站建设基本流程——网站建设基础案例说明相关知识一、Internet，IP 地址和域名二、WWW，URL，HTTP 和浏览器三、HTML 与 CSS 简介四、网站管理与网页制作相关软件案例实施项目总结项目二 网站创建与管理学习目标案例一 调整Dreamweaver CC 2017 工作界面——初识DreamweaverCC 2017案例说明相关知识一、启动 DreamweaverCC二、认识 DreamweaverCC 工作界面案例实施案例二 设置企业网站栏目结构和目录结构案例说明相关知识一、设计网站栏目结构二、创建网站目录结构案例实施案例三 创建企业网站本地站点——站点基本操作案例说明相关知识一、使用 Dreamweaver 创建和打开本地站点二、使用 Dreamweaver 管理本地站点案例实施案例四 为企业网站制作欢迎页面——网页文档基本操作案例说明相关知识一、网页文档基本操作二、“文件”面板基本应用案例实施拓展知识一、网页文档和文件夹命名规则二、HTML 的标签构成三、HTML 网页文档的基本结构项目总结课堂实训——创建鲜花导购网站本地站点项目三 创建简单图文网页学习目标案例一 为企业网站新闻显示网页设置页面基本信息——设置网页基本信息案例说明相关知识一、设置文档头信息 二、设置网页页面属性案例实施案例二 为企业网站新闻显示网页设置文本内容——设置网页文本案例说明相关知识一、添加普通文本二、插入特殊符号三、添加空格四、添加与设置水平线五、创建列表案例实施拓展知识列表在 HTML 中的表示案例三 为企业网站新闻显示网页设置图像——设置网页图像案例说明相关知识一、插入与编辑图像 二、插入鼠标经过图像案例实施拓展知识一、网页中可用的图像格式二、图像在HTML 中的表示项目总结课堂实训——为鲜花导购网页设置文字和图像内容项目四 为网页设置音视频和超链接学习目标案例一 制作音视频播放页面——在网页中插入HTML 5 音视频案例说明相关知识一、插入 HTML5 Audio 二、插入 HTML5 Video 三、插入并编辑插件 案例实施拓展知识一、HTML5 Audio 和Video 所支持的音频和视频格式二、为网页设置背景音乐案例二 为企业网站新闻显示网页设置超链接——设置超链接案例说明相关知识一、超链接的含义和分类二、设置常规超链接三、设置热点链接四、设置电子邮件链接五、设置文件下载链接六、设置图像链接案例实施项目总结课堂实训——为“鲜花导购网页”设置超链接项目五 应用 CSS 设置网页样式学习目标案例一 为企业网站新闻显示网页设置整体样式——设置CSS 样式（上） 案例说明相关知识一、CSS 样式表简介二、在页面中引入CSS 样式表的几种方法三、CSS 中选择器的类型四、设置布局样式五、设置文本和段落样式六、设置背景样式七、盒子模型的概念案例实施拓展知识一、选择器的集体声明、嵌套与优先级二、选择器的继承案例二 为企业网站新闻显示网页设置页头样式——设置CSS 样式（中） 案例说明相关知识一、设置边框样式二、标准流的概念案例实施案例三 为企业网站新闻显示网页设置正文样式——设置CSS 样式（下） 案例说明相关知识一、设置列表样式二、margin 使用注意事项案例实施项目总结课堂实训——为“鲜花导购网页”设置CSS 样式项目六 构建网页布局学习目标案例一 构建企业网站新闻列表网页整体布局——浮动布局案例说明相关知识一、Div 基础二、HTML5 结构元素三、float 和 clear 属性四、浮动布局的原理五、常用的浮动布局方法六、清除浮动对布局的不良影响七、浮动布局应用技巧案例实施一、构建 HTML 结构二、设置 CSS 样式案例二 制作企业网站新闻列表网页的页头部分案例说明案例实施一、构建 HTML 结构二、设置 CSS 样式案例三 制作企业网站新闻列表网页的新闻中心栏目案例说明案例实施一、构建 HTML 结构二、设置 CSS 样式案例四 制作企业网站新闻列表网页的集团要闻栏目案例说明案例实施一、构建 HTML 结构二、设置 CSS 样式项目总结课堂实训——制作博客网站首页项目七 在网页中应用表格学习目标案例一 创建 2018 世界杯亚洲区预选赛 40 强分组表——构建和美化表格案例说明相关知识一、创建表格二、表格的HTML 标签三、使用 CSS 设置表格和单元格属性案例实施一、构建 HTML 结构二、设置 CSS 样式案例二 制作化学实验分组表——编辑表格案例说明相关知识一、拆分与合并单元格二、在表格中添加或删除行与列三、使用 CSS 设置表格内边距和外边距四、使用 CSS 合并表格边框案例实施一、构建 HTML 结构二、设置 CSS 样式项目总结课堂实训——制作月历项目八 模板和库的应用学习目标案例一 创建并应用模板制作新闻显示页面——模板基本操作案例说明相关知识一、创建模板二、编辑模板三、应用模板四、管理模板案例实施一、创建模板二、应用模板案例二 创建并应用库项目制作新闻显示页面——库的基本操作案例说明相关知识一、创建库项目二、应用库项目三、编辑库项目案例实施一、创建库项目二、应用库项目制作网页项目总结项目九 应用表单和行为学习目标案例一 应用表单制作“欢乐购”注册页面——应用表单和表单对象案例说明相关知识一、表单基础知识二、插入表单三、插入表单元素案例实施一、构建 HTML 结构二、设置 CSS 样式案例二 应用行为为学校网页添加弹出框——应用行为案例说明相关知识一、认识行为二、“行为”面板三、应用行为四、编辑行为案例实施项目总结项目十 测试和发布网站学习目标案例一 检查和测试企业网站——测试网站案例说明相关知识一、检查网页链接二、修复网页链接案例实施案例二 申请域名和虚拟空间——域名和虚拟空间案例说明相关知识一、域名二、虚拟空间案例实施案例三 发布企业网站——发布网站案例说明相关知识一、连接服务器二、上传网站 三、下载网站四、使用扩展“文件”面板管理文件上传和取回案例实施项目总结项目十一 创建移动设备网页学习目标案例 创建“不一样的北京”移动设备网页——使用jQuery Mobile案例说明相关知识一、初识jQueryMobile二、创建jQueryMobile 页面三、jQueryMobile 页面结构四、使用jQueryMobile 组件五、使用jQueryMobile 主题案例实施一、新建文档二、制作主界面三、制作子页面项目总结项目十二 综合应用——制作酒店网站案例一 站点规划和创建案例说明案例实施案例二 制作网站首页案例说明案例实施一、搭建页面整体框架二、制作网页头部三、制作“会员登录”模块四、制作“客房预订”模块五、制作“酒店新闻”模块六、制作网站信息区案例三 制作网站子页案例说明案例实施撰写人：审核人：学院院长：。