《web前端技术》课程标准

《前端技术》课程标准Web【课程名称】【课程编码】【课程类别】专业必修课【适用专业】【授课单位】【总学时】64（32理论+32实验）【教材】【编写日期】【编写执笔人】课程定位和课程设计1-课程制定依据

1.1近年来，在网络基础设施及终端加速普及、互联网技术日趋成熟等利好因素的推动下，5G网络在人们的生活中发挥着越来越重要的作用，越来越多的企业开始重视企业网站建设一个设计精良的企业网站不仅能够提升企业形象，还可以宣传企业热门服务，拓展企业业务等因此，前端技术也成了当前比较热门的学科或专业之一为了培养符合企业需求的前端Web Web开发人员，我们参考多所院校的人才培养方案，并结合前端相关岗位的实际需要开设了本Web课程课程性质与作用

1.2课程性质《前端技术》是软件工程专业培养课程体系中的一门专业必修课程，其包Web含了软件行业Web开发领域的关键技术基础知识（HTML5,CSS及JavaScript等）该课程的设置充分考虑了其在开发领域的关键性作用、目前市场广泛的应用需求和良好的就业前景，Web注重学生对理论基础知识、专业技能的理解、掌握课程作用通过本课程的学习，使学生理解、及等基本的理论知识；HTML5CSS JavaScript掌握应用上述理论知识，制作基本网页、设计网页布局、实现多样化及良好客户体验的页面效果等应用技能；培养学生的创新意识，设计特色网页课程设计思路

1.3本课程从实际工作出发,通过丰富多彩的案例和实战，系统讲解前端的相关知识；学Web生可以在课程的学习中顺着知识点的脉络逐渐完善案例的各个模块，过关斩将，最终实现美观、实用的网页效果此外，最后以企业网站的建设为例，简明清晰地介绍了网站开发的实际流程与常见网页的制作方法，既有助于学生理解知识点，又具有启发性和实用性，让学生能够学有所用.课程目标2知识目标

2.1

（1）了解本课程内容在Web开发领域的定位与作用；

2.2了解、及技术的发展脉络、趋势及应用前景；HTML5CSS JavaScript

（3）掌握HTML5中的基本元素、文字与段落元素、图像元素、列表元素、表格元素、超链接元素、多媒体元素、框架元素及表单元素的语法、属性和参数等基础知识；（）掌握中元素的语法、属性和参数等基础知识；4CSS

2.3了解网页布局的几种方法，掌握使用进行网页布局、样式设计的基础知识；CSS（）掌握中的基本语法知识；6JavaScript

（7）掌握JavaScript进行提交内容校验、生成网页特效等方法能力目标

2.4

（1）具备使用HTML5制作包含基本内容的网页的能力；

（2）具备使用HTML5及CSS等技术来设计网页布局的能力；

（3）具备使用JavaScript技术来提高网页交互性、体验性的能力；

（4）具备综合使用HTML

5、CSS与JavaScript的相关知识，来丰富、渲染网页的能力;

（5）具备根据具体应用需求，创新性地设计网页的能力素质目标

2.5（）培养学生具备克服困难解决问题的意志；1

（2）培养学生养成严谨认真的科学态度，耐心细致的工作作风；

（3）培养学生具备良好的交流沟通素养和创新精神课程内容与教学要求

3.课程安排

3.1本课程内容分为个章节，包括前端开发基础，基础，文本、图像、多媒体14Web HTML5和列表，超链接、表格和表单,基础，的常用属性，布局，基础，CSS3CSS3CSS3JavaScript HTML5基础，函数、对象和数组，和事件，基础以及创建自制女装品牌店网站，DOM BOM,jQuery WJ内容包括其教学要求和课时分配如表所示1表《前端技术》课程要求及课时分配表1Web章节课程名称教学内容教学要求课时分配网站开发基础知识1了解网站与网页前端技术概述12Web初步了解前端技术前端开前端开发工具实战2WebWeb3Web12熟悉前端开发工具发基础演练使用3Web掌握的基础知识，创建“金企鹅教4HTML5HBuilderX培养代码规范意识育”项目提升实践动手能力5掌握的基本语法1HTML5熟悉的文档结构2HTML5熟悉的结构标签3HTML5的基本语法1HTML5加强对互联网信息时代4的文档结构2HTML5HTML5的了解23HTML5的结构标签实战2基础培养专业技能，夯实基础5演练一一创建“金企鹅教育”网站主页掌握标题和段落标签的文本11使用方法图像2熟悉文本格式化标签的实战演练一一制作“金企鹅2使用方法和特殊字符的表示教育”主页“精品图书”模方法块了解网页中图像格式和文本、图像、多媒体33路径的表示方法，掌握图像、3多媒体和列实战演练一一制作“金企鹅4图标和流标签的使用方法表教育”主页“企业宣传”模掌握在网页中嵌入音频块4列表和视频文件的方法

3.4实战演练一一制作“金企鹅5掌握无序列表、有序列表教育”主页“教育资讯”模和自定义列表标签的使用方块法，熟悉列表嵌套的实现方法超链接掌握超链接标签的使用11表格方法，熟悉不同类型的超链2实战演练----------制作“云接超链接、表课堂”页面的“精品课程”2掌握表格标签的使用方44格和表单模块法，熟悉表格的常用属性3表单3掌握表单标签的使用方实战演练一一制作“金企鹅法和表单控件的设置方法，教育”网站的登录页面熟悉表单控件的属性1CSS3的基本语法1掌握CSS3的基本语法基础5CSS34在网页中引入2CSS3样式（）选择器3CSS3

（4）CSS3的继承性和层

（2）掌握在网页中引入CSS3叠性样式的方式，包括行内样式、实战演练-------------为“金内嵌样式表和链接样式表企鹅教育”网站主页链接样

（3）熟悉CSS3选择器的含式表义，掌握不同种类选择器的使用方法（）熟悉的特性，包4CSS3括继承性、层叠性和优先级

（1）文本属性（）图像属性2实战演练一一美化“金企鹅教育”主页“精品图书”模块

（3）列表属性实战演练一一美化“金企鹅教育”主页“教育资讯”模

（1）掌握设置字体样式和文块本格式的相关属性CSS的常用

（4）超链接属性

（2）掌握设置网页图像和背66属性实战演练一一美化“金企鹅景样式的相关属性教育”网站主页的导航栏

（3）掌握设置列表、超链接、

（5）表格属性表格和表单样式的相关属性实战演练一一美化“云课堂:页面的“精品课程”模块（）表单属性6实战演练一一美化“金企鹅教育”网站的登录页面

（1）掌握盒子模型的相关知识，包括盒子模型的基本结（）盒子模型构和属性，以及不同类型元1

（2）元素的排版素的盒子模型

（3）常见的布局版式

（2）掌握元素的排版，包括实战演练一一布局“金企鹅标准流排版、浮动排版和定布局7CSS4教育”网站PC端主页位排版

（4）响应式布局

（3）熟悉常见的布局版式，实战演练一一布局“金企鹅包括单列、双列、三列和综合教育”网站移动端主页版式

（4）掌握响应式布局的实现方法高级应css

（1）变形效果

（1）熟悉变形效果的相关知84用

（2）过渡效果识，包括变形属性、2D变形和变形动画效果3D3熟悉过渡效果的相关属实战演练一一制作北极熊2性，了解常见过渡效果的应走路动画片段用场景及触发方式熟悉关键帧和动画效果3的相关属性，能够制作动画片段的基本语法1JavaScript在网页中引入2JavaScript熟悉的基本语1JavaScript实战演练为“金企鹅教法育”网站主页链接文件js掌握在网页中引入2变量3的方式，包括内嵌JavaScript数据类型4JavaScript式、外链式和行内式9运算符65基础熟悉变量的声明与赋值，3流程控制语句6以及变量的作用域实战演练一一计算银行存款掌握中的数据4JavaScript收益类型、运算符和流程控制语句掌握函数的定义和调用1方法，熟悉嵌套函数和递归函数1函数实战演练——判断某一年掌握对象的创建和访问2函数、对象是否为闰年10方法，熟悉常用的内置函数6和数组对象2掌握数组的定义和数组3数组3元素的操作，熟悉数组的属性和方法了解熟悉元1DOM,HTML1DOM素操作和节点操作的属DOMDOM和2BOM性和方法114BOM实战演练一一实现线上点菜2了解BOM,熟悉window功能对象、对象、对location history象、对象和对navigator screen象的属性和方法熟悉事件与事件流，掌握1事件概述1事件绑定方式和事件对象的事件绑定2常用属性和方法事件对象3事件126熟悉常见的事件类型，包常见事件类型24括鼠标事件、键盘事件、焦事件优化5点事件和页面事件实战演练一一制作“金企鹅教育”主页的轮播图3了解事件优化方式，包括事件委托和事件删除了解熟悉下载和1jQuery,基础配置的方法1jQuery jQuery选择器熟悉选择器、2jQuery2jQuery3jQuery操作元素jQuery对网页元素进行的操13jQuery4jQuery的事件处理作、jQuery的时间处理65jQuery的动画效果3掌握jQuery的动画效果，实战演练一一制作自动隐藏包括元素的隐藏与显示、元式菜单素的淡入淡出和元素的滑动效果等站点规划和创建1熟悉前端技术的应1Web创建自WJ制作主页2用14制女装品牌制作全部商品页63锻炼实践能力，提升工作2店网站制作购物车页4竞争力制作登录页5合计

64.课程实施4教学条件

4.1我校十分注重建设和完善本课程的教学设施，如多媒体教室、机房、网络教学平台、网络数据库等同时，我校有一支强大的师资队伍，可以为本课程的教学出谋划策教学方法建议

4.2本课程遵循“教师引导，学生为主”的原则，采用讲解、多媒体演示、场景模拟法、讨论、翻转课堂等多种方法，努力为学生创设更多知识应用的机会讲解法主要用于讲授前端技术基础知识、行业岗位知识等理论性较强的知识Web多媒体演示法在讲解过程中，借助音频、视频、图片等直观手段来呈现教学内容，在激发其学习兴趣和积极性的同时，不断提高其知识储备能力和综合文化素质场景模拟法针对所教内容布置任务，引导学生通过情景化的模拟训练来提升知识的实际应用能力和职业素养讨论法根据知识点，鼓励学生运用所学知识进行主题讨论，使其在讨论中逐步提升交际能力、思辨能力、解决实际问题的能力等翻转课堂法坚持学生的主体地位，鼓励学生在课上对自己学到的知识点进行分享和讲解，并对其讲解进行补充和评价，不断完善学生的知识结构，加深其对所学知识的理解教师在教学过程中，可根据学生的实际情况灵活选用教学方法，因材施教，尽量照顾到每一个学生的学习需求教学评价与考核要求

4.3课程的教学评价由形成性测评（40%）和终结性测评（60%）组成，其考核要求如下:形成性测评

4.

3.1形成性测评考核学生在学习本课程过程中的学习情况和实际应用能力的发展情况，包括出勤考核（10%）、课堂参与程度考核（10%）、作业完成质量考核（20%）等（）出勤考核1本项考核通过课前点名考核学生的课堂出勤率迟到分钟以内每次扣分，迟到分钟15115以上或无故缺勤一节课每次扣分，该项考核累计最多扣分210

（2）课堂参与程度考核本项考核主要通过课堂提问和课堂积极发言来评判学生的学习态度、学习主动性、课堂参与程度，以及学生的思辨能力、问题解决能力及其对课堂教学知识的掌握情况等只要学生能按时上课听讲，即可获得5分的基本分学生上课发言一次，即可另外获得0・5分，课堂发言最多可得分学生的最后成绩为课堂发言得分”5“5+（）作业完成质量考核3本项考核主要通过学生作业来检测其对教学主体内容的掌握与理解程度、实际应用知识的能力、自主学习能力、信息收集与处理能力等每次作业成绩按照相应标准而定，学生作业质量划分为优秀（10分）、良好（8分）、中等（7分）、及格（6分）和不及格（0分）五个档次最后的作业成绩为学生作业完成质量成绩的平均数终结性测评

4.

3.2终结性测评主要考核学生在学完本课程后所达到的水平，通过期末考试进行考核期末考试由论文考试（60%）组成，主要评估学生对本门课程基本知识的掌握情况与综合运用能力课程资源开发与利用

5.教材使用

5.1

（一）建议教材赵敏、刘三满、张振寰，《前端技术》，航空工业出版社，年月Web20225

（二）参考书目梁玲、韩迎红、畅玉洁、王冬梅，《网站前端技术》，航空工业出版社，年月20224管西京、张玲玲、陈强，《移动开发实战》，上海交通大学出版社，年月Web202111网络资源

5.2课程学习网站为学生提供集图、文、声、像于一体的自主学习网络平台在教学过程中综合利用该平台，进行灵活的信息化教学包括在线上进行随堂测试、期末考试、评分等还有大量的图书、云课程可供学生进行拓展性学习，有利于学科交叉，为学生营造良好的线上学习园地。