职业技能等级标准

Web 前端开发


工业和信息化部教育与考试中心
2019 年 3 月

说    明

       为贯彻落实《国家职业教育改革实施方案》,积极推动学历证书 +若干职业技能等级证书制度,进一步完善计算机软件行业技术技能 专业标准体系,为技术技能人才教育和培训提供科学、规范的依据, 工业和信息化部教育与考试中心依据当前计算机软件行业发展的实 际情况,在实施工业和信息化人才培养工程 Web 前端开发专业技术 技能人才培养项目的基础上,在教育部的指导下,组织有关专家,编 写了《Web 前端开发职业技能等级标准》(以下简称“标准”)。

       本标准以客观反映现阶段软件开发和互联网行业技术发展水平 及其对从业人员的能力要求为目标,明确了具有本专业职业技能的人 员的工作领域、工作任务、技能要求和知识要求。

       本标准采用功能分析法进行编写,遵循了有关技术规程的要求, 既体现了以专业活动为导向、以专业技能为核心的特点,又保证了标 准体例的规范化,同时,模块化的结构也使其具有根据技术发展进行 调整的灵活性和实用性,以符合培训和评价工作不断发展的需要。

       本标准将 Web 前端开发职业技能分为初、中、高三个等级,其 中高级证书持有者具有复杂网页设计开发能力和网站架构设计规划 能力;中级证书持有者具有动态网页设计开发能力;初级证书持有者 具有静态网页开发能力。

       本标准由工业和信息化部教育与考试中心组织编写,参加编写审 订工作的主要人员有谭志彬、顾乃杰、朱卫东、何山、龚玉涵、贾振 洋、吴善超、罗东阳、朱立、高飞、徐旭、骆彬彬、任远、杨亨冉等, 在此表示感谢。

1. 职业技能概况

1.1 名称

       Web 前端开发

1.2 职业技能定义

       利用 HTML、CSS、JavaScript、网页开发框架等专业知识、方法和工具将产品 UI 设计稿实现成网站的技能。

1.4 职业技能等级

       本职业技能共设三个等级,分别为:初级、中级、高级。

1.5 环境

       室内,常温。

1.6 职业技能特征

       具有较强的逻辑思维能力,拥有良好的编写代码习惯,沟通能力强,具有运用色彩搭配、点线面布局来设计较好用户体验网站页面的能力。

1.7 基本文化程度

       高中毕业(或同等学历)。

1.8 职业技能培训要求

1.8.1 培训课时

       初级职业技能培训时间不少于 96 标准课时;中级职业技能培训时间不少于 224 标准课时(含初级培训课时);高级职业技能培训时 间不少于 320 标准课时(含初级培训课时和中级培训课时)。

1.8.2 培训教师

       企业在职工程师、双师型教师、院校教师。

1.8.3 培训场所设备

       计算机、移动终端、服务器、网络交换机、路由器等。

2. 教材

       每个级别分别配套有《Web 前端开发》(工业和信息化人才培养工程系列丛书,1+X 证书制度试点培训用书)教材上、下两册,共有 6 本教材。教材与本标准对应,是实施培训的参考依据。

3. 考核方式

       Web 前端开发职业技能初、中、高三个级别的考核方式为闭卷考试,采用上机考试形式。考试包括理论考试和实操考试两部分。

       理论考试试卷满分 100 分,共 50 道试题,其中单选题 30 道,多选题 15 道,判断题 5 道;实操考试试卷满分 100 分,试卷含 3-5 道实践性试题,试题形式包括案例分析、软件代码编码或是网页效果呈现等。理论考试与实操考试合格标准均为 60 分,两部分考试成绩均合 格的学员可以获得相应级别的职业技能等级证书。

4. 标准主要特点

       本标准的开发遵循了整体性、规范性、实用性、可操作性等原则。

       本标准的开发,充分考虑到了 Web 前端开发从业人员的职业发展路径与成长路径,以职业素养、职业技能、知识水平为主要框架结构, 设计了 HTML 基础及 HTML5 标签、CSS 及 CSS3 应用、JavaScript基本语法与高级编程、ES6 标准、数据库应用、项目模块化开发、各种复杂的交互与优化等知识和能力等模块。 面向的主要岗位包括网页设计、网页制作、响应式页面搭建、移动网页制作与设计、网站搭建(门户(行业)网站、交易类网站、企事业网站、娱乐性质网站)、网站规划与设计等。

       本标准的核心内容,来源于社会对 Web 前端开发职业活动质量的要求, 是衡量从业者 (包括正在接受教育与培训的准从业者) 胜任Web 前端开发工作的基本尺度和规范, 能够反映当下时期内 Web 前端开发职业教育的人才培养质量规格。

5. 职业素养要求

类名 内容
职业道德 自觉遵守中国软件行业基本公约。
有良好的知识产权保护观念和意识,自觉抵制各种违反知识产权保护法规的行为。
能自觉遵守企业规章制度与产品开发保密制度。
遵守有关隐私信息的政策和规程,保护客户隐私。
合作意识 具有积极协助配合同事完成开发任务的意识。
讲诚信,坚决反对各种弄虚作假现象,对已经承诺的事,要保证做到。
能够与项目组人员沟通协调,确定自己的开发任务,理解团队开发任务。
质量意识 遵循从软件需求分析到软件验收完成整个软件生命周期的标准规范。
执行和遵守软件开发所需的方法、时间进度、制度控制和相关软件开发事项。
能够根据产品经理和主管的要求修改完善软件,提高代码质量。
开发过程应遵循企业标准,应依据需求说明书客观地验证软件开发产品。
服务意识 能够与客户和主管及时沟通前端开发任务需求和项目进度状况。
能及时收集用户反馈,提升前端开发成果的实用性、易用性。
学习意识 能自觉跟踪前端开发技术发展动态,积极参与各种技术交流、技术培训和继续教育活动。
依据文档编制规范,自觉学习,提高程序编写文档的规范性、准确性和易读性。
学习标准和操作规范,提高对所使用的软件和相关文档的理解能力,以及对这些软件和文档将要应用的环境的理解能力。
善于总结开发工作经验,不断提高在合理的时间内以合理的费用创建安全、可靠和高质量软件的能力。

6. 操作规范

        Web 前端开发中应遵循以下操作规范:

  •                 (1)GB/T 8567-2006 计算机软件文档编制规范。
  •                 (2)GB/T 30971-2014 软件工程 用于互联网的推荐实践 网站工程、网站管理和网站生存周期。

7. 标准开发的主要方法

        标准开发主要采用的方法是功能分析法。

        功能分析法是从职业最顶层的大目标(工作领域)出发, 逐层确立中目标、小目标(工作任务/职业技能,或称单元/要素) , 然后根据达到目标 (完成职业单元、职业要素) 所需的知识、技能以及其他相关能力的要求, 确立标准的范围、内容和程度。 它以目标为中心, 强调实现目标需要具备的手段 (知识、方法、工具、技能及其他相关要求) 以及实现目标需达到的水平要求。 功能分析法步骤如下:

  •         (1)明确某一职业领域的“工作领域”;
  •         (2)分解出这些工作领域的“工作任务 ”;
  •         (3)把工作任务进一步分解为“次一级功能 (sub-functions) ”, 直到不能再分时, 次级功能就被称为标准中的“职业技能”;
  •         (4)分析职业技能所关联的“技能要求”和“知识要求”。 在结构上, 本职业技能标准包括五个要素:

        在结构上, 本职业技能标准包括五个要素:

  •         (1)工作领域:这是职业技能标准按照工作职责大目标划分后形成的单位;
  •        (2)工作任务:这是职业技能标准的基本组成单位, 某一工作任务可以看作是对某一主要工作内容或应完成功能的概括;
  •         (3)职业技能:是工作任务的基本组成单位, 可以看作是对具有相对独立价值的某一次级功能所要求能力的描述;
  •         (4)技能要求:即每项能力要素所应达到的操作水平。技能要求在语义内容上一般包括所应达到的操作结果, 以及判断操作是否达到所要求结果的评判标准。
  •        (5)知识要求:阐明具有每项技能所应掌握、了解的知识。

8.Web 前端开发(初级)

8.1. 培训学时

       96 学时。

8.2. 衔接中职专业

        通信技术、电子与信息技术、电子技术应用、计算机应用。

8.3. 衔接高职专业

       计算机应用技术、计算机信息管理、软件

8.4. 接续本科专业

       计算机科学与技术、电子信息工程、电子 科学与技术、软件工程。

8.5. 培养目标

       围绕互联网+、新兴技术行业带来的 Web 前端开发技术技能人才需求,培养具有良好职业道德和人文素养,掌握Web 前端开发基础知识, 具备静态网页设计、开发、调试、维护等能力,能从事 Web 前端软件编码、软件测试、软件技术服务等工作的初级技术技能人才。

8.6. 就业方向

       主要面向各企事业单位、政府部门等的信息化数字化部门,从事静态网页制作、响应式页面搭建等工作,根据视觉和交互原型要求实现网站页面和交互效果。

8.7. 主要职业能力

  •         1)具有前端开发新知识、新技能的学习能力。
  •         2)具备静态网站设计与制作能力。

8.8. 核心课程与实习实训

  •         (1)核心课程:Web 页面制作基础、HTML5 开发基础与应用、轻量级前端框架、JavaScript 程序设计等。
  •         (2) 实习实训:线上实训方式,与项目实例相结合的教学方法,学生通过 在线编程环境,完成静态网页制作、专题栏目的静态宣传页(二级网页)制作、动画效果制作等实际项目。

8.9. 能力标准与知识要求:

工作
领域
工作
任务
职业技能 技能要求 知识要求
静 态
网 站
搭建
1-1
静 态
网 页
开发
1-1-1 能使用HTML 制作静态网页 1-1-1-S1 能使用 HTML 文本标签、头部标记、页面创建超链接
1-1-1-S2 能使用创建表格表单功能搭建静态网页
1-1-1-K1 掌 握 HTML 文 本标签、头部标记功能
1-1-1-K2 掌握页面创建超链接、创建表格表单功能
1-1-2 能使用CSS 设计页面样式 1-1-2-S3 能使用 CSS 开发网页样式
1-1-2-S4 能使用 CSS 美化网页样式
1-1-2-S5 能正确运用 Hack 原理实现CSS 中的样式效果
1-1-2-K3 掌握 CSS 的选择器、单位、字体样式、文本样式、颜色、背景功能
1-1-2-K4 掌握 CSS 的区块、网页布局属性的功能
1-1-3 能使用JavaScript 开发交互效果页面 1-1-3-S6 能使用 JavaScript 开发交互效果页面
1-1-3-S7 能正确选择数据类型、设置变量, 能使用运算等基础语言和内置函数实现数据交互
1-1-3-S8 能正确使用 JavaScript 对象和DOM 编程实现交互效果页面
1-1-3-K5 掌握 JavaScript 基础语言、函数、面向对象的功能
1-1-4 能使用jQuery 开发交互效果页面 1-1-4-S9 能使用 jQuery 选择器、jQuery中的 DOM 操作、滚动、图表、布局、文字处理及 UI 等插件、 jQuery 事件和动画等功能开发交互效果页面 1-1-4-K6 掌握 jQuery 中选择、插件、事件和动画的功能
1-2
静 态
网 页
美化
1-2-1 能使用CSS3 新特性开发页面样式 1-2-1-S1 能使用 CSS3 的选择器、边框特性、颜色、字体功能美化网页 1-2-1-K1 了解 CSS3 新增选择器边框新特性、新增颜色、字体的功能
1-2-2 能使用HTML 标签美化页面 1-2-2-S2 能使用 HTML 文本标签、图像、头部标记、页面创建超链接、创建表格表单及 iframe 框架等功能美化网页 1-2-2-K2 理解并掌握 HTML 文本标签、头部标记、页面创建超链接、创建表格表单等功能的使用方法
动 态
网 站
搭建
1-3
动态
网页
开发
1-3-1 能使用CSS3 新特性开发动态页面样式 1-3-1-S1 能使用 CSS3 特性、动画效果、多列布局以及弹性布局开发动态网页 1-3-1-K1 了解 CSS3 特性、CSS3动画效果、多列布局以及弹性布局的使用方法
移 动
端 静
态 网
站 开
1-4
移动
端静
态网
页开
1-4-1 能使用HTML5 制作移动端静态网页 1-4-1-S1 能使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能进行移动端页面开发 1-4-1-K1 了解 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素的使用方法
1-4-2 能使用CSS3 新特性开发页面样式 1-4-2-S2 能使用 CSS3 的选择器、边框特性、颜色、字体功能设计网页/td> 1-4-1-K2 了解 CSS3 选择器、边框特性、颜色、字体的功能
1-4-3 能使用JavaScript 开发交互效果页面 1-4-3-S3 能使用 JavaScript OOP、原型链、常用设计模式等原生的方式开发网页 1-4-1-K3 了解 JavaScript OOP、原型链、常用设计模式等原生方式开发网页的功能
1-5
移动
端静
态网
页美
1-5-1 能使用HTML5 美化静态网页 1-5-1-S1 能使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能美化页面 1-5-1-K1 了解 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素的使用方法
1-5-2 能使用CSS3 新特性美化静态页面 1-5-1-S2 能使用 CSS3 的选择器、边框特性、颜色、字体功能美化网页 1-5-1-K2 了解 CSS3 选择器、边框特性、颜色、字体的功能

9.Web 前端开发(中级)

9.1. 培训学时

       224 学时。

9.2. 衔接中职专业

       通信技术、电子与信息技术、电子技术应用、计算机应用。

9.3. 衔接高职专业

       移动互联应用技术、计算机应用技术、计算机信息管理、软件技术、软件与信息服务、移动应用开发、智能产品开发。

9.4. 接续本科专业

       计算机科学与技术、电子信息工程、电子科学与技术、软件工程。

9.5. 培养目标

       培养目标:围绕互联网+、新兴技术行业带来的 Web 前端开发、移动端开发技术技能人才需求, 以企业用人为导向,以岗位技能和综合素质为核心,培养具有良好职业道德和人文素养,掌握 Web前后端数据交互、响应式开发等知识,具备动态网页设计、开发、调试、维护等能力,能从事 Web 前端软件编程、软件测试、软件技术服务、智能终端界面开发等工作的中级技术技能人才。

9.6. 就业方向

       主要面向 IT 互联网企业、互联网转型的传统型企事业单位、政府部门等的软件研发、软件测试、系统运维部门,从事网站规划与建设、网站开发与维护、关系型数据库开发管理等工作,根据网站开发需求,编制并实施解决方案。

9.7. 主要职业能力

  •         (1)具有前端新知识、新技能的学习能力和创新创业能力;
  •         (2)具备网站规划与建设能力;
  •         (3)具备关系型数据库设计与管理能力;
  •         (4)具备网站响应式开发能力;
  •         (5)具备数据交互能力。

9.8. 核心课程与实习实训

  •         (1)核心课程:MySQL 数据库基础与应用、PHP 技术与应用、Web 前后端数据交互技术、响应式开发技术、网站项目实战等课程。
  •         (2)实习实训:线上线下相结合的实训方式,与项目实例相结合的教学方法,以面向门户网站、交易类网站、企事业网站、娱乐性质网站的规划与建设、开发与维护、关系型数据库开发与管理等为实训项目内容,配备一定量的企业实际项目。

9.9. 能力标准与知识要求:

工作
领域
工作
任务
职业技能 技能要求 知识要求
静 态
网 站
搭建
2-1
静态
网页
开发
2-1-1 能熟练使用HTML编写静态网页 2-1-1-S1 能熟练使用 HTML 文本标签、头部标记、页面创建超链接、创建表格表单功能搭建静态网页 2-1-1-K1 掌握并熟练应用HTML文本标签、头部标记、页面创建超链接、创建表格表单功能
2-1-2 能使用CSS 设计网站页面样式 2-1-2-S2 能熟练使用 CSS 设计网页样式
2-1-2-S3 能熟练使用 CSS 美化网页样式
2-1-2-S4 能熟练使用 Hack 原理实现CSS 中的样式效果
2-1-2-K2 掌握 CSS 的选择器、单位、字体样式、文本样式、颜色、背景的使用方法
2-1-2-K3 掌握 CSS 的区块、网页布局属性的使用方法
2-1-3 能使用JavaScript 开发网站交互效果页面 2-1-3-S5 能熟练使用 JavaScript 开发交互效果页面
2-1-3-S6 能熟练使用运算等基础语言和内置函数实现数据交互
2-1-3-S7 能熟练使用 JavaScript 对象和DOM 编程实现交互效果页面
2-1-3-K4 掌握 JavaScript 基础语言、函数、面向对象功能的使用方法
2-1-4 能 使 用jQuery 开发网站交互效果页面 2-1-4-S8 能熟练使用 jQuery 选择器、jQuery 中的 DOM 操作、滚动、图表、布局、文字处理及 UI 等插件、jQuery事件和动画等开发交互效果页面 2-1-4-K5 掌握 jQuery 中选择、插件、事件和动画功能的使用方法
2-1-5 能使用Bootstrap 前端框架开发页面 2-1-5-S9 能使用 Bootstrap 栅格系统、基本样式、组件、LESS 和 SASS、插件、Bootstrap 定制及优化、Bootstrap内核解码开发响应式页面 2-1-5-K6 掌握 Bootstrap 布局、组件、基本样式、插件、组件的使用方法
2-2
静 态
网 页
美化
2-2-1 能 使 用CSS3 新 特 性 美化网站页面样式和结构 2-2-1-S1 能熟练使用 CSS3 的选择器、边框特性、颜色、字体、盒阴影、背景特性、盒模型、功能美化网页 2-2-1-K1 掌握CSS3选择器在页面中插入各种盒子模型、背景样式使用方法
2-2-2 能 运 用HTML 各种标签美化原有静态网页 2-2-2-S2 能熟练使用 HTML 文本标签、图像、头部标记、页面创建超链接、创建表格表单及 iframe 框架等功能美化网页 2-2-2-K2 掌握 HTML 在网页中嵌入多媒体、使用框架结构、网页中使用表格创建表单的使用方法
动态
网站
搭建
2-3
动 态
网 页
开发
2-3-1 能 使 用CSS3 新 特 性 设计网站页面样式和结构 2-3-1-S1 能熟练使用 CSS3 的选择器、背景、盒模型、渐变、多列布局等属性开发动态网页 2-3-1-K1 掌握 CSS3 特性、动画效果、多列布局以及弹性布局的使用方法
2-3-2 能运用MySQL数据库进行基本的数据管理工作 2-3-2-S2 能使用 MySQL 基本操作进行数据管理 2-3-2-K2 掌握 MySQL 中创建表、设置约束、设置自增型字段、表结构的复制、修改表、修改字段、修改约束条件、修改表名、删除表、数据的插入/修改/查询/存储、触发器、事务、视图的使用方法
2-3-3 能使用PHP制作动态网页 2-3-3-S3 能熟练使用 PHP 的编码技术操作 Mysql 数据库,进行动态网站开发。
2-3-3-S4 能 使 用 Session 的 操 作 、Cookie 的操作开发动态网站
2-3-3-K3 掌握 PHP 的基础操作、数组函数、面向对象、基本语法、数据类型、数据输出、编码规范、常量、变量、PHP运算符、数据类型转换、条件判断语句、循环控制语句、跳转语句和终止语句、一维数组、二维数组、遍历与输出数组、函数、PHP操作MySQL数据库、管理 MySQL 数据库中数据的使用方法
2-3-4 能根据RESTful API 规范设计可用的API 2-3-4-S5 能根据 HTTP 协议方法定义操作,能使用 API 进行数据筛选、支持大型二进制资源的部分响应与后端进行交互 2-3-4-K4 掌握基本的 API 设计方法
2-3-5 能使用Ajax 创建动态网页 2-3-5-S6 能熟练使用 Ajax 中的 XML、JSON 数据格式与网站后端进行数据交互 2-3-5-K5 掌握 Ajax 技术,实现异步刷新,异步获取数据的使用方法
2-3-6 能使用Laravel 框架构建动态网站 2-3-6-S7 能熟练使用 Laravel 的路由、控制器、Blade 模板、前端组件构建动态网站 2-3-6-K6 掌握 Laravel 框架构建动态网站的使用方法
移动
端静
态网
站开
2-4
移 动
端 静
态 网
页 开
2-4-1 能熟练使用 HTML5 编写移动端静态网页 2-4-1-S1 能熟练使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能开发移动端页面 2-4-1-K1 掌握 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素的使用方法
2-4-2 能 运 用CSS3 特 性 设 计网站页面样式和结构 2-4-2-S2 能使用 CSS3 的选择器、边框特性、新增颜色、字体、盒阴影、背景特性、盒模型、渐变功能设计移动端静态网页 2-4-2-K2 掌握 CSS3 选择器、边框特性、颜色、字体、盒阴影、背景特性、盒模型、渐变功能的使用方法
2-4-3 能使用JavaScript 开发网站交互效果页面 2-4-3-S3 能熟练使用 JavaScript 开发交互效果页面
2-4-3-S4 能熟练使用运算等基础语言和内置函数实现数据交互
2-4-3-S5 能熟练使用 JavaScript 对象和DOM 编程实现交互效果页面
2-4-3-K3 掌握 JavaScript 基础语言、函数、面向对象功能的使用方法
2-4-4 能使用Bootstrap 前端框架开发页面 2-4-4-S6 能使用 Bootstrap 栅格系统、基本样式、组件、Less 和 Sass、插件、Bootstrap 定制及优化、Bootstrap 内核解码开发响应式页面 2-4-4-K4 掌握 Bootstrap 布局、组件、基本样式、插件、组件的使用方法
2-5
移 动
端 静
态 网
页 美
2-5-1 能熟练使用 HTML5 编写静态网页 2-5-1-S1 能熟练使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能美化页面 2-5-1-K1 理解 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素的使用方法
2-5-2 能 使 用CSS3 新 特 性 改变网站页面样式和结构 2-5-2-S2 能熟练使用 CSS3 的选择器、盒模型、过渡、动画等属性美化网页
2-5-2-S3 使用 em/rem/vw/vh 等单位开发移动端网页,达到美化网页的效果
2-5-2-K2 掌握 CSS3 选择器在页面中插入、各种盒子模型、背景样式使用方法
移 动
端 动
态 网
站 开
2-6
动 态
网 页
开发
2-6-1 能使用MySQL 数 据 库进行基本的数据管理工作 2-6-1-S1能使用MySQL 基本操作进行数据管理 2-6-1-K1 掌握 MySQL 中创建表、设置约束、设置自增型字段、表结构的复制、修改表、修改字段、修改约束条件、修改表名、删除表、数据的插入/修改/查询/存储、触发器、事务、视图的使用方法
2-6-2 能使用PHP 制作动态网页 2-6-2-S2 能熟练使用 PHP 的编码技术操作 MySQL 数据库,进行动态网站开发。
2-6-2-S3能使用Session的操作、Cookie 的操作开发动态网站
2-6-2-K2掌握PHP的基础操作、数组函数、面向对象、基本语法、数据类型、数据输出、编码规范、常量、变量、PHP 运算符、数据类型转换、条件判断语句、循环控制语句、跳转语句和终止语句、一维数组、二维数组、遍历与输出数组、函数、PHP操作MySQL数据库、管理 MySQL 数据库中数据的使用方法
2-6-3能使用Ajax 创建动态网页 2-6-3-S4 能熟练使用 Ajax 的 XML、JSON 数据格式与网站后端进行数据交互 2-6-3-K3 掌握 Ajax 技术,实现异步刷新,异步获取数据的使用方法

10.Web 前端开发(高级)

10.1. 培训学时

       320 学时。

10.2. 衔接中职专业

       通信技术、电子与信息技术、电子技术应用、计算机应用。

10.3. 衔接高职专业

       移动互联应用技术、计算机应用技术、计算机信息管理、软件技术、软件与信息服务、移动应用开发、智能产品开发。

10.4. 接续本科专业

       计算机科学与技术、电子信息工程、电子科学与技术、软件工程。

10.5. 培养目标

       围绕互联网+、新兴技术行业带来的 Web 前端开发、移动端开发技术技能人才需求,以企业用人为导向, 以岗位技能和综合素质为核心,培养具有良好职业道德和人文素养,掌握 Web前端框架应用、性能优化与自动化技术等知识,具备前端架构、移动智能终端开发、组件化开发等能力,能从事 Web 前端架构设计、技术选型、组件化等工作的高级技术技能人才。

10.6. 就业方向

       主要面向 IT 互联网企业、互联网转型的传统型企事业单位、政府部门等的软件研发、软件测试、系统运维部门,从事前端架构设计、移动端项目开发、智能设备前端开发、组件和类库编写等工作,根据网站开发需求,进行架构设计并管理实施解决方案。

10.7. 主要职业能力

  •         (1)具有前端新知识、新技能的学习能力和创新创业能力;
  •         (2)具备前端架构设计能力;
  •         (3)具备移动端开发能力;
  •         (4)具备前端组件化能力;
  •         (5)具备网站性能优化能力。

10.8. 核心课程与实习实训

  •         (1)核心课程:前端高效开发框架技术与应用、性能优化与自动化技术、移动 Web 设计与开发等。
  •         (2)实习实训:结合线上线下学习平台与项目实例相结合的教学方法,以前端架构设计、移动前端项目开发、智能设备前端开发、组件和类库的编写等为实训项目内容,同时可以为成绩优秀的学员提供企业实习机会。

10.9. 能力标准与知识要求:

工作
领域
工作
任务
职业技能 技能要求 知识要求
静态
网站
搭建
3-1
静态
网页
开发
3-1-1 能熟练使用 HTML 开发静态网页 3-1-1-S1 能结合其他编程语言,综合运用 HTML 文本标签、头部标记、页面创建超链接、创建表格表单等功能搭建静态网页 3-1-1-K1 掌握 HTML 文本标签、头部标记、页面创建超链接、创建表格表单与其它编程语言的综合使用方法
3-1-2 能熟练使用 CSS 开发网站页面样式 3-1-2-S2 能熟练使用 CSS 开发网页样式,能正确解决 CSS 编程过程中的问题 3-1-2-K2 掌握 CSS 基本属性、选择器、单位、字体样式、文本样式、颜色、背景、区块、网页布局属性的使用方法
3-1-3 能熟练使用 JavaScript 开发网站交互效果页面 3-1-3-S3 能熟练使用 JavaScript 开发交互效果网页,能正确解决JavaScript编程过程中的问题 3-1-3-K3 掌握 JavaScript 基础语言、函数、面向对象功能的知识
3-1-4 能利用jQuery 进行交互效果优化 3-1-4-S4 能熟练使用 jQuery 开发交互网页,能正确解决在 jQuery 编程过程中出现的问题 3-1-4-K4 掌握 jQuery 中选择、插件、事件和动画功能的使用方法
3-1-5 能使用Bootstrap定制和优化响应式页面 3-1-5-S5 能熟练使用 Bootstrap 开发响应式网页,并能解决在应用中出现的问题 3-1-5-K5 掌握 Bootstrap 布局、组件 Sass 功能的使用方法
3-2
静态
网页
美化
3-2-1 能使用CSS3 新特性优化页面样式 3-2-1-S1 能熟练使用 CSS3 的选择器、边框特性、颜色、字体、盒阴影、背景特性、盒模型、渐变、过渡、多列布局、弹性布局等功能并能解决应用中的问题 3-2-1-K1 掌握使用 CSS3 功能解决优化过程中兼容性问题的方法
3-2-2 能运用HTML 各种标签美化原有静态网页 3-2-2-S2 能熟练使用 HTML 文本标签、图像、头部标记、页面创建超链接、创建表格表单及 iframe 框架等功能美化静态网页并解决出现的问题 3-2-2-K2 掌握使用 HTML 在网页中嵌入多媒体、使用框架结构、网页中使用表格创建表单等知识以及使用中出现问题的解决方法
动态
网站
搭建
3-3
动态
网页
开发
3-3-1 能熟练使用 CSS3 特性调整页面属性 3-3-1-S1 能使用 CSS3 的选择器、边框、颜色、文本效果、字体、盒阴影、背景、盒模型、渐变、过渡、动画、多列布局、弹性布局等特性开发动态网页,并解决动态网页优化问题 3-3-1-K1 掌握 CSS3 新增特性、CSS3 动画效果、多列布局以及弹性布局知识
3-3-2 能熟练使用 MySQL 数据库进行数据管理 3-3-2-S2 能使用 MySQL 创建表、设置约束、设置自增型字段、表结构的复制、修改表、修改字段、修改约束条件、修改表名、删除表、数据的插入/修改/查询/存储、触发器、事务、视图等功能,解决数据管理应用中出现的问题 3-3-2-K2 掌握 MySQL 中创建、修改、删除表等数据基本操作方法及应用中出现问题的解决方法
3-3-3 能熟练使用 PHP 制作动态网页 3-3-3-S3 能熟练使用 PHP 的编码技术操作 MySQL 数据库,进行动态网站开发
3-3-3-S4 能熟练使用 Session 的操作、Cookie 的操作开发动态网站
3-3-3-K3 掌握 PHP 基本语法、数据类型、数据输出、编码规范、常量、变量、PHP 运算符、数据类型转换、条件判断语句、循环控制语句、跳转语句和终止语句、一维数组、二维数组、遍历与输出数组、函数、PHP 操作 MySQL 数据库、管理 MySQL 数据库中的数据、Session 的操作、Cookie 的操作等功能,掌握应用中出现问题的解决方法
3-3-4 能运用API 设计原则,设计可用、易用、可维护的API 3-3-4-S5 能使用 Restful API 设计跨平台跨语言的数据接口 3-3-4-K4 掌握使用 API 设计原则设计可用、易用、可维护API 的方法,并掌握应用中出现问题的解决方法
3-3-5 能熟练使用 Ajax 创建动态网页 3-3-5-S6 能使用 Ajax 的 XML、JSON数据格式、 JSONP 跨域等功能并解决应用中出现的问题 3-3-5-K5 掌握 Ajax 进行数据交互的使用方法,并掌握应用中出现问题的解决方法
3-3-6 能熟练使用 Laravel 框架构建动态网站 3-3-6-S7 能使用 Laravel 的路由、控制器、Blade 模板、前端组件等功能并解决应用中出现的问题 3-3-6-K6 掌握 Laravel 框架构建动态网站的使用方法,并掌握应用中出现问题的解决方法
3-4
架构
设计
3-4-1 能使用ES6 新规范构建前端程序 3-4-1-S1 能使用 ES6 基础语法、代码组织构建前端程序并解决在应用中出现的问题 3-4-1-K1 掌握使用 ES6 新规范构建前端程序的方法,并掌握应用中出现问题的解决方法
3-4-2 能使用Node.js 构建高性能服务器端环境 3-4-2-S2 能使用 Node. js 的异步编程、异步 IO,包管理以及模块构建高性能服务器端环境,并解决在应用中出现的问题 3-4-2-K2 掌握使用 Node.js 构建高性能服务器端环境的方法,并掌握应用中出现问题的解决方法
3-4-2-S3 能使用 Node.js Web 应用框架 Express 构建网站 3-4-2-K3 掌握设置中间件来响应 HTTP 请求的方法,并掌握应用中出现问题的解决方法
3-4-3 能掌握Vue 前端框架并完成组件封装 3-4-3-S4 能使用 Vue 组件、工程化工具、路由、Vuex 状态管理以及 UI库进行组件封装并解决应用中出现的问题 3-4-3-K4 掌握 Vue 渐进式框架进行网站架构设计的使用方法,并掌握应用中出现问题的解决方法
网站
性能
优化
3-5
性能
优化
3-5-1 能熟练进行 HTML、CSS代码结构优化 3-5-1-S1 能熟练使用语义化、代码规范、去掉无意义字符等优化方式进行网页代码结构的优化 3-5-1-K1 掌握使用 HTML、CSS 进行代码结构优化的方法,并掌握应用中出现问题的解决方法
3-5-2 能进行图片资源优化 3-5-2-S2 能通过对图片的压缩、优化、加载的方式实现网站图片资源优化 3-5-2-K2 掌握对图片资源优化的方法,并掌握应用中出现问题的解决方法
3-5-3 能进行前端资源加载优化 3-5-3-S3 能使用 HTTP 缓存、预加载技术实现前端资源加载优化 3-5-3-K3 掌握前端资源加载优化的方法,并掌握应用中出现问题的解决方法
3-5-4 能熟练使用 Webpack 分析项目结构,并将JavaScript 模块及其他浏览器不能直接运行的拓展语言打包为合适的格式以供浏览器使用 3-5-4 -S4 能熟练使用 Webpack 的Output 出口、Plugin 插件、Module 模块技术打包网站资源 3-5-4-K4 掌握 Webpack 打包的基本方法,并掌握应用中出现问题的解决方法
移动
端静
态网
站开
3-6
移动
端静
态网
页开
3-6-1 能够利用HTML5 进行移动端静态网页优化 3-6-1-S1 能熟练使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能并解决应用中出现的问题 3-6-1-K1 掌握 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素开发静态网站的知识,并掌握应用中出现问题的解决方法
3-6-2 能运用CSS3 新特性调整页面属性 3-6-2-S2 能熟练使用 CSS3 的选择器、背景特性、盒模型、多列布局、弹性布局等属性开发移动端网页并解决应用中出现的问题 3-6-2-K2 掌握 CSS3 新特性、动画效果、2D、3D 功能知识,并掌握应用中出现问题的解决方法
3-6-3 能熟练使用 JavaScript 开发交互效果页面 3-6-3-S3 能熟练使用 JavaScriptOOP、原型链、常用设计模式等功能并解决应用中出现的问题 3-6-3-K3 掌握 JavaScript OOP面向对象程序设计的方法,并掌握应用中出现问题的解决方法
3-6-4 能熟练使用 Bootstrap 前端框架进行快捷开发 3-6-4-S4 能熟练使用 Bootstrap 栅格系统、基本样式、组件、Less 和 Sass、插件、Bootstrap 定制及优化、Bootstrap 内核解码等功能并解决应用中出现的问题 3-6-4-K4 掌握 Bootstrap 开发Web 应用程序和网站前端框架的方法,并掌握应用中出现问题的解决方法
3-6-5 能熟练使用 Canvas 绘制网页图表、动画等 3-6-5-S5 能熟练使用 Canvas 绘制功能美化网页,并解决应用中出现的问题 3-6-5-K5 掌握使用 Canvas 绘制的方法,并掌握应用中出现问题的解决方法
3-6-6 能熟练使用 SVG 描述二维矢量图形 3-6-6-S6 能熟练使用 SVG 可缩放矢量图形功能美化网页,并解决应用中出现的问题 3-6-6-K6 掌握 SVG 可缩放矢量图形的使用方法,并掌握应用中出现问题的解决方法
3-6-7 能熟练使用Less实现静态网页的动态样式 3-6-7-S7 能使用 Less 语法进行网页美化,并解决应用中出现的问题 3-6-7-K7 掌握 Less 语法知识,并掌握应用中出现问题的解决方法
3-7
移动
端静
态网
页美
3-7-1 能够利用HTML5 进行静态网页美化 3-7-1-S1 能熟练使用 HTML5 新增语义化元素、页面增强元素与属性及多媒体元素等功能,并解决应用中出现的问题 3-7-1-K1 掌握 HTML5 新增全局属性、结构化与页面增强、表单标签、多媒体元素开发静态网站的知识,并掌握应用中出现问题的解决方法
3-7-2 能运用CSS3 新特性调整页面属性 3-7-2-S2 能使用 CSS3 的边框特性、颜色、字体、盒阴影、背景特性、渐变、过渡等属性美化移动端网页并解决应用中出现的问题 3-7-2-K2 掌握解决 CSS3 新特性、动画效果、2D、3D 功能知识,并掌握应用中出现问题的解决方法
移动
端动
态网
站开
3-8
动态
网页
开发
3-8-1 能熟练使用 MySQL 数据库进行数据管理 3-8-1-S1 能熟练使用 MySQL 数据库创建表、设置约束、设置自增型字段、复制表结构、修改表、修改字段、修改约束条件、修改表名、删除表、插入/修改/查询/存储数据、触发器、事务、视图等功能进行数据管理,并解决应用中出现的问题 3-8-1-K1 掌握使用 MySQL 中创建修改删除表、数据的基本操作进行数据管理的知识,并掌握应用中出现问题的解决方法
3-8-2 能熟练使用 PHP 制作动态网页 3-8-2-S2 能熟练使用 PHP 的编码技术操作 MySQL 数据库,进行动态网站开发
3-8-3-S3 能熟练使用 Session 的操作、Cookie 的操作开发动态网站
3-8-2-K2 掌握 PHP 基本语法、数据类型、数据输出、编码规范、常量、变量、PHP 运算符、数据类型转换、条件判断语句、循环控制语句、跳转语句和终止语句、一维数组、二维数组、遍历与输出数组、函数、PHP 操作 MySQL 数据库、管理 MySQL 数据库中的数据、Session 的操作、Cookie 的操作等功能和应用中出现问题的解决方法
3-8-3 能熟练使用 Ajax 创建动态网页 3-8-3-S4 能使用 Ajax 的 XML、JSON数据格式、 JSONP 跨域等功能创建态网页,并解决应用中出现的问题 3-8-3-K3 掌握 Ajax 进行数据交互的使用方法
3-8-4 能熟练使用 Bootstrap 前端框架进行快捷开发 3-8-4-S5 能使用 Bootstrap 的栅格系统、基本样式、组件、插件、定制及优化等功能,并解决应用中出现的问题 3-8-4-K4 掌握使用 Bootstrap布局、组件、Sass 功能快捷开发前端框架的知识和解决应用出现问题的方法
3-8-5 能熟练使用 jQuery Mobile 开发移动 Web网站 3-8-5-S6 能熟练使用 jQuery Mobile设计弹出框、设计侧滑面板、设计相册、设计九宫格、设计通讯录组建Web 网站,并解决应用中出现的问题 3-8-5-K5 掌握使用 jQueryMobile 创建移动 Web 应用的方法,并掌握应用中出现问题的解决方法
3-9
架构
设计
3-9-1 使用 ES6新规范构建前端程序 3-9-1-S1 能使用 ES6 基础语法、代码组织构建前端程序并解决在应用中出现的问题 3-9-1-K1 掌握使用 ES6 新规范构建前端程序的方法
3-9-2 使用Node.js 构建高性能服务器端环境 3-9-2-S2 能使用 Node.js 的交互模式、事件循环、函数路由构建高性能服务器端环境 3-9-2-K2 掌握使用 Node.js 构建高性能服务器端环境的方法
3-9-3 能熟练使用 Vue 框架进行用户界面构建 3-9-3-S3 能使用 Vue 组件、Vue 工程化开发、Vue 路由、Vue 状态管理进行网站架构设计 3-9-3-K3 掌握使用 Vue 渐进式框架进行网站架构设计的方法
移动
端性
能优
3-10
性能
优化
3-10-1 能熟练进行 HTML、CSS 代码结构优化 3-10-1-S1 能熟练使用语义化、代码规范、去掉无意义字符等优化方式进行网页代码结构的优化 3-10-1-K1 掌握使用 HTML、CSS 进行代码结构优化的知识
3-10-2 能进行图片资源优化 3-10-2-S2 能对图片的压缩、加载的方式实现网站图片资源优化 3-10-2-K2 掌握对图片资源优化的方法
3-10-3 能进行前端资源加载优化 3-10-3-S3 能使用 HTTP 缓存、预加载技术实现前端资源加载优化 3-10-3-K3 掌握前端资源加载优化的方法 /td>
3-10-4 能熟练使用 Webpack 分析项目结构,并将 JavaScript 模块及其他浏览器不能直接运行的拓展语言打包为合适的格式以供浏览器使用 3-10-4 -S4 能熟练使用 Webpack 的Output 出口、Plugin 插件、Module 模块技术打包网站资源 3-10-4-K4 掌握 Webpack 打包的基本方法

附件:名词解释

  •         1.HTML:超文本标记语言,标准通用标记语言下的一个应用。
  •         2.CSS: 层叠样式表(英文全称:Cascading Style Sheets),是一种用来表现 HTML(标准通用标记语言的一个应用)或 XML(标准通用标记语言的一个子集)等文件样式的语言,用于为 HTML 文档定义布局。
  •         3.JavaScript: 一种直译式脚本语言,其主要作用是在不与服务器交互的情况下修改 HTML 页面内容, 为网页添加各式各样的动态功能。Ecma 国际以 JavaScript 为基础制定了 ECMAScript 标准。
  •         4.jQuery: 是一个快速、简洁的 JavaScript 框架,是一个优秀的JavaScript 代码库(或 JavaScript 框架)。
  •         5.DOM: 文档对象模型(Document Object Model,简称 DOM),是 W3C 组织推荐的处理可扩展标志语言的标准编程接口。
  •         6.UI: 即 User Interface(用户界面)的简称。泛指用户的操作界面,包含于移动 APP、网页、智能穿戴设备等。
  •         7.CSS3: 是 CSS(层叠样式表)技术的升级版本,于 1999 年开始制订,2001 年 5 月 23 日 W3C 完成了 CSS3 的工作草案,主要包括盒子模型、列表、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块 。
  •         8.CSS hack: 通过在 CSS 样式中加入一些特殊的符号,区别不同浏览器制作不同的 CSS 样式的设置,解决浏览器显示网页特效不兼容性问题。
  •         9.PHP: 超文本预处理器(Hypertext Preprocessor),PHP 将程序嵌入到 HTML 文档中去执行,是 Web 开发动态网页制作技术之一。
  •         10. IFRAME: 是 HTML 标签,作用是文档中的文档,或者浮动的框架(FRAME)。
  •         11. Html5: 万维网的核心语言,标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改,其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时更好地支持网页中嵌入各种媒体。
  •         12. OOP: 面向对象编程(Object Oriented Programming,OOP,面向对象程序设计)是一种计算机编程架构。
  •         13. Bootstrap: 是美国 Twitter 公司的设计师 Mark Otto 和 JacobThornton 合作基于 HTML、CSS、JavaScript 开发的简洁、直观的前端开发框架,使得 Web 开发更加快捷。
  •         14. Less: 是一种 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量、混入、函数等功能,让 CSS 更易维护,方便制作主题和扩充。使用 CSS 的语法。
  •         15. Sass: Sass(Syntactically Awesome Style Sheets)是一个相对新的编程语言,Sass 为 web 前端开发定义一套新的语法规则和函数,以加强和提升 CSS,Sass 的安装需要 Ruby 环境。
  •         16. MySQL: 是一个关系型数据库管理系统,由瑞典 MySQL AB公司开发,目前属于 Oracle 旗下产品。
  •         17. API: (Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而无需访问源码,也无需理解内部工作机制的细节。
  •         18. HTTP: 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议。
  •         19. RESTful: 表现层状态转化(Representational State Transfer)软件架构风格,提供了一组设计原则和约束条件。
  •         20. Web: (World Wide Web)即全球广域网,也称为万维网,它是一种基于超文本和 HTTP 的、全球性的、动态交互的、跨平台的分布式信息系统。
  •         21. Ajax: 即 “Asynchronous Javascript And XML” ( 异 步JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术。
  •         22. XML: 可扩展标记语言,标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言。
  •         23. JSON: (JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。
  •         24. JSONP: (JSON with Padding)是 JSON 的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。
  •         25. Laravel: Laravel是一套简洁、优雅的PHP Web开发框架(PHPWeb Framework)。
  •         26. BLADE: 快速搭建一个 Web 应用程序的开源框架
  •         27. Session: 会话,指浏览器和服务器的一次交互。
  •         28. Cookie: 有时也用其复数形式 Cookies,指某些网站为了辨别用户身份、跟踪 session 而储存在用户本地终端上的数据(通常经过加密)。
  •         29. jQuery Mobile: 是 jQuery 框架的一个组件,用于创建移动端Web 应用的的前端框架。
  •         30. ES6: ECMAScript 语言规范第六版。ECMAScript 是一种由Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言,是 JavaScript的标准。
  •         31. Node.js: 是 JavaScript 运行在服务端的平台。
  •         32. Express: 是一个简洁而灵活的 node.js Web 应用框架。
  •         33. VUE: 是一套构建用户界面的渐进式框架。
  •         34. Webpack: 是一个模块打包工具,将 Web 开发的各种资源打包压缩在指定的文件中。
  •         35. Canvas: 画布,是 HTML5 中新增的标签,用于网页实时生成图像,并且可以操作图像内容。
  •         36. SVG: 可缩放矢量图形,是基于可扩展标记语言 XML(标准通用标记语言的子集)用于描述二维矢量图形的一种图形格式。
加群主微信
购买后
拉进交流群
学习交流
¥2048元 立即购买
¥4096元 立即购买