静态网页设计制作教学大纲教案.docx

《静态网页设计制作教学大纲教案.docx》由会员分享，可在线阅读，更多相关《静态网页设计制作教学大纲教案.docx（51页珍藏版）》请在优知文库上搜索。

1、XXXX学院静态网页设计制作教学大纲课程中文名称：静态网页设计制作课程英文名称：Staticwebdesignproduction课程号：Sl107202课程属性：专业限选课总学时：50学时学分：2学分面向对象：计算机专业大学专科编写:审核:审定:XXXX学院教学委员会（学院章）2023年1月静态网页设计制作教学大纲第一部分大纲说明一、课程性质与任务静态网页设计制作课程是计算机与数据工程学院计算机和大数据专业的公共基础课。通过本课程的学习，使学生了解静态网页设计制作的基础知识，掌握静态网页设计制作的应用操作技能，学会利用静态网页设计制作基本方法，培养学生静态网页设计制作素养和制作水平，提高学生

2、解决静态网页设计制作实际问题的能力。二、教学对象计算机专业大学本科。三、教学目的和要求本课程是一门技术性、实践性和实用性很强的课程，教学过程中要坚持“精讲多练”的指导思想，综合运用案例式、任务驱动式、项目式、研讨式、启发式等多种教学方法，充分利用网络、多媒体等现代教学手段，通过理论讲授、实例操作演示、上机实验等环节，培养学生的静态网页设计制作应用能力、自主学习能力、独立思考能力和开拓创新能力。通过本课程的学习，了解DreamWeaVer2021的基础知识和应用技巧；了解Dreamweaver2021的特点和功能；熟练掌握DrCamWeaVCr2021制作静态、动态网页网站的方法与技巧；结合实例

3、讲解掌握网站开发的实践能力。四、先修课程本课程的先修课程是计算机应用基础。五、使用教材及参考资料使用教材：赵健、胡仁喜.静态网页设计制作，北京：电子工业出版社，2022.1参考资料：1 .胡汉辉孔岚.静态网页设计与制作.ISBN：9787111363415.北京：机械工业出版社，20162 .李妍郭峰柴俊霞.Web静态网页设计与排版.ISBN：9787302419471.北京：清华大学出版社，20163 .任长权李可强闫踏飞.静态网页制作技术教程.ISBN：9787113233990.北京：中国铁道出版社，2017六、教学形式、教学方法及实践性环节教学形式：理实一体化教学方法：讲授与上机实验结

4、合七、考核考核形式：上机考试；试卷结构：单项选择题、判断题、操作题。成绩评定：期末考试（80%）,平时考核（20%）；八、课时分配表总学时：50学时章目教学内容教学课时项目一Dreamweaver2021概述4项目二HTML与CSS基础6项目三构建本地站点4项目四文本与图像4项目五制作超链接4项目六制作多媒体网页4项目七用表格规划网页4项目八Div+CSS布局4项目九应用表单4项目十模板与库4项目十一Dreamweaver2021的内置行为4项目十二时尚资讯网站设计综合实例4合计50九、教学进度表周次学时教学内容第一周4项目一DreamWeaVer2021概述任务1DrCamWCaVer202

5、1窗口组成任务引入知识准备一、菜单栏二、文档工具栏三、通用工具栏四、“插入”面板五、文档窗口六、“属性”面板七、浮动面板组任务2文件操作任务引入知识准备一、打开文件二、创建文件三、存储文件四、设置文档属性项目总结项目实战实战一认识DrCanlWCaVer2021界面实战二新建HTML文件并保存第二周3项目二HTML与CSS基础任务1HTML基础任务引入知识准备一、HTML语言概述二、HTML的语法特性任务2常用的HTML标签任务引入知识准备一、文档的结构标签二、注释标签三、文本格式标签四、排版标签五、列表标签六、表格标签七、表单标签八、其他标签第三周3项目二HTML与CSS基础任务3CSS基础

6、任务引入知识准备一、CSS概述二、CSS样式表的组成任务4CSS设计器任务引入知识准备一、创建和附加样式表二、定义媒体查询三、定义CSS选择器四、设置CSS属性综合案例CSS样式的应用项目总结项目实战实战一编写网页文件实战二用CSS样式控制文本样式第四周2项目三构建本地站点任务1站点概述任务引入知识准备一、Internet服务器和本地计算机二、本地站点与远端站点任务2构建本地站点任务引入知识准备任务3管理本地站点和站点文件任务引入知识准备一、管理站点二、操作站点文件或文件夹第五周2项目三构建本地站点任务4站点发布任务引入知识准备一、配置远程站点二、上传、下载与同步更新项目总结项目实战实战一在本

7、机上创建站点bz实战二为创建的站点设置服务器第六周4项目四文本与图像任务1在网页中插入文本任务引入知识准备一、插入文本二、设置文本属性三、创建列表项四、插入日期任务2在网页中插入图像任务引入知识准备一、关于图像二、插入图像三、图像的属性四、修改图像尺寸五、创建翻转图像六、设置背景图像项目总结项目实战实战一在网页中插入文本和日期实战二在网页中插入图像和文字第七周4项目五制作超链接任务1认识超级链接任务引入知识准备任务2制作、管理超链接任务引入知识准备一、创建文本超链接二、创建图像链接三、链接到命名锚点四、创建E-Mail链接五、虚拟链接和脚本链接六、使用“URLs”面板管理超链接任务3使用热点制

8、作图像映射任务引入知识准备综合实例文本与链接网页实例项目总结项目实战实战一创建脚本链接实战二制作图像映射第八周4项目六制作多媒体网页任务1添加声音任务引入知识准备一、关于声音二、链接到音频文件三、嵌入音乐文件任务2HTML5多媒体任务引入知识准备一、插入HTML5视频二、设置HTML5视频属性三、插入HTML5音频四、设置HTML5音频属性任务3FlaSh对象任务引入知识准备一、添加Flash动画二、插入FIaSh视频内容三、修改FlaSh视频属性项目总结项目实战实战一在网页中添加声音实战二插入FIaSh视频第九周4项目七用表格规划网页任务1创建表格任务引入知识准备一、创建表格、单元格二、创建

9、嵌套表格任务2表格操作任务引入知识准备一、选定表格对象二、设置表格和单元格属性三、扩展表格模式四、增加、删除行或列五、拆分、合并单元格六、在表格中添加内容七、复制、粘贴单元格八、导出/导入表格数据九、表格排序综合案例利用表格布局页面项目总结项目实战实战一创建表格和嵌套表格实战二对表格进行排序第十周2项目八Div+CSS布局任务1Div+CSS概述任务引入知识准备任务2CSS盒模型任务引入知识准备一、CSS盒模型简介二、常用的盒模型属性任务3CSS层叠顺序任务引入知识准备一、外部样式二、内部样式三、行内样式四、导入样式第十一周2项目八Div+CSS布局任务4CSS布局块任务引入知识准备一、创建d

10、iv标签二、编辑div标签三、可视化CSS布局块任务5常用CSS布局版式任务引入知识准备一、一列布局二、两列布局三、三列布局综合案例DiV标签应用实例项目总结项目实战实战一制作简易公告栏实战二利用CSS规则隐藏布局块第十二周4项目九应用表单任务1创建表单网页任务引入知识准备一、插入表单二、文本字段和文件域三、选择框四、单选按钮与复选框五、按钮六、图像按钮七、隐藏域任务2处理表单任务引入知识准备项目总结项目实战实战一文档中插入文本字段实战二在文档中插入复选按钮组第十三周2项目十模板与库任务1模板任务引入知识准备一、“模板”面板二、建立模板三、定义可编辑区域四、定义重复区域五、定义可选区域六、定义

11、嵌套模板七、应用模板创建文档八、应用模板到页九、修改模板并更新站点十、管理模板第十四周2项目十模板与库任务2库任务引入知识准备一、库面板二、创建及使用库项目三、操作库项目综合案例模板与库的应用项目总结项目实战实战一在模板文档中插入可选区域实战二制作版权声明第十五周2项目十一DreamWeaVer2021的内置行为任务1行为概述任务引入知识准备一、事件与动作二、“行为”面板三、附加行为到页面元素四、编辑行为任务2Droamwoaver2021的内置行为任务引入知识准备一、调用JavaScript二、改变属性三、检查插件第十六周2项目十一DreamWeaVer2021的内置行为四、jQuery效果

12、五、转到URL六、交换图像/恢复交换图像七、弹出信息八、打开浏览器窗口九、显示-隐藏元素十、检查表单十一、设置文本十二、预先载入图像项目总结项目实战实战一为网页按钮调用JaVaSCriPt行为实战二改变标签的属性第十七周2项目十二时尚资讯网站设计综合实例任务1网站概述任务引入知识准备一、网站介绍二、准备工作任务2制作模板任务引入知识准备一、设计基本布局二、制作导航菜单三、插入模板元素四、制作嵌套模板第十八周2项目十二时尚资讯网站设计综合实例任务3制作库文件任务引入知识准备任务4制作网站主页任务引入知识准备任务5制作其他页面任务引入知识准备项目总结项目实战实战一制作旅游网站首页实战二制作儿童教育

13、网站十、主讲教师：XXX（教授）、XXX（副教授）、XXX（副教授）、XXX（副教授）、XXX（副教授）、XXX（副教授）、XXX（讲师）、XXX（讲师）、XXX（讲师）、XXX（讲师）、XXX（讲师）、XXX（助教）等。第二部分教学内容项目一DreanlWeaVer2021概述教学目的和要求熟悉DreamWeaVer2021的启动方法；熟悉DreainWeaVer2021的工作界面;掌握DreamweaVer2021的文件操作。教学重点、难点重点：（1） Dreamweaver2021窗口组成。（2）文件操作。难点：（1）认识DreamweaVer2021界面。（2）新建HTML文件并保存。教学内容任务1Dreamweaver2021窗口组成任务引入知识准备一、菜单栏二、文档工具栏三、通用工具栏四、“插入”面板五、文档窗口六、“属性”面板七、浮动面板组任务2文件操作任务引入知识准备一、打开文件二、创建文件三、存储文件四、设置文档属性项目总结项目实战实战一认识Dreamweaver2021界面实战二新建HTML文件并保存项目二HTML与CSS基础教学目的和要求了解HTML语法的3种表达方式；熟悉HTML中常