基礎(chǔ)：
1、語義化H5標簽
1.1删掀、H5引進了一些新的標簽翔冀，特別注意article、header披泪、footer纤子、aside、nav等款票，注意HTML的標題結(jié)構(gòu)
1.2控硼、理解瀏覽器解析HTML的過程，理解DOM的樹形結(jié)構(gòu)艾少，及相應(yīng)API
1.3卡乾、理解HTML標簽在各個瀏覽器上的默認樣式（代理樣式），理解CSS中的重置樣式表的概念
1.4缚够、理解Canvas幔妨、SVG、video等功能性標簽
1.5潮瓶、理解form、iframe標簽钙姊，理解文件提交過程
推薦書籍：
1毯辅、《HTML5秘籍》
2、高健壯性CSS
2.1煞额、學習基礎(chǔ)知識思恐，包括大部分常用屬性、選擇器的用法膊毁，要對大多數(shù)標簽有個基礎(chǔ)概念
在日常使用的基礎(chǔ)上胀莹，嘗試學習瀏覽器兼容性問題，要知道兼容性的主要問題及解決方法
2.2婚温、深入理解盒子模型描焰，區(qū)分塊級元素、行內(nèi)元素，有幾個比較重要的屬性：
display荆秦、float篱竭、position，一定要弄清楚
區(qū)分盒子昭卓、行內(nèi)盒子的概念
另外可以考慮學一些預(yù)編譯語言：sass爵嗅、less奄妨，都很簡單
2.3、學習常用框架吕喘，可以使用bootstrap構(gòu)建項目
2.4、學習框架的代碼組織方式
包括：12格柵系統(tǒng)刑桑、組件化氯质、組件的風格化等
2.5、學習CSS 3的新功能漾月，特別是動畫效果病梢、選擇器
2.6、認真學習一些CSS對象化思想梁肿，學習編寫簡潔性蜓陌、高復(fù)用性、高健壯性的CSS
2.7吩蔑、有空的話钮热，可以看看所謂的扁平化設(shè)計，還有簡潔性
2.8烛芬、理解CSSOM隧期、render、reflow赘娄、CSS性能仆潮、CSS阻塞概念
學習方法：
1、多看別人的代碼遣臼，一些設(shè)計的不錯的網(wǎng)站就是很好的學習素材性置，比如拉勾網(wǎng)
2、一定要學會使用grunt揍堰、gulp壓縮CSS
3鹏浅、display + position + float 可以組合出很復(fù)雜的效果，多想想盒子模型
4屏歹、嘗試在不用float隐砸，且position不為absolute的情況下實現(xiàn)等高、等寬等布局
推薦書籍：
1蝙眶、《圖靈程序設(shè)計叢書:HTML5與CSS3設(shè)計模式》
2季希、《Web開發(fā)技術(shù)叢書:深入理解Bootstrap》
3、《高流量網(wǎng)站CSS開發(fā)技術(shù)》
4、《CSS設(shè)計徹底研究》? ?? ?? ?? ?? ? 這個一定要
5胖眷、《Web開發(fā)技術(shù)叢書:深入理解Bootstrap》
6武通、可以找一些專門講SASS的書，但是我沒找到
7珊搀、《CSS權(quán)威指南(第3版)》
3冶忱、深入學習JS
3.1、重新學習JS語法境析，注意：表達式（特別是函數(shù)訪問表達式）囚枪、語句、類型（包括類型判斷）
注意劳淆，這個時候主要傾向于“原生”JS哦链沼，不要使用框架
3.2、深入理解JS的“一級函數(shù)”沛鸵、對象括勺、類的概念
學會使用函數(shù)來構(gòu)造類、閉包曲掰，學會用面向?qū)ο蟮姆绞浇M織代碼
3.3疾捍、深入理解JS的作用域、作用域鏈栏妖、this對象（在各種調(diào)用形式中乱豆，this的指向）
理解函數(shù)的各種調(diào)用方法（call、apply吊趾、bind等）
3.4宛裕、理解對象、數(shù)組的概念
理解對象的“[]”調(diào)用论泛，理解對象是一種“特殊數(shù)組”
理解for語句的用法
深入理解JS中原始值揩尸、包裝對象的概念（重要）
3.5、學習一些常用框架的使用方法屁奏，包括：JQUERY岩榆、underscore、EXTJS了袁，加分點有：backbone朗恳、angularjs湿颅、ejs载绿、jade
通過比較多個框架的使用方法，想清楚“JS語言極其靈活”這一事實
總結(jié)常見用法油航，提高學習速度
學習模塊化開發(fā)（使用require.js崭庸、sea.js等）
3.6、適當看一些著名框架的源碼，比如jQuery（不建議看angularjs怕享，太復(fù)雜了）
重要的是學習框架中代碼的組織形式执赡，即設(shè)計模式
3.7、了解JS解釋函筋、運行過程沙合，理解JS的單線程概念
深入理解JS事件、異步跌帐、阻塞概念
3.8首懈、理解瀏覽器組成部件，理解V8的概念
學習V8的解釋-運行過程
在V8基礎(chǔ)上谨敛，學會如何提高JS性能
學會使用chrome的profile進行內(nèi)存泄露分析
學習方法：
1究履、提高對自己的要求，要有代碼潔癖
2脸狸、適當?shù)臅r候看看優(yōu)秀框架的源碼最仑，特別是框架的架構(gòu)模式、設(shè)計模式
3炊甲、多學學設(shè)計模式
4泥彤、學習原生JS、DOM蜜葱、BOM全景、Ajax
推薦書籍：
1、《O'Reilly精品圖書系列:JavaScript權(quán)威指南(第6版)》? ?? ???必看
2牵囤、《JavaScript設(shè)計模式》
3爸黄、《WebKit技術(shù)內(nèi)幕》
4、《JavaScript框架高級編程:應(yīng)用Prototype YUI Ext JS Dojo MooTools》
5揭鳞、《用AngularJS開發(fā)下一代Web應(yīng)用》
6炕贵、跨終端
6.1、理解混合APP的概念
6.2野崇、理解網(wǎng)頁在各類終端上的表現(xiàn)
6.3称开、理解網(wǎng)頁與原生app的區(qū)同，重在約束
6.4乓梨、理解單頁網(wǎng)站鳖轰，特別要規(guī)避頁面的內(nèi)存泄露問題
6.5、入門nodejs扶镀，對其有個基礎(chǔ)概念蕴侣，知道它能做什么，缺點是什么
推薦書籍：
1臭觉、《單頁Web應(yīng)用:JavaScript從前端到后端 》
2昆雀、《Web 2.0界面設(shè)計模式》
3辱志、《響應(yīng)式Web設(shè)計:HTML5和CSS3實戰(zhàn)》
5、工具
學會使用grunt進行JS狞膘、CSS揩懒、HTML 壓縮，特別是模塊化js開發(fā)時候的壓縮
會用PS進行切圖挽封、保存icon
入手sublime已球、webstorm
學會使用chrome調(diào)試面板，特別是：console辅愿、network和悦、profile、element
點擊鏈接加入群【W(wǎng)eb前端開發(fā)學習】：https://jq.qq.com/
進階：
1渠缕、性能
1.1鸽素、理解資源加載的過程
包括：TCP握手連接、HTTP請求報文亦鳞、HTTP回復(fù)報文
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性能權(quán)威指南》
2稚字、雅虎網(wǎng)站頁面性能優(yōu)化的34條黃金守則
2饲宿、http及TCP協(xié)議族
2.1、學習http協(xié)議胆描，理解http請求-響應(yīng)模式
2.2瘫想、理解http是應(yīng)用層協(xié)議，它是構(gòu)建在TCP/IP協(xié)議上的
2.3昌讲、理解http報文（請求-響應(yīng)報文）
2.4国夜、理解http代理、緩存剧蚣、網(wǎng)關(guān)等概念支竹，指定如何控制緩存
2.5、理解http協(xié)議內(nèi)容鸠按，包括：狀態(tài)碼礼搁、http頭、長連接（http1.1）
2.6目尖、學習http服務(wù)器的工作模型馒吴，對靜態(tài)文件、CGI瑟曲、DHTML的處理流程有個大致概念
推薦書籍：
1饮戳、《HTTP權(quán)威指南》
2、《TCP/IP詳解》
3洞拨、《圖解TCP/IP(第5版)》
3扯罐、安全性
XSS、SQL注入
額烦衣，看下來發(fā)現(xiàn)自己要學習的東西太多啦...埋頭好好學吧歹河！
想學好前端的可以來我們晚上的課堂聽課，每天晚上都會講一個小案例或小項目或分析前端面試以及工作和發(fā)展花吟，更多的是談一些學習路線和方法秸歧，零基礎(chǔ)和原生JavaScript都有，加web前端開發(fā)學習群：617327703（這些都是免費的衅澈，每天都有）給你課堂地址和往期錄制好的視頻键菱。
