《Web开发技术》教学大纲.docx

《《Web开发技术》教学大纲.docx》由会员分享，可在线阅读，更多相关《《Web开发技术》教学大纲.docx（6页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、Web开发技术课程教学大纲一、课程概述课程名称Web开发技术英文名称Web development technology课程性质考查课程代码22124023总学时理论32学时实验8学时学分2开课学期第四学期先修课程程序设计基础、面向对象程序设 计、计算机导论适用专业计算机科学与技术开课单位计算机与电气工程学院二、课程简介Web开发技术是一门综合性、实践性较强的课程，是面向计算机科学与技术专业 开设的一门重要专业选修课，也列入该专业培养方案的主干课程群。本课程是随着计算机 科学及互联网技术的发展而逐步形成的一门新兴的语言类课程，形成于二十一世纪初，是 研究HTML元素结构、形式及相互关系的学科。

2、随着WEB应用的发展，用户交互式应用越来 越普及，网页用户交互页面不但要体现良好视觉效果，还对交互体验提出了更高要求。课 程在教给学生HTML文件基本结构、表格表单、框架和CSS等技术知识的同时，重点培养学 生的实践动手能力，并具有运用所学的知识与技能培养学生页面结构设计能力与外观修饰 能力。三、课程目标Web开发技术是面向计算机科学与技术专业的主干课程，具有概念多、技能性较 强、操作实验强度要求高、应用广泛的特点。本课程主要讲授HTML和Web标准以及HTML 文件基本结构、复杂网页设计及制作等方面的基础知识。通过本课程的学习，不仅使学生 掌握进一步学习其他课程所必需的前端用户界面设计知识，

3、而且可培养学生使用WEB前端 设计知识在基于B/S应用系统设计过程中分析问题与解决实际问题的能力。课程教学基本要求如下:课程目标1:具备网页用户界面设计的形象思维能力、结构设计能力、建模能力；(支撑毕业目标3.3)课程目标2：具备运用前端设计工具及方法构建Web站点和APP界面等解决具体问题的能力；(支撑毕业目标9.2)课程目标3：具备运用前端设计工具及方法，培养学生的创新意识，设计特色网页。(支撑毕业目标1L3)四、课程目标对毕业要求指标点的支撑表4-1课程目标对毕业要求指标点的支撑毕业要求毕业要求指标点课程目标1233设计/开发解 决方案3.3能基于设计结果实现满足特定需求的计算机软/硬件

4、功能模 块连接和系统设计，并在设计过程中体现创新意识；M9个人和团队9.2能够在团队中独立或合作开展工作；L11项目管理11.3能够在多学科环境下，将工程管 理与经济决策方法应用于 计算机应用系统的设计、开发与实施的各环节。L五、教学内容及实施手段表5教学内容与进度要求教学 章节小节内容要求具体要求学生成果课程 目标学时掌握HTML文档结构元素(1) 了 解 Internet 与万维网的概念1. 了解HTML静态网HEAD 和 BODY,能构建 符合规范的 HTML文档， 并在浏览器正 确显示；掌握 HEAD 中 META的使用绪论(2)HTML 、 CSS 与 JavaScript 的概念

5、与特点(3) 了 解 HTML5 与认 知页结构2 .掌握HTML网页布 局。3 . 了解HTML基本语课程 目标12 学CSS3的概念与 特点法以及常用标签时方法，掌握标记对应的使用；(4)掌握任意一款认知1.编辑HTML内容，掌握HTML中课程开发工具，并进行包含文字效果，文字修常见的格式标目标相关练习饰和段落记，并能在网1页设计熟练运 用这些标记对 网页进行排 版；二. HTML5 基础(DHTML5的基本结 构(2) HTML5中元素标 签的作用(3)HTML5中文档注 释的用法理 解L了解列表的定义和常 用列表的分类。2 .掌握定义列表基本语 法，理解定义列表与无 序、有序列表的外在

6、表 现上的差异3 .学会使用列表type属 性的改变列表的符号 样式。4 .掌握有序列表基本语 法0学会使用列表type、 start属性的改变列表的 编号样式5 .了解使用有序列表项 value属性改变列表项 编号设计熟练运 用这些标记 对网页进行 排版；课程 目标22 学 时(4) HTML5中保留的 常用标签的用法 (5)IITML5中新增的 文档结构标签的用 法(6)HTML5中新增的 格式标签的用法理 解6 .容器标签的使用通过对容器标 签等新增标签 的使用使学生 对整体布局有 了新的体验课程 目标2三.HTML5 标签的使 用(1) HTML5中超链接 标签(2) HTML5中图像

7、 IMG的运用认 知1 .掌握超链接A的表示 方法，并能使用它表示 指向其它网页、文件的 链接形式；学习文本链 接、图像链接及热区的 创建。2 .掌握网页设计图像 IMG的运用，背景图像、 不同格式的图像在网 页设计中的作用，图像 链接；1.让学生了解 超链接的书写 方法。2.通过 超链接的设 置，让学生初 步掌握获取交 互式信息的方 法。3.通过插 入超链接，制 作实现自由跳 转的到各个页 面。课程 目标12 学 时(3) HTML5中相对路认4.初步了解规划超链掌握网页设计图课程径和绝对路径 的区别知接的路径问题，掌握相 对路径和绝对路径的 区别。5 .通过超链接的设 置，实现网页内容的自

8、 由跳转。6 .掌握图像超链接的 基本语法及创建方法。像IMG的运用， 背景图像、不同 格式的图像在网 页设计中的作 用，图像链接；目标2四,表格 基础(1)掌握HTML中 表格工具TABLE 的使用，并规范网 页的数据显示认知1 .掌握使用表格布局 网页。2 .灵活掌握表格调整 的方法。3 .设置表格行与单元 格。4 .初步了解表格合并 的基本方法。5 .熟练掌握细线表格实现表格在网页 中的应用课程 目标22 学 时五.表单 基础(1)熟练掌握表单 Form的设计(2)对文本框、按 钮、下拉列表、单 选和复选按钮等多 种表单元素能熟练 运用熟 悉1 .掌握网页中插入 表单并设置各种属 性。2

9、 .掌握网页中插入 各种列表标记的使 用。3 .掌握框架网页的 建立方法。4 .练习使用表单，包 括其 action 及 method 属性，6 .熟练掌握单选框、 复选框和按钮等内容练习使用表 单中的元素， 包括文本框、 列表框、文本 域，让学生掌 握多个对话 框的相关应 用课程 目标22 学 时六.多媒 体标签(DHTML5音频和 视频(2)HTML5支持的 格式熟 悉1 .掌握嵌入多媒体的 技术。2 .理解不同音频与视 频在不同浏览器上的 兼容性问题。3 .设置占位图片 跑马灯marquee标签 的使用。4 .插入多媒体文件。课程 目标25.添加背景音乐4s. css 基础(i)css基

10、本语法 (2)CSS的选择器 及CSS复合选择 器理 解1 .掌握层叠样式表 CSS的基本概念、语 法，熟练掌握常见 CSS的属性及值的写 法；2 .掌握如何在网页中 使用三种不同的形式 调用样式表；3 .掌握HTML标签选 择器、类选择器、ID 选择器以及伪类选择 器和对象选择器的使 用，掌握CSS的复合 选择器的使用；能够熟练使 用CSS元素 对网页中元 素的外观进 行控制课程 目标12 学 时(3)CSS的继承性(4) CSS的属性及 值(5)如何在网页中 应用CSS样式掌 握4.掌握CSS中的继 承概念；掌握CSS盒 子模型的相 关概念，使用 CSS+DIV 技术进行网 页布局的设 计

11、课程 目标3八.CSS3 技术(DCSS3边框和 背景效果(2)CSS3文本和 字体效果(3)CSS3变形与 动画效果认 知1 . CSS3边框和背景 效果2 .掌握CSS3文本和 字体效果3 .掌握CSS3中2D变 形与动画效果能够熟练使 用CSS3的动 画效果，增加 整体布局意 识课程 目标32 学 时五、考核与评价方式及标准1、考核与评价方式及标准课程考试主要采用开卷方式，考试范围涵盖所有讲授的内容，考试内容应能客观反映 出学生对本门课程主要原理技术的掌握程度，对有关理论、原理的理解、掌握及综合运用 能力。(I)平时表现及讨论：占总成绩的10%。要求：教师针对重要知识点组织相应的课堂讨论

12、，重点考察学生的学习态度、自主学习能力、团队协作能力、语言表达能力与沟通能力。(2)作业：占总成绩的30%,要求：教师针对某些知识模块布置4次实验+3次课后作业 +1次自测题或课外思考题以巩固知识或拓展总结，对于作业中的共性问题，教师须在课堂讲解, 以帮助学生提高和进步。通过课外作业的布置，促进学生自主查找资料，巩固课堂讲授知识，深 入掌握操作系统的基本原理，提高学生系统思维能力和综合分析问题的能力。(3)期末考试采用开卷机考形式，占总成绩的60%。六、参考教材和阅读书目参考教材口周文洁.HTML5前端开发设计(第2版).清华大学出版社.2022. 12,主要参考书阅读书目储久良编.Web前端

13、开发技术(第3版).清华大学出版社.2018. 722未来科技著.HTML5+CSS3+JavaScript从入门到精通(标准版).中国水利水电出版 社.2017. 53美达科特(Duckett J)著；杜伟，柴晓伟，涂曙光译.Web设计与前端开发秘籍: JavaScript&jQuery交互式Web前端开发.清华大学出版社.2013. 24党建著.Web前端开发最佳实践.机械工业出版社.2015. 1七、本课程与其它课程的联系与分工Web开发技术课程的先修课程是计算机导论、程序设计基础和面向对象 程序设计，本课程学习将帮助学生建立计算机系统整体运行基本概念，形成对计算机运行 机制与原理的深刻认识，对后继专业课程计算机网络等的学习十分重要，在计算机知 识体系中起着承上启下的作用。