第一阶段：专业核心基础

里程碑：

1. 精通CSS3、Less、Sass、响应式书籍布局、以及移动开发。

2. 熟练运用HTML+CSS特性完成页面布局。

4. 精通CSS3技术、动画、以及灵活的盒子模型设计。

5.熟练进行移动端页面设计。

6.能够运用所学的知识来复制任何网站。

7.能够综合运用所学知识完成实际的网页设计。

知识点：

1、Web前端开发环境，常用HTML标签、表单元素、布局、CSS样式表、DIV+CSS布局。熟练使用HTML、CSS样式属性完成页面布局和美化，能复制任意网站前端页面。

2. CSS3 选择器、伪类、过渡、变换、动画、字体图标、弹性盒子模型、响应式布局、移动端。熟练使用 CSS3 开发网页，精通移动端开发，整理网页开发技巧。

3、预编译CSS技术：less、sass基础知识，以及插件的使用和源码分析。能够熟练使用less、sass完成项目开发，对其有较深的理解。

4、运用HTML、CSS、LESS、SASS等技术完成网页项目。通过项目，掌握HTML、CSS第一阶段的内容，完成PC页面设计和移动端页面设计。

第二阶段：Web后端技术

里程碑：

1、了解发展历史，掌握Node环境的搭建以及npm的使用。

2.掌握基本数据类型和变量的概念。

3.熟练使用运算符。

4.对分支结构语句、循环语句有深入的理解。

5.熟练使用数组完成各种练习。

6.熟悉es6语法，精通面向对象编程。

7、DOM和BOM实战练习及H5新特性、协议学习。

知识点：

1. 软件开发流程、算法、变量、数据类型、除法语句、循环语句、数组和函数。熟练运用知识完成各类练习。

2.面向对象基础，异常处理机制，常用对象API，js兼容性，ES6新特性。精通面向对象开发，掌握es6重要内容。

3、BOM操作和DOM操作。熟练使用各种BOM对象，熟练操作DOM对象。

4.H5相关API、Ajax、数据模拟、事件等，熟练运用所学知识完成网站项目开发。

第三阶段：数据库和框架实践

里程碑：

1、综合运用Web前端技术进行页面布局和美化。

2、综合运用Web前端开发框架，开发Web系统。

3.精通数据库开发。

4. 精通vue.js，等前端框架技术。

5. 熟练使用Node.js开发后端应用程序。

6、对Ajax、JSON、开发流程有深入的理解，掌握基本的git技能。

知识点：

1. 数据库知识、范例、配置、命令、数据库及表的创建、数据的增删改查、数据库。深入了解数据库管理系统的常识以及数据库的使用和管理，为 Node.js 后台开发打下坚实的基础。

2.模块体系、函数、路由、全局对象、文件系统、请求处理、Web模块、框架、数据库处理、文件上传等。熟练使用Node.js运行环境及后台开发框架完成Web系统后台开发。

3. Vue 组件、生命周期、路由、组件、前端工程化、框架。了解 Vue.js 框架的基本使用，能够使用 Vue.js 完成基本的前端开发，熟练使用 Vue.js 框架的高级功能完成 Web 前端开发和组件开发，对 MVVM 模型有深刻理解。

4、需求分析，数据库设计，后端开发，使用vue和node完成PC端和移动端整个网站的开发。基于Node.js+Vue.js++++Git实现整个网站项目的完整功能并发布上线。

第四阶段：移动和微信实践

里程碑：

1、精通.js框架，熟练使用.js完成开发。

2.掌握移动开发原理，了解原生开发和混合开发。

3.熟练使用-和框架完成移动端开发。

4、掌握微信小程序，了解支付宝小程序的开发。

5、完成大型电子商务项目的开发。

知识点：

1. 面向组件编程，表单数据，组件通信，监控，声明周期，路由，基本概念。实践使用完成项目开发，掌握异步解决方案Saga。

2. 分别练习并掌握-、开发工具、视图与渲染、api操作、环境搭建、路由、组件、网络请求、打包。 分别练习并掌握-和框架、并使用-和开发移动项目。

3、微信小程序基础介绍、开发工具、视图与渲染、API操作、支付宝小程序入门及API学习，掌握微信小程序开发，了解支付宝小程序。

4.大型购物网站实践，整个项目前后端分开开发；整个项目分为PC网页、手机APP、小程序、后台管理四个部分。团队协作开发，使用git进行版本控制。项目进行过程中，可以自行扩展.js，.

前端工程师是互联网时代软件产品开发中不可或缺的专业研发角色。狭义上，前端工程师利用Html、CSS等专业技术和工具，将UI设计稿实现为网站产品，覆盖用户PC和移动端网页，处理视觉和交互问题。广义上，用户终端产品中与视觉、交互相关的部分，都是前端工程师的专业领域。

其实前端工程师最核心的技能一直是Html、CSS和。今天小编就为大家整理了这三部分需要掌握的主要技术。

1. HTML

对于Html部分，需要了解常见的浏览器及浏览器内核，理解语义的概念，掌握语法及使用技巧，掌握常见的标签，掌握新的版式标签，多媒体标签等。

CSS

CSS部分主要知识包括掌握CSS语法及使用技巧；掌握DIV+CSS布局方法；掌握常见网页布局方式；掌握图片切分、插件切分；能熟练使用开发者工具调试页面；能独立完成基于PSD文件的静态页面开发；掌握3D变换、动画效果；能使用CSS3新属性美化、修改网页；了解手机屏幕、手机浏览器、操作系统的区别；掌握常见的移动调试方法；掌握常见的移动适配方法；掌握CSS预处理器less的使用；掌握常见移动框架的使用；掌握常见的移动页面开发；掌握响应式布局开发；掌握响应式页面的开发；掌握网页开发技术选型以适配不同终端等。

三，

是赋予页面交互效果所需要的技术，该部分要求掌握基本语法；掌握常见算法；掌握各种DOM操作；熟练使用面向对象的思维进行DOM编程；掌握高级语法；掌握常见的兼容方案；熟练使用DOM操作；熟练使用和编写案例等。

以上就是Web前端人员在Html、CSS、方面需要掌握的内容，一个优秀的Web开发工程师除了这三个方向之外，还需要熟练掌握各种前端框架的使用以及一些当前流行的技术，这些都需要在平时的开发过程中不断的积累和学习。

前端开发是创建网页或应用程序等前端界面呈现给用户的过程。前端开发使用 HTML、CSS 以及由此衍生的各种技术、框架和解决方案来实现互联网产品的用户界面交互 [1]。它由网页制作演变而来，名字就带有明显的时代特征。在互联网的演进中，网页制作是 Web 1.0 时代的产物。早期网站的主要内容是静态的，以图片和文字为主，用户在网站上的行为以浏览为主。随着互联网技术的发展和 CSS3 的应用，现代网页更加美观，交互效果显著，功能更加强大。[2]

移动互联网带来了大量高性能的移动终端设备和快速的无线网络，node.js得到了广泛的应用，各类框架库层出不穷。

（2）前端模板JS+数据，减少HTML标签带来的带宽浪费，前端使用变量保存AJAX请求结果，每次操作都在局部变量上进行，不需要进行请求，减少请求次数

（3）用它来替代DOM操作，减少DOM操作次数，优化性能。

（4）当需要设置的样式较多时，应先进行设置，而不要直接对样式进行操作。

（5）少使用全局变量，并缓存DOM节点搜索结果，以减少IO读取操作。

（6）避免使用 CSS（css 表达式），也称为（动态属性）。

（7）预加载图像，将样式表放在顶部，将脚本放在底部并附加时间戳。

2.什么是优雅降级？

优雅降级：网站在所有现代浏览器上都能正常运行。如果用户使用的是旧版浏览器，代码会检查以确认它们是否正常运行。由于 IE 独特的盒模型布局问题，不同版本的 IE 都实现了优雅降级的 hack，为无法支持该功能的浏览器添加替代解决方案，让体验在旧版浏览器上以某种形式降级，但不会完全失效。

3.什么是渐进增强？

渐进增强：从所有浏览器都支持的基本功能开始，逐渐添加只有新浏览器才支持的功能，并为页面添加对基本浏览器无害的额外样式和功能。当浏览器支持它们时，它们会自动出现并起作用。