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

《网页设计与制作》课程教学大纲课程名称：网页设计与制作学分及学时：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页面开发的发展方向，兼顾各行各业的需求变化，力争面向社会，服务于企业“互联网+”战略。

三、课程学时分配四·课程教学中应注意的问题理论课讲解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主题案例实施一、新建文档二、制作主界面三、制作子页面项目总结项目十二综合应用——制作酒店网站案例一站点规划和创建案例说明案例实施案例二制作网站首页案例说明案例实施一、搭建页面整体框架二、制作网页头部三、制作“会员登录”模块四、制作“客房预订”模块五、制作“酒店新闻”模块六、制作网站信息区案例三制作网站子页案例说明案例实施撰写人：审核人：学院院长：。