1．盡量把頁面的背景圖及小圖標整合到一張圖片，用CSS定位方法。這樣以減少http請求，從而降底網站的下載速度。

2．尊從內容與頁面樣式的脫離，如需要，同樣也要做到布局與COLOR的脫離。什么樣的圖片屬于內容：從數(shù)據(jù)庫里取出來的圖片。 凡是不屬于內容的圖片請都用背景。

1）頁面代碼，做到精簡，邏輯性清楚；公用部位可以引入進來，比如頭部，腳部。

2）CSS邏輯清析，精簡。可在不改變功能的前提內，做到能更換頁面布局及換色。CSS樣式每個頁面引入不超過兩個文 件，一個 是COMMON：它包含整個站點都需用到的公用部分，如整體布局，頭部，腳部，框，按扭等。另一個是當前頁的 CSS。CSS文件 引入在2個之內，減少http請求避免CSS的表達式。

3． 將腳本放在底部。這樣頁面就可以逐步呈現(xiàn)，而且頁面中的可視組件可以盡早下裁。配合程序開發(fā)人員我們需要注意的（xhtml）：

1．了解用戶可編輯上傳修改的“圖片”，“文字”區(qū)域的需求。根據(jù)需求來定位控制，以保證頁面的穩(wěn)定顯示。如圖片，需了解： 1）寬度是否是固定大小，

2）寬度最大限度，

3）大小不一樣時的居中顯示 如文字，需了解：

1) 文字的最大長度。及加“…”省略號區(qū)域,

2) 在測試中經常也會碰到英文無空格情況，得用overflow: hidden的方法隱藏溢出部分。

2．每個頁面加上正確顯示的TITLE。

3．在頁面中盡量完成每步交互效果，包括既時響應的。

4．提交程序員的DEMO必須是連貫的，交互效里齊全，而且經過自已在IE6.0，IE7.0，F(xiàn)IREFOX一次以上的整體測試。 設計師需要注意的幾點：

1. 盡量考慮為元素命名其本身的作用或盡量考慮為元素命名其本身的作用或盡量考慮為元素命名其本身的作用或盡量考慮為 元素 命名其本身的作用或”用意用意用意用意”，，，，達到語義化達到語義化達到語義化達到語義化。不要使用表面形式 的命 名。如:red/left/big等。

2. 組合命名規(guī)則組合命名規(guī)則組合命名規(guī)則組合命名規(guī)則: [元素類型]-[元素作用/內容] 如:搜索按鈕: btn-search 登錄表 單:form-login 新聞列表:list-news

3. 涉及到交互行為的元素命名涉及到交互行為的元素命名涉及到交互行為的元素命名涉及到交互行為的元素命名: 凡涉及交 互行為的元素通常會有正常、懸停、點擊和已瀏覽等不同樣式，命名可參考以下規(guī)則:

鼠標懸停:：hover 點擊：click 已瀏覽：visited

如:搜索按鈕: btn-search、btn-search-hover、btn-search-visited

4.用戶體驗方面需要注意的用戶體驗方面需要注意的用戶體驗方面需要注意的用戶體驗方面需要注意的：

1） 每個連接，按鈕要做上鼠標hover時的一個變化效果。如果hover時是換一張背景圖片，請把這兩張圖片整合在一張 圖片中，以防止在hover時，頁面還在download變化的那張圖片，這樣會出現(xiàn)那個按鈕無圖的間隔；

2） input有個label，可以讓用戶在點擊字時，光標自動跳入相應input中；

3） 圖片應該有alt屬性，以備圖片阻止時，文字的替換

親身經歷告訴你：

1.我14年到16年4月都是做淘寶美工的。后來因為工資上不去，還要被客戶指指點點，16年4月7號裸辭，全職從頭開始學習前端

2.然而，我全職學習了8個月，其中可能有四五個月在打游戲，邊打游戲邊學習的這種程度，為什么打游戲呢，因為期間有投過多次簡歷，幾乎沒有一個通過面試篩選的，這讓我很灰心，開始沮喪灰心，陷入了游戲的毒藥中，還好的是我當時并沒有后悔我辭職的決定，于是堅持學習了8個月。

3.皇天不負有心人，我終于在16年的12月15號拿到了外包騰訊的前端工作，雖然是外包，但是我很開心，終于算轉行了，鬼知道我那段時間經歷了什么，真的難過的要死。

4.在騰訊工作了一年多以后，我感覺技術差不多了，由于騰訊的外包人員幾乎沒有轉正的通道，于是我果斷辭職，經過一些時間，我拿到平安科技的offer 。

總結：以我的親身經歷告訴你，自學三個月左右，全職學習，別玩游戲，你一定能找到前端的工作。送一句話給你：堅持，一定會成功的。加油！

1、css,html,js 基本要求要能夠了解并且熟練。

2、在完成1后,了解前端自動化, webpack,gulp, 并且能利用webpack,gulp寫一套腳手架(不是框架),實現(xiàn)最基本的 es6 -> es5(babel + eslint), css處理器(比如sass)-> css(postcss做瀏覽器兼容), 模板(比如 pug)->html。

3、在完成2的同時 你會了解 es6的語法,sass的使用,和一點點nodejs的使用。

4、完成2和3后, 你可以嘗試了解 jQuery->vue->微信小程序, 其實方向就是 DOM操作->MVVM框架->商業(yè)化產品(微信小程序,混合式APP開發(fā)等)

5、在完成4的同時 你會了解到 一點點HTTP請求知識,cors跨域處理,AJAX等

6、在完成4后還有余力的話, 去了解nodejs+express 最基本的寫一個管理系統(tǒng),或者blog等等

7、在完成6的途中你會了解到 http請求,數(shù)據(jù)庫操控, cookie與session,restful API,等等

如果能夠全部完成7點,達到 了解并且掌握的程度, 那么找個實習是沒什么問題了,剩下的坑在工作中學習吧。

你一提到自學，我就知道沒戲了。

我做web前端10年了，我比任何3~4年或者其他經驗的人，對于web前端都要有敬畏之心，做的時間越長，越感覺啥都不會。

相反初web前端和做1年左右的人，恰恰相反，他們覺得什么都會。

其實web前端有點像是說相聲，我比較贊成郭德綱的話 “相聲這門藝術，就是張口說話，很多人說了，我也會說話，憑什么聽你說話？這要的是本事。 張口說話的人很多，能說好 的不多”

web前端基礎以外，最重要的是經驗，經驗，經驗，干貨，干貨，干貨，踩坑，踩坑，踩坑，這些東西你別想通過自學來學到，除非你通過大量的實戰(zhàn)，或者有經驗的前輩告訴你。

否則，只有基礎，沒有經驗，你看看市場上，這樣的人多如牛毛。

我是做后端學PHP的，已經干了差不多兩年了，沒辦法前段多多少少接觸，不會只有查。我PHP學了差不多6~7個月，我寢室也有3~4個學前端H5的，對于他們學的課程也有所了解。

前端基本要會HTML基本的標記語言以及H5，CSS樣式以及出新CSS3要熟悉，前端框架要會PHP也要會Bootstrsp3以及主要用法，JS端要會jqueey前端后端都會用到，ajax也要會用，會使用前端Node.js，手機端web等。到后期也要做幾個項目才行，要想學的差不多我估摸沒有3~4個月搞不完。

如果自學多看看視頻和文檔，如果自制能力差一點可以報個網上課程試一試，因為線上有其他同學跟你一起不會還可以問，主要是市場比較新的技術機構肯定比咱了解多。

我有一些線上課程需要@我，互相幫助，共同進步，點個贊。

本人前端開發(fā)兩年，根據(jù)本人對市場的了解，簡單講下。

自學前端除了要掌握css,html,js，還必須需要掌握react.js,webpack，react-native�？梢赃@么講，精通react的工作都好找。目前大部分公司都用了react開發(fā)項目。

前端開發(fā)者的加分項，會算法，數(shù)據(jù)結構，數(shù)據(jù)庫，http協(xié)議，一門后端語言，有自己的開源項目并且有不少星星，英語水平優(yōu)秀，計算機相關專業(yè)等。

HTML5核心元素及布局應用；CSS3核心屬性及布局應用；圖形、圖像軟件的使用（PS,FW,AI）；瀏覽器兼容及解決方案；圖片整合、滑動門及寬高自適應等高級應用技術；原生JavaScript的學習這些都是基礎的，學完之后就是第二階段的學習了，jQuery以及angularjs等前端框架，以及ajax等方面的知識技術，這些掌握之后，就需要一定的實戰(zhàn)項目來增加自己的經驗了，而后就是在工作中不斷的學籍精進。

前端主要是js，最低條件是會用一些常見的js框架，比如jq、vue等等，用它們做個小項目就行

1.給你一個面試題，你也許回答不上來；但是必須知道通過一系列搜索(谷歌，百度，github，stackoverflow)找到答案；

2.給你一個psd設計圖，你能比較好的寫出來；

3.客戶(或面試官)提出一個特效需求后，你要知道從哪里找到插件(不可能每個程序員都能寫插件，但是至少你要會用，熟練使用插件，知道哪個插件最適合哪個需求也是加分項)

注意: 盡量從github下載，不要從\"懶人素材\"或\"17素材\"這些沒有維護的網站下載

學習HTML和CSS，而且要完全掌握

必學：JavaScript

h5+css必學

多了解一些框架如：Bootstrap

MVC/MVVM/MVW框架：

Angular.js、React.js、Vue.js、Backbone.js、Knockout/Ember等這些前端框架都要了解，最好熟練兩三個。

最主要是多練習 多練習 多練習，最好自己單獨可以搞定某個項目整個前端，不然找工作會讓你介紹做過的項目。

我是做后端的，在我看來前端要學的東西很多，而且更新很快。