網站開(kāi)發(fā)開(kāi)發(fā)大緻分爲前端和後(hòu)端，前端主要負責實現視覺和交互效果，以及與服務器通信，完成(chéng)業務邏輯。其核心價值在于對(duì)用戶體驗的追求。可以按如下思路學(xué)習系統學(xué)習：

基礎知識：

1、HTML + CSS 這(zhè)部分建議在 W3school 在線教程 上學(xué)習，邊學(xué)邊練，每章後(hòu)還(hái)有小測試。 之後(hòu)可以模仿一些網站做些頁面(miàn)。在實踐中積累了一些經(jīng)驗後(hòu)，可以系統的讀一兩(liǎng)本書，推薦《Head First HTML 與 CSS 中文版》，這(zhè)本書講的太細了，我沒(méi)能(néng)拿出耐心細讀。你可以根據情況斟酌。

天貓&京東,内蒙古電商品牌策劃,内蒙古微信營銷,内蒙古微網站,呼和浩特電商品牌策劃,呼和浩特微信營銷,呼和浩特微網站,内蒙古網站制作，内蒙古網站設計，内蒙古網站建設，呼和浩特網站建設，呼和浩特網站制作、呼和浩特網站設計首選内蒙古呼和浩特先誠網絡科技公司。先誠官網：/

2、 要學(xué)的内容實在很多，如果沒(méi)有其他編程語言的基礎的話，學(xué)起(qǐ)來可能(néng)要費些力，還(hái)是建議先在 W3school上學(xué)習。之後(hòu)建議馬上看《語言精粹》，JS是一門很混亂的語言，這(zhè)本書能(néng)夠幫助你區分哪些是語言的精華，哪些是糟粕，對(duì)于語言精華，應該深入學(xué)習。糟粕部分能(néng)看懂别人寫的代碼就行，自己就不用嘗試了。

進(jìn)階：

有了以上基礎，就可以進(jìn)行一般的靜态網頁設計，不過(guò)對(duì)于複雜的頁面(miàn)還(hái)需要進(jìn)一步學(xué)習。

1、CSS。必看《精通CSS》，看完這(zhè)本書你應該對(duì)：盒子模型，流動，Block，inline，層疊，樣(yàng)式優先級，等概念非常了解了。作爲練習可以看下《CSS藝門之匠》這(zhè)本書，它對(duì)标題，背景，圓角，導航條，table，表單等主題都(dōu)有詳細的介紹。

2、。上面(miàn)提到内容還(hái)不足以讓你勝任JS編程。在有了基礎之後(hòu)，進(jìn)一步學(xué)習内容包括：

a） 框架。

推薦腳本，簡單易用，在W3school簡單學(xué)習js後(hòu)，直接上手腳本即可完成(chéng)一些簡單的項目。學(xué)習方法也很簡單，照著(zhe)産品文檔做幾個頁面(miàn)就行了，不用面(miàn)面(miàn)俱到，以後(hòu)遇到問題查文檔就行了。框架可以幫你屏蔽浏覽器的差異性，讓你能(néng)更專注與Web開(kāi)發(fā)學(xué)習的精髓部分。補充： 可以使用 Codecademy 學(xué)習 ，腳本，用戶體驗真的很好(hǎo)（感謝 TonyOuyang ）。

b）  語言範式 。這(zhè)個名字可能(néng)并不恰當，隻是我找不到可以描述“面(miàn)向(xiàng)對(duì)象”，“函數式”這(zhè)個兩(liǎng)個概念的概念。不完全是一個面(miàn)向(xiàng)對(duì)象的語言，它的很多設計理念都(dōu)有函數編程語言的影子，甚至說如果你不用面(miàn)向(xiàng)對(duì)象，完全可以把它理解成(chéng)一門函數式編程語言。

的很多語言特性，都(dōu)是因爲他具有函數式語言的特點才存在的。這(zhè)部分推薦先學(xué)習面(miàn)向(xiàng)對(duì)象的基本理論，對(duì)封裝，繼承，多态等概念要理解，維基百科，百度百科會是你的幫手，另外推薦《Object Oriented 》，應該有

中文版。對(duì)與函數式編程我了解的也不系統，不好(hǎo)多說，可以自己百度一下。

c）  語言内部機制。必須弄清如下概念：JS 中變量的作用域，變量傳遞方式，函數的定義環境與執行環境，閉包，函數的四種(zhǒng)調用方式（一般函數，對(duì)象的方法，apply，call），以及四種(zhǒng)調用方式下，‘this’指向(xiàng)的是誰。這(zhè)部分内容你會在《語言精粹》中詳細了解。另外，你必須理解 json。

d） dom編程，這(zhè)個Web前端工程師的核心技能(néng)之一。必讀《Dom編程藝術》，另外《高性能(néng) 》這(zhè)本書中關于dom編程的部分講的也很好(hǎo)。

e） Ajax編程，這(zhè)是另一核心技術。Ajax建議在網上查些資料，了解這(zhè)個概念的來龍去脈，百度百科，維基百科上的内容就足夠了。真正編程是很容易的，如今幾乎所有框架都(dōu)對(duì)Ajax有良好(hǎo)的封裝，編程并不複雜。

f） 了解浏覽器差異性。這(zhè)部分包括CSS和js兩(liǎng)部分，浏覽器差異内容很多，建議在實踐中多多積累。另外對(duì)于浏覽器的渲染模式，DOCTYPE等内容應該系統學(xué)習。

3、HTML5和CSS3 。HTML5規範已經(jīng)于2014年10月28日發(fā)布了，移動端HTML5和CSS3已經(jīng)得到了非常廣泛的使用，必知必會呀。

再進(jìn)一階 · 代碼層面(miàn)：

有了以上知識，對(duì)于大多數小型網站，你應該已經(jīng)可以寫出能(néng)夠工作的代碼了。但要想成(chéng)爲更專業的前端，你還(hái)需繼續努力。更高的要求大概還(hái)有四方面(miàn)：1）易維護，2）可測試，3）高性能(néng)，4）低流量（移動端）。

1）易維護。對(duì)于頁面(miàn)你該理解‘樣(yàng)式’，‘數據’，‘行爲’三者分離，對(duì)應的當然就是CSS,HTML,js。對(duì)于js代碼，你最好(hǎo)了解設計模式，重構，MVC等内容。

2）可測性。

3）高性能(néng)。必讀《高性能(néng)》

4）低流量。移動端關注比較多。

再進(jìn)一階 · 工程層面(miàn)：

前端項目同樣(yàng)面(miàn)臨軟件生命周期的各個環節，首先是代碼管理，你必須學(xué)會使用Svn和Git。其次是代碼的構建，如今前端代碼構建已經(jīng)不是簡單的壓縮一下了，需要進(jìn)行依賴管理、模塊合并、各種(zhǒng)編譯，比需要學(xué)會使用Grunt、Gulp等前端構建工具。

然後(hòu)呢？

以上内容隻是簡單說了前端學(xué)習的順序。前端工程師應該有的知識結構請參考這(zhè)裡(lǐ)：JacksonTian/fks · GitHub

對(duì)于前段開(kāi)發(fā)，基本内容就這(zhè)些了，可以根據自己的興趣愛好(hǎo)選擇性學(xué)習以下内容。

1、交互設計。大公司依然有專業人士搞這(zhè)些，不過(guò)不懂交互的前端一定不是好(hǎo)前端。推薦《簡約至上》。

附上超多的交互自學(xué)資料：《交互設計師修煉指南！教你從零開(kāi)始成(chéng)爲優秀交互設計師》

2、後(hòu)端。

應該說前段工程師必須至少了解一門後(hòu)端語言，不過(guò)如果愛好(hǎo)也可深入學(xué)習，入手難度比較低的應該是PHP了。這(zhè)部分由可分爲基于頁面(miàn)，基于框架兩(liǎng)種(zhǒng)。大型項目都(dōu)是基于框架開(kāi)發(fā)的，建議至少了解一個MVC框架，比如PHP的Ci、Yii、Yaf 等，好(hǎo)還(hái)框架的設計思想都(dōu)大同小異。如今NodeJs在大公司已經(jīng)得到普遍的使用，推薦大家使用在Node上使用Express框架做一些後(hòu)端服務的開(kāi)發(fā)。

3、Android和IOS開(kāi)發(fā)。

時至今日，前端的工作領域已經(jīng)非常廣泛，native的界面(miàn)開(kāi)發(fā)本質上也是前端開(kāi)發(fā)，個大公司都(dōu)面(miàn)臨著(zhe)Native環境和web環境頁面(miàn)同時維護的問題，如果能(néng)夠在技術上得到統一，將(jiāng)會有巨大的價值。對(duì)于學(xué)有餘力的同學(xué)，應該了解Native開(kāi)發(fā)的基本流程，至少了解到界面(miàn)構建的技術。

注：本文均來自百度搜索，如涉及版權問題，請聯系我們，我們會第一時間解決。