『壹』 設計師需要了解哪些前端知識
但凡從事互聯網的人基本都會寫幾行 html，用過 Word 的人用 Dreamweaver 也能做出規整的頁面，所以大部分人會很自然地認為「頁面的開發沒什麼技術含量，很簡單」。但實際上這種認知是錯誤的，隨著頁面內容的豐富，設計風格的發展，交互復雜性的增加，AJAX 的應用，瀏覽器的更新換代，前段設計不僅僅是頁面的布局還有許多其他的內容工作。
下面總結一下作為一名前端設計師應該具備的知識：
1、實現效果圖，把視覺稿通過頁面代碼的方式表現出來包含了兩個基本訴求：1.能夠真實反映視覺稿;2.能夠通 過瀏覽器的兼容。這兩個訴求的達成需要我們有追求細節的態度和一定的頁面功底，能完成這兩個內容就可以初步進入頁面前端的從業者行列了。
2、實現良好的頁面結構，頁面結構的編寫好壞會直接影響到 CSS 代碼的質量、js 開發、後台開發還會影響到以後的頁面拓展、迭代和頁面調整。所以實現良好的頁面結構的能力尤為重要。
3、能寫初優美的代碼，現在很多 web 項目功能復雜，代碼規模也會變得很龐大，如何更好地進行協同開發和維護是我們面臨的一個問題。需要考慮完善統一的規劃，還有要養成良好的代碼開發習慣才會在面臨各種情況時游刃有餘。翻閱頁面代碼，看到合理的標簽使用、良好的注釋、清晰的代碼結構、用意准確的 css 不僅猶如欣賞一個藝術品，更為下游開發和協同開發降低了不小的溝通成本。
以上這些知識都是一個優秀的前段人員必備的能力，如有遺漏後期補充。
『貳』 web前端怎樣入門
先說一下自學前端如何入門吧。
方法：
第一：理清Web前端的知識結構。要想高效學習Web前端知識，首先應該搞清楚Web前端都包括哪些技術結構。Web前端開發雖然技術難度並不高，但是技術細節卻比較多，內容也比較雜。Web前端的基礎包括三大部分，包括Html、CSS和JavaScript，其中JavaScript是學習的重點，也是難點。另外，vue等框架也是需要熟練掌握的。
第二：緊跟技術發展趨勢。目前Web前端的技術發展趨勢有三個，其一是前端開發數據化;其二是前端開發高效化;其三是前端開發全棧化。前端開發數據化主要是大數據發展的影響，在大數據的推動下，Web前端逐漸涉及到了大量的數據展示任務。前端開發高效化主要體現在Web前端正在進行獨立部署，前端與後端的溝通主要通過資源介面的方式來進行。前端開發全棧化也是一個比較明顯的趨勢，比如Nodejs的應用。
路線：
第1階段：前端頁面重構(4周)
內容包含了：(PC端網站布局項目、HTML5+CSS3基礎項目、WebApp頁面布局項目)
第2階段：JavaScript高級程序設計(5周)
內容包含：(原生JavaScript交互功能開發項目、面向對象進階與ES5/ES6應用項目、JavaScript工具庫自主研發項目)
第3階段：PC端全棧項目開發(3周)
內容包含：(jQuery經典交互特效開發、HTTP協議、Ajax進階與PHP/JAVA開發項目、前端工程化與模塊化應用項目、PC端網站開發項目、PC端管理信息系統前端開發項目)
第4階段：移動端項目開發(6周)
內容包含：(Touch端項目、微信場景項目、應用Angular+Ionic開發WebApp項目、應用Vue.js開發WebApp項目、應用React.js開發WebApp項目)
第5階段：混合(Hybrid,ReactNative)開發(1周)
內容包含：(微信小程序開發、ReactNative、各類混合應用開發)
第6階段：Node.js全棧開發(1周)
內容包括：(WebApp後端系統開發、一、Node.js基礎與Node.js核心模塊；二、Express；三、noSQL資料庫)
至於視頻教程，我這里有很多前端的全套教程，如果你需要的話，可以加一下我的學習交流裙裙，找我要就行了！
『叄』 面試Web前端需要注意什麼會面試哪些問題
作為一名HTML5前端工程師，為了工作，為了就業我們免不了要參加各種各樣的面試。為此總結了面試前的注意事項：
第一：注意自己的儀容儀表
面試之前，一定要再次從頭到腳地將自己的儀容儀表檢查一遍。檢查時主要包括，自己的牙縫是不是還有食物殘渣，所以你需要就近找一個衛生間，如果沒有衛生間就近找一個角落也是可以的，但是切記一定不要在大庭廣眾之下。因此，為了給自己整理出著裝的時間請在約定時間前20分鍾到達。
第二：再次檢查面試時所需的資料是否都已帶全
這些資料主要包括：身份證明、學歷文憑證明、個人簡歷、以往作品等等，如果這些東西齊全之後，需要對這些資料做一個整理與排序。因為沒有哪個面試官希望看到面試者拿出一堆「莫名其妙」的東西塞給他，讓他自己再一頁一頁的翻找自己需要的內容，如果說這些資料在面試官手中不小心散落一地，結果可想而知。這樣的求職者在面試官眼中也一定不是一個讓人放心、有條不紊的員工。當然如果檢查時發現資料沒有帶全，也不要緊張。反而你要慶倖幸虧及時檢查，也有足夠的時間組織語言去向面試官解釋。
第三：面試之前將通信工具調成振動或關閉狀態
雖然說面試者與面試官之間是一個平等的關系，但畢竟你是去人家公司求職的，始終處於一個被動的狀態，所以最起碼的尊重還是要做到的。曾經有調查顯示，對於面試過程中接電話或是被電話打斷的求職者，會被HR減分。
第四：等候面試官時，仔細觀察多了解面試公司
在等候面試官時，可以暗自觀察一下公司的大體情況比如員工的著裝風格、公司的LOGO或是貼在牆上的企業文化、公司的環境等等，一來可以在接下來的面試過程中表現出自己對公司的認同感，二來也可以讓自己對求職公司多些了解，以確定是否要接受這里的工作。如果你身邊有公司的資料宣傳架，不妨取一本翻看一下，也會增加HR對你的好感。
第五：放鬆心情，保持自信
面試時一定要保持一定的自信，這樣也會給面試官留下很好的印象。面試只是你步入工作的第一步，即便是失敗了那也是人生重要的經歷。失敗是為了更好的迎接下一個挑戰。
作為一名web前端工程師千萬不要覺得懂技術面試就能萬事大吉了，像以上五點細節性的東西也是一定要掌握的。
面試題系列：
網頁鏈接
『肆』 4個細節讓你明白Web前端和UI設計的區別
前端男女都有，女生有不少，但是相對來說還是男性偏多。前端是技術，是碼農，和美工設計不一樣。美工設計做出來的圖給前端，前端要做的是寫代碼去實現它。
『伍』 學習web前端需要注意什麼
前端雖然學習起來是相對簡單的，但是內容也不少，同時後期可以補充後端技能，成為現在熱門的web全棧工程師。
要學的內容主要有：
①計算機基礎以及PS基礎
②前端開發基礎（HTML5開發、JavaScript基礎到高級、jQuery網頁特效、Bootstrap框架）
③移動開發
④前端高級開發（ECMAScript6、Veu.js框架開發、webpack、前端頁面優化、React框架開發、AngularJS 2.0框架開發等）
⑤小程序開發
⑥全棧開發（MySQL資料庫、Python編程語言、Django框架等）
⑦就業拓展（網站SEO與前端安全技術）
互聯網行業目前還是最熱門的行業之一，學習IT技能之後足夠優秀是有機會進入騰訊、阿里、網易等互聯網大廠高薪就業的，發展前景非常好，普通人也可以學習。
想要系統學習，你可以考察對比一下開設有相關專業的熱門學校，好的學校擁有根據當下企業需求自主研發課程的能力，能夠在校期間取得大專或本科學歷，中博軟體學院、南京課工場、南京北大青鳥等開設相關專業的學校都是不錯的，建議實地考察對比一下。
祝你學有所成，望採納。
『陸』 網站開發中前端應該注意哪些地方
前端那就應該主要注意用戶的操作和用戶各方面的習慣了。不要好看，但一定要簡單實用。一些小細節一定要弄好。
『柒』 web前端需要掌握的哪些知識
一個合格的web前端需要掌握哪些技術？
最基礎的自然是JavaScript，HTML和css這三種語言。
首先了解下它們到底是什麼。
HTML是用戶看到的網頁的骨架，比如你會發現當前頁面分為左中右三個部分，其中還填充了不同的文字和圖片；每個子部分還會繼續細分，比如當前頁面的中間部分下方有輸入框等等。
CSS是網頁展示的細節控制，比如你會發現有的文字是紅底白色，有的子部分佔了頁面的二分之一寬，有的只佔六分之一，有些部分需要用戶進行某些操作（如點擊，滑動）才會出現等等，這些就是有CSS來控制。
JavaScript是負責捕捉用戶在瀏覽器上的操作，並與後端伺服器進行數據交換的腳本語言。當用戶在前端進行點擊，輸入等操作的時候，會觸動綁定了該動作的JavaScript腳本，然後JavaScript收集數據，調用後端的api介面，再將後端返回的數據交給HTML和CSS渲染出來。
一個網頁的HTML代碼和CSS代碼是可以直接在瀏覽器中查看的，你可以直接按F12，就能看到下圖右側的模塊，左右側紅框就是代碼與實際頁面的對應關系。因此如果你看到某個網站的布局很不錯，不妨點擊F12，進行學習。
前端框架
然而，實際應用中，已經很少有正規的項目組直接用上述三種語言進行web 前端開發了，而是使用很多封裝了這三種語言的框架，比如
Vue.js
，angular，react native等等。它們是來自谷歌和Facebook的大神項目組，基於自己的經驗，封裝了原生前端語言，實現了更多更復雜更酷炫的功能。因此，可以說，學會使用這些框架，能達到事半功倍的效果。
比如用了vue，它是自底向上增量開發的設計，其核心只關心圖層，而且還可以與其他庫或已存項目融合，學習門檻極其友好；另一方面，vue可以驅動單文件組件和vue生態系統支持的庫開發的復雜單頁應用。有了這個生態系統，可以說，vue是處在一個不斷壯大，不斷完善的欣欣向榮的狀態。
網路通信協議
由於前後端分離的趨勢，前端還需要了解很多網路通信協議的知識，這里不局限於http協議，因為據我的經驗，有時候我們還會用到websocket等協議。因此，前端需要簡單了解不同協議的特點以及使用方式，但是好消息是不用像學習計算機網路課程一樣對每種協議的原理都了解的特別透徹，只要學會如何用前端語言發送這種協議的請求就夠了。
『捌』 前端工作流程是什麼
公司性質決定流程，不過一般大體都是需求--設計--頁面製作--效果製作--添加程序。
假設 sys 級的規范和標准模塊已經完成（包括全局樣式、布局規范、標准盒模型等），這時需要開發一個項目，假設為淘江湖 SNS 項目。理想中的開發流程為：
a). PD 產出 PRD.
b). 交互統攬全局，將 PRD 中的可復用部分，拎取出來，產出 base-prototype.
c-1). 視覺根據 base-prototype，產出 base-mockup.
c-2). 前端根據 base-prototype 和 base-mockup 產出 app-dpl（該項目的 DPL）。
c-3). 交互繼續具體頁面的 page-prototype 產出工作。
以上三步是並行和迭代進行的。
d-1). 視覺根據 page-prototype 產出 page-mockup.
d-2). 前端根據 page-mockup 產出 page-demo.
以上兩步迭代進行。
流程的核心是迭代、是敏捷、是短周期。
最重要的一步是 base-prototype 的產出。交互要避免一個頁面一個頁面的產出順序，而應該先有一個統攬全局、拎取通用部分的步驟。
以上流程可以簡述為：sys -> app -> page. app 層的抽取很重要，可以提高團隊的開發效率和協作程度，讓團隊更融合、更高效。
感覺 LSM 強調的是前端工程師實現 demo 時的微流程。告訴我們做一個頁面時，需要 html 整體 -> 局部模塊的 css/js, 逐層開發，先整體後局部，先框架後細節。這是非常好的最佳實踐。
『玖』 前端開發中應該注意哪些用戶體驗細節
作為曾經的一枚小前端，我來回答一下這個問題吧。
還有就是設計細節，如果你這個頁面想讓用戶去登陸，就不要展示亂七八糟的東西，目的要突出，不要讓用戶感覺他在你的頁面上找不到要找的東西，有過這一次經歷，我可以很負責的告訴你，我不會再給你第二次讓我成為你用戶的機會。
頁面太多AJAX無刷新，或者全部都是同步執行的頁面，如果非同步和同步協調的不是很好的話，用戶體驗會非常的不好，比如局部地區是可以適當的用非同步刷新去解決的。
不要頻繁的使用alert彈出窗口，頻繁的彈出alert框，或者提示框是一種很不合適的體驗，尤其是系統默認的alert框，簡直是low到爆的一種表現。
多寫代碼，多寫一些慢慢就會遇到這些坑，從這些坑裡跳出來了。
『拾』 Web前端開發中要注意哪些SEO細節
1、網站布局要做到樣式與頁面分離，刪除頁面中不必要的標簽和元素。
2、頁面生成要盡量小，要壓縮頁面的大小，頁面盡量使用靜態或偽靜態。
3、所有的CSS、JS都要使用外部調用。
4、外部調用的JS文件的代碼能放在底部的盡量放在底部，頁面調用的css文件的代碼盡量都放在head內，同一頁面盡量不要超過3個JS外部調用。
5、每個頁要只能出現一次H1標簽，H2~H6標簽可以多次，這樣做是為了加重H1標簽的權重。
6、除首頁外別的頁面要加麵包屑型路徑，導航一定要清晰。
7、網站一定要兼容腦殘的IE各版本和FF等主流瀏覽器，這個雖然感覺對SEO影響不大，但是作為前端，這也是最基本的吧。
8、圖片一定要添加alt屬性，鏈接一定要添加title屬性。
9、網站結構呈扁平狀樹型，目錄結構不宜過深，每個頁面離首頁最多點擊3次，過深不利於搜索引擎的抓取。
10、做好404頁面，並測試其返回狀態碼為404。
11、確保網站代碼無誤，HTML能通過W3C版本。