幾年，Web前端的發展非常迅速，并呈現出一片欣欣向榮的景象。但層出不窮的新技術又擾亂了開發人員的思緒，以致很多開發人員疲于學習新技術而忽略了最基礎的技術修煉。很多開發人員介紹最新技術時頭頭是道，卻無法制作出一個符合W3C規范的HTML頁面。國內Web前端開發者普遍不重視代碼規范以及網站前端性能，很多網站甚至連最基本的前端代碼壓縮和合并都沒有。本書立足于Web前端開發的基礎，介紹如何編寫符合W3C規范、可維護性好且高性能的Web前端代碼。
本書主要內容和特色：
以W3C Web規范為基礎展開討論，介紹Web前端開發中的最佳實踐方法及編碼風格，為Web前端開發人員快速成長提供一條捷徑。
介紹近年來涌現出來并已經得到廣泛應用的大量工具和技術方案，為開發人員從事Web前端開發打下堅實的基礎。
循序漸進地介紹Web前端開發中的HTML、CSS、JavaScript編碼實踐方法，同時介紹Web移動端開發的實踐，讓讀者對Web前端開發有一個全面的理解和認知。

寫這本書

Web前端開發入門難度并不高，但是初學者如果沒有一個很好的學習和編碼習慣，則開發水平的提高速度會變得很慢。下面幾點是影響Web前端開發者技術提高的主要因素。

其一是開發者缺乏良好的實踐指導。Web前端興起的時間不長，很多大學都還沒有來得及開一門專門講解Web前端的課程，因此，大部分的Web前端開發者都是通過自學的方式來了解Web前端相關的技術。開發者學習前端技術的渠道很多，其中很大一部分是通過查找網絡資源的方式，而網絡上充斥著大量的錯誤或者過時的實踐方法，這些實踐方法很容易誤導初學者，使得初學者養成了一些不良的開發習慣。因此，Web前端開發的初學者非常需要一些能幫助他們快速、正確地進行Web前端開發的最佳實踐方法。

其二是開發者容易產生浮躁的情緒。Web前端雖然興起時間不長，但是發展很迅速，技術的更新換代也非常快，這本來是一件好事情，但也使得很多Web前端開發者產生了浮躁的情緒。開發者疲于追逐各種最新的技術，而忽略了最基礎的技術概念。這些開發者對Node. js、AngularJS、Polymer等相關概念相當熟悉，但對HTML標準規范、AJAX的原理、CSS選擇器的優先級等基本的概念卻理解得不夠深入。實質上，雖然Web前端技術更新換代速度很快，但也離不開HTML、CSS、JavaScript這3個基本的技術。Web前端的開發者應該明白：只有掌握了扎實的基礎知識，才能在學習新技術的時候更容易上手，并且更快地理解新技術的原理，否則只是接觸新技術的皮毛而已。

其三是開發者不善于利用各種開發工具。人類文明之所以快速發展，和人類善于使用工具是分不開的。人類是感性動物，并不能保證每次都能正確地做同樣的事情，但工具不一樣，只要環境相同，工具每次處理的結果應該是一樣的。類比到Web前端開發中，聰明的程序員應該學會利用各種輔助開發工具來提高開發效率，減少不必要的錯誤。Web前端開發中的工具覆蓋了開發過程的方方面面，包括設計、開發、測試、部署等階段的輔助工具。善于使用工具也是Web前端開發中必備的一項技能。

筆者從2002年開始接觸軟件開發，先后接觸過各種主流的開發技術，包括各種Web開發技術。從2008年開始，主要從事Web前端開發的工作。在這么多年的Web網站開發過程中，筆者深知技術基礎、編碼規范、輔助開發工具對軟件開發的重要性，因此，在平時的開發中會特別注重這方面的積累，也非常樂意分享個人的開發經驗以及使用過的效果較好的開發工具。

本書綜合了筆者這些年來積累的各種Web前端開發經驗以及各種高效的Web前端開發實踐。如果把這些實踐方法稱為最佳實踐，則有可能會引來爭議，但這些實踐方法的確是認可度很高的方法。從內容上說，本書是一本介紹如何高效地從事Web前端開發的書籍，而不是講解Web前端技術的書籍。雖然技術更新非常快，但高效的開發實踐方法則相對會更新得慢一些。開發者掌握這些高效的實踐方法，會在開發過程中節省大量的成本，另外，在學習新技術的過程中，也會應對自如。

讀者對象

本書主要適合以下讀者：

對Web前端有濃厚興趣的讀者

Web前端開發工程師

Web項目的管理人員

如何閱讀本書

本書將分為五大部分，第一部分為概述，第二、三、四部分分別介紹HTML、CSS、JavaScript相關的實踐方法，最后一部分簡單介紹移動Web開發相關的實踐方法。每個部分相對獨立，讀者可以從頭至尾通讀，也可以選擇感興趣的部分

閱讀。

第一部分（第1、2章）為高效Web前端開發綜述。這部分將介紹前端開發中的基本規范、代碼組織、重構及測試相關話題，同時也介紹一些好用的開發輔助

工具。

第二部分（第3～5章）為HTML相關開發最佳實踐。這部分貼合W3C標準，介紹如何編寫符合標準的、語義化的、可維護性高的HTML代碼，并簡單介紹HTML5規范中新添加的標簽和屬性的使用。

第三部分（第6～8章）為CSS相關開發最佳實踐。這部分介紹如何編寫高維護性和高性能的CSS代碼。并簡單介紹如何高效地使用CSS3中新添加的特性。

第四部分（第9～11章）為JavaScript相關開發最佳實踐。該部分同樣包含了如何編寫高維護性和高性能的JavaScript代碼。同時，編寫JavaScript代碼也要考慮代碼的安全性，因此，該部分也會介紹Web前端中的各種攻擊及防范方法。

第五部分（第12章）為移動Web開發相關最佳實踐。移動Web開發興起的時間不長，很多開發實踐方法也在總結和摸索階段。前面四部分介紹的大部分實踐方法同樣適用于移動Web開發。另外，這個部分會簡單介紹在移動Web開發時特別需要關注的實踐方法。

勘誤和支持

由于作者的水平有限，書中難免會出現一些錯誤或者不準確的地方，懇請讀者批評指正。本書引用了大量的網絡資源，但隨著時間的推移，很難保證所有的資源都可以訪問，因此，我把部分網絡引用資源備份到我的個人網站：http://www.dang-jian.com，供讀者查閱。同時，在該網站上也提供了本書中的源代碼的下載。另外，在該網站上開辟了一個專門的欄目，用于勘誤和問題咨詢，歡迎讀者提交在本書中發現的錯誤。如果對本書中的觀點有不同的見解，也歡迎來該網站與筆者交流討論。為方便讀者，也歡迎發送郵件至我的郵箱：hunterdang@gmail.com。

致謝

首先，感謝西安葡萄城信息技術有限公司，正是借助該公司在博客園上的官方技術博客，我才能夠將很多的技術思想表達出來。另外，通過在這個博客上寫作，促成了本書的出版。

感謝經常和我在一起討論技術的小伙伴們：張凌、許佳瑟、黃海濤、楊波、梁真。他們在本書的寫作過程中提供了很多寶貴的意見，為本書增色不少。

感謝機械工業出版社的編輯楊繡國，感謝你容忍我多次推遲交稿時間，并且非常耐心地糾正各種表達上的錯誤。從你身上，我感受到了一個編輯的敬業精神。

謹以此書，獻給我的妻子李瑩鴿。她為了讓我有更多的寫作時間，毫無怨言地承擔起了更多的家庭責任。如果沒有她的鼓勵和督促，我都不知道什么時候才能完成本書的寫作。我兒子的出生也給了我很大的動力。每當我苦惱于如何把一些開發理念表達清楚時，兒子調皮的笑聲緩解了我不小的壓力。



黨　建

馬來西亞吉隆坡