Web前端开发案例教程（HTML5 CSS3）（微课版）（第2版）-课程标准 .docx

《Web前端开发基础》课程标准

课程基本信息

课程代码：课程名称：Web前端开发基础

课程类型：B类（理论+实践）

课程地位：核心课

课程学分：4

参考学时及分配：64（理论32+实践32）

课程性质：专业课

开课部门：软件与大数据系

适用对象：初中毕业对口贯通分段培养学生

适用专业（层次）：计算机应用技术专业

先修课程：

后续课程：《JavaScript脚本编程》

职业资格：Web前端开发职业等级证书

对应1+X证书：Web前端开发职业技能证书（初级）

对应职业技能大赛赛项：HTML5交互融媒体内容设计与制作、移动应用开发

编者：《Web前端基础》课程组

课程负责人：李志云

审核人：

合作开发企业：

编制日期：2024年8月8日

批准人：

一、课程简介

本课程旨在培养学生利用HTML5和CSS3搭建网页并进行布局和美化的职业能力，主要内容包括HTML5语言常用标记、CSS3样式的创建和使用、盒子模型、盒子模型的相关属性、元素的浮动和定位、表格和表单的创建、HTML5+CSS3布局、CSS3过渡、变形和动画属性等。校企共同开发课程内容，充分体现职教特色。以学校真实网站项目引领，将项目划分为十大任务，通过任务驱动组织学习内容，在完成任务的过程中掌握必须的知识点和技能点，最后完成完整的网站项目，力争所学内容与社会需求无缝对接。

二、课程性质与定位

（一）课程性质

《Web前端开发基础》课程是计算机应用技术专业必修的专业核心课程。

（二）课程定位

该课程是计算机应用技术专业中培养Web前端开发工程师必备的核心课程，是学习《Web框架技术》课程的前导课，通过该课程的学习使学生具备利用HTML5搭建页面结构的能力、利用CSS3布局并美化网页的能力、能够综合利用HTML5和CSS3设计并开发小型静态网站。

三、课程目标

（一）总体目标

通过该课程的学习，使学生熟练使用HTML5+CSS3技术实现网站结构设计、页面样式美化和布局、网站动态效果添加等，从而能独立设计并开发小型静态网站，在网站开发中主要培养学生的工匠精神和团队精神、标准意识和创新思维。

（二）具体目标

1．素质目标

(1)在课程学习中培养科技报国的红心；

(2)在课程学习中培养具有爱岗敬业、精益求精的工匠精神；

(3)在网站开发中培养沟通和表达能力、小组同学的团结协作能力；

(4)在网站结构搭建和样式编码中培养标准意识；

(5)在网站规划和设计中培养创新思维和精神。

2．知识目标

(1)掌握使用HTML5语言标记搭建网页结构的方法；

(2)熟练使用CSS3创建样式表修饰网页；

(3)掌握使用HTML5+CSS3进行网页布局的方法；

(4)掌握表格和表单的创建及美化；

(5)掌握CSS3中过渡、变形及动画属性的使用；

(6)掌握小型静态网站的规划设计与开发步骤。

3．能力目标

(1)能对实际项目进行需求分析和规划；

(2)能使用HTML5常用标记搭建网页结构；

(3)能用CSS3创建样式表并对网页进行美化；

(4)能用流行软件编辑网页并对网页代码进行优化；

(5)能用CSS3添加网页动态效果；

(6)能使用HTML5+CSS3对网页布局；

(7)能综合使用HTML5+CSS3+JavaScript创建小型静态网站。

四、课程设计理念及思路

课程设计依据。依据计算机应用技术专业人才培养方案对于本课程的设置要求，对接W3C国际标准和Web前端开发职业等级标准，并融合“HTML5交互融媒体内容设计与制作”、“移动应用开发”职业技能竞赛规程，基于OBE目标导向法，以学生为中心，以培养职业能力为根本，基于真实项目开发流程，组织教学内容，做到“岗课赛证”融通培养。

教学内容设计。课程内容划分为10个任务，以任务驱动引领学习，在完成任务的前提下，充分激发学生学习兴趣，围绕任务实现，学习相关的知识点和技能点，最后再完成完整网站项目的开发,掌握网站开发过程中所需的技能和应遵守的行业标准和规范，为学生的职业能力发展奠定良好的基础。

教学模式和方法。本课程采用线上线下混合式教学模式，充分利用课前和课后时间，利用教材中嵌入的二维码让学生课前学习、课后巩固和拓展提高，培养学生的自学能力并弥补学习内容多、课时不充足的问题，课堂教学中采用启发式、案例式或讨论式等多种灵活多样的教学方法。

五、课程内容及要求

序号

学习

任务

教学内容、目标及要求

教学活动设计建议

特色说明

实践考核项目与要求

学时分配

1

任务一：

HTML5网页创建

了解WEB相关概念；掌握HTML5网页创建的方法。

完成任务：创建第一个HTML5网页；

在多媒体教室进行一体化教学；先讲理论再实践；

采用任务驱动法教学；

学生课前预习、课中教师主导，课后布置作业进行巩固。

从HTML5标准规范的创建引出我