前端開發入門學習有：HTML、CSS、JavaScript（簡稱JS）這三個部分。所以在學習之前我們需要先明確三個概念：
1.HTML——內容層，它的作用是表示一個HTML標簽在頁面里是個什么角色。
2.CSS——樣式層，它的作用是表示一塊內容以什么樣的樣式（字體、大小、顏色、寬高等）顯示。
3.JS——行為層，它的作用是當用戶觸發某些行為時，會給內容和樣式帶來什么樣的改變。
一、HTML，CSS部分
HTML/CSS初學，就照著http://www.w3cschool.cn/的實驗做，把http://www.w3cschool.cn/index-6.html和http://www.w3cschool.cn/index-7.html兩套做完了就入門了，
入門之后，學習CSS的精華，即布局，推薦李炎恢的教學視頻，布局這一章：http://edu.51cto.com/lesson/id-14895.html第27章，如果覺得不夠，需要實戰，則再學習接下來的28，29章。注意，這時候一定要老師講一塊代碼，自己就要照著實現一次，切勿只看不做。
CSS還有一個精華部分就是命名規范，找幾個著名網站（比如豆瓣、網易新聞）這類，研究它們的命名規范，我這里，有一個現成的命名規范可供學習（需要登錄evernote查看）：https://www.evernote.com/shard/s168/sh/7f89cc57-cab2-4712-b61b-9fde25e3ef51/d01c8e34ef05373ec06c3b2f7cfaba82/res/e0b9963b-ba7a-441a-8462-8f87c48e4cda.jpg?resizeSmall&width=832
學習完成后就是一個較為熟練的HTML/CSS使用者了.這時候如果想繼續深入學習相關類庫和框架，推薦Sass和Compass，推薦兩篇阮一峰的博客：http://www.ruanyifeng.com/blog/2012/06/sass.htmlhttp://www.ruanyifeng.com/blog/2012/11/compass.html
和這本書：《Sass and Compass in Action》http://book.douban.com/subject/6732187/
二、JavaScript部分
初學者推薦看視頻：http://edu.51cto.com/course/course_id-166-page-1.html，特別注意JavaScript的OOP寫法（重點，可多看幾遍），以及閉包、原型鏈，異步編程部分（次重點），前者寫項目都在用，后者涉及JS這個語言本質特點。
然后需要學習JS和HTML/CSS在瀏覽器下的調試方法，推薦用Google Chrome下的chrome developer tools調試，可以看這個視頻學習：http://happycasts.net/episodes/40
看完視頻并經過實踐后，可以看《Javascript good parts》（http://book.douban.com/subject/2994925/）這本書，不必細看，看它的思想即可。用于鞏固，提升JS方面的編程思想。
三、web前端學習路線思維導圖
web前端學習路線思維導圖
圖太大不好展示，看不清楚可以進入以下鏈接查看——web前端學習路線思維導圖在線版：https://www.processon.com/view/link/57d28d0ee4b0942d7a89c9dd
