1、html/html5基础：
《web标准实战》 比较简单，适合入门
《web标准设计》
《深入浅出html》
html基础没必要看什么书，只要看看基础视频，代码打熟就好了，其实不论是不是基础，学的知识点都要通过敲代码来牢记以及熟悉。
2、高健壮性css
2.1、学习基础知识，包括大部分常用属性、选择器的用法，要对大多数标签有个基础概念,在日常使用的基础上，尝试学习浏览器兼容性问题，要知道兼容性的主要问题及解决方法
2.2、深入理解盒子模型，区分块级元素、行内元素，有几个比较重要的属性：display、float、position，一定要弄清楚区分盒子、行内盒子的概念另外可以考虑学一些预编译语言：sass、less，都很简单
2.3、学习常用框架，可以使用bootstrap构建项目
2.4、学习框架的代码组织方式包括：12格栅系统、组件化、组件的风格化等
2.5、学习css 3的新功能，特别是动画效果、选择器
2.6、认真学习一些css对象化思想，学习编写简洁性、高复用性、高健壮性的css
2.7、有空的话，可以看看所谓的扁平化设计，还有简洁性
2.8、理解cssom、render、reflow、css性能、css阻塞概念学习方法：
1、多看别人的代码，一些设计的不错的网站就是很好的学习素材
2、一定要学会使用grunt、gulp压缩css
3、display + position + float 可以组合出很复杂的效果，多想想盒子模型
4、尝试在不用float，且position不为absolute的情况下实现等高、等宽等布局推荐书籍：
1、《图灵程序设计丛书:html5与css3设计模式》
2、《web开发技术丛书:深入理解bootstrap》
3、《高流量网站css开发技术》
4、《css设计彻底研究》 这个一定要
5、《web开发技术丛书:深入理解bootstrap》
6、可以找一些专门讲sass的书，但是我没找到
7、《css权威指南(第3版)》
3、深入学习js
3.1、重新学习js语法，注意：表达式（特别是函数访问表达式）、语句、类型（包括类型判断)注意，这个时候主要倾向于“原生”js哦，不要使用框架
3.2、深入理解js的“一级函数”、对象、类的概念,学会使用函数来构造类、闭包，学会用面向对象的方式组织代码
3.3、深入理解js的作用域、作用域链、this对象（在各种调用形式中，this的指向）理解函数的各种调用方法（call、apply、bind等）
3.4、理解对象、数组的概念理解对象的“[]”调用，理解对象是一种“特殊数组”理解for语句的用法深入理解js中原始值、包装对象的概念（重要）
3.5、学习一些常用框架的使用方法，包括：jquery、underscore、extjs，加分点有：backbone、angularjs、ejs、jade通过比较多个框架的使用方法，想清楚“js语言极其灵活”这一事实总结常见用法，提高学习速度学习模块化开发（使用require.js、sea.js等）
3.6、适当看一些著名框架的源码，比如jquery（不建议看angularjs，太复杂了）重要的是学习框架中代码的组织形式，即设计模式
3.7、了解js解释、运行过程，理解js的单线程概念深入理解js事件、异步、阻塞概念
3.8、理解浏览器组成部件，理解v8的概念学习v8的解释-运行过程在v8基础上，学会如何提高js性能学会使用chrome的profile进行内存泄露分析学习方法：
1、提高对自己的要求，要有代码洁癖
2、适当的时候看看优秀框架的源码，特别是框架的架构模式、设计模式
3、多学学设计模式
4、学习原生js、dom、bom、ajax推荐书籍：
1、《o’reilly精品图书系列:javascript权威指南(第6版)》 必看
2、《javascript设计模式》
3、《webkit技术内幕》
4、《javascript框架高级编程:应用prototype yui ext js dojo mootools》
5、《用angularjs开发下一代web应用》
6、《精通javascript》 第三部分非常好
7、《javascript语言精髓与编程实践》 这本书对原型和继承做了非常精辟的解释，网上大部分关于原型的文章都是参考此书的。
8、《悟透javascript》 这本书第一章是介绍原型和继承的，第三章也介绍了跨域的一个解决方法，还有就是作者对程序和人生的理解哲学很有深度。
9、《javascript权威指南》 这本书就不用说了
10、《高性能网站建设指南 》 这类书有两本不同版本，都是关于web性能优化的
11、《javascript语言精粹》 进阶的好书
12、《javascript设计模式 》 进阶的好书
seo;
《seo教程：搜索引擎优化入门与进阶》 这本书有些地方我认为说得不大确切，但是总体还不错。
6、跨终端
6.1、理解混合app的概念
6.2、理解网页在各类终端上的表现
6.3、理解网页与原生app的区同，重在约束
6.4、理解单页网站，特别要规避页面的内存泄露问题
6.5、入门nodejs，对其有个基础概念，知道它能做什么，缺点是什么推荐书籍：
1、《单页web应用:javascript从前端到后端 》
2、《web 2.0界面设计模式》
3、《响应式web设计:html5和css3实战》
4、工具学会使用grunt进行js、css、html 压缩，特别是模块化js开发时候的压缩会用ps进行切图、保存icon入手sublime、webstorm学会使用chrome调试面板，特别是：console、network、profile、element
进阶：
4、性能
1.1、理解资源加载的过程包括：tcp握手连接、http请求报文、http回复报文
1.2、理解资源加载的性能约束，包括：tcp连接限制、tcp慢启动
1.3、理解css文件、js文件压缩，理解不同文件放在页面不同位置后对性能的影响
1.4、理解cdn加速
1.5、学会使用http头控制资源缓存，理解cache-control、expire、max-age、etag对缓存的影响
1.6、深入理解浏览器的render过程推荐书籍：
1、《web性能权威指南》
2、雅虎网站页面性能优化的34条黄金守则
5、http及tcp协议族
2.1、学习http协议，理解http请求-响应模式
2.2、理解http是应用层协议，它是构建在tcp/ip协议上的
2.3、理解http报文（请求-响应报文）
2.4、理解http代理、缓存、网关等概念，指定如何控制缓存
2.5、理解http协议内容，包括：状态码、http头、长连接（http1.1）
2.6、学习http服务器的工作模型，对静态文件、cgi、dhtml的处理流程有个大致概念推荐书籍：
1、《http权威指南》
2、《tcp/ip详解》
3、《图解tcp/ip(第5版)》
最后把学习web前端分几个阶段
第一阶段：html网页开发
简介
通过学习html基础知识点，结合案例演示，进行实战项目，制作pc版页面和手机响应式页面
了解企业网页开发流程、代码书写的规范标准、网站性能优化、浏览器各版本兼容等问题处理
实战项目
主流平台前端项目
涉及知识点
html标签、html5新增标签、css样式、css3样式、媒体查询等
适合人群
前端零基础的小白，想学前端但又不知道怎么入门的同学
基础不牢固，缺乏系统学习的大学生、转行人士等
第二阶段：javascript
简介
通过学习javascript基础变量、运算符、数据类型，函数，dom高级操作，实现前端的数据处理与响应用户的各种操作
学习ajax数据交互，与json数据处理，对象解析与面向对象开发，实现网页异步更新
实战项目
2018互联网各大名企封装插件，开发组件等
涉及知识点
jquery、ajax、面向对象、http传输协议等
适合人群
已具备html基础知识与js基本操作的在校大学生、在职程序员、前端爱好人员等
第三阶段：h5高级项目开发
简介
基于原生javascript之上，学习高级3d应用场景
h5游戏开发与大数据图形处理
webapp底层交互设计
js-sdk微网站实战开发
lbs定位系统实战，异步交互与实时通信引擎
实战项目
各大主流webapp开发项目
涉及知识点
canvas、js高级应用、js-sdk、h5新增技术
适合人群
已具备熟练的前端开发技术，缺乏h5开发经验的在校大学生、在职程序员等
想系统学习的，关注后，回复“系统学习”便可获得学习方案