web前端是做什麼的？UI設計又是做什麼的？看完別選錯行！

就在前幾天，在我們人脈圈裡討論過這樣一個問題：前端是做什麼的呢，UI又是做什麼的呢？他兩者差不多把，咳咳這裡告訴大家！其實差太多了~~~還有好多的小同學常問我學Web前端，還是學UI啊，今天就為大家講解下兩者有什麼區別！

什麼是web前端開發工程師？

Web前端開發工程師，是從事Web前端開發工作的工程師。主要進行網站開發，最佳化，完善的工作。網頁製作是Web 1.0時代的產物，那時網站的主要內容都是靜態的，使用者使用網站的行為也以瀏覽為主。

一位好的Web前端開發工程師在知識體系上既要有廣度，又要有深度，所以很多大公司即使出高薪也很難招聘到理想的前端開發工程師。現在說的重點不在於講解技術，而是更側重於對技巧的講解。技術非黑即白，只有對和錯，而技巧則見仁見智。

以前會Photoshop和Dreamweaver就可以製作網頁，現在只掌握這些已經遠遠不夠了。無論是開發難度上，還是開發方式上，現在的網頁製作都更接近傳統的網站後臺開發，所以現在不再叫網頁製作，而是叫Web前端開發。

Web前端開發在產品開發環節中的作用變得越來越重要，而且需要專業的前端工程師才能做好，這方面的專業人才近兩年來備受青睞。Web前端開發是一項很特殊的工作，涵蓋的知識面非常廣，既有具體的技術，又有抽象的理念。簡單地說，它的主要職能就是把網站的介面更好地呈現給使用者。

web前端工程師的職責？

利用(X)HTML/CSS/JavaScript/Flash等各種Web技術進行客戶端產品的開發

為網站上提供的產品和服務實現一流的Web介面

最佳化程式碼並保持良好相容性

Web前端表現層及與前後端互動的架構設計和開發

配合後臺開發人員實現產品介面和功能

利用各種Web技術模擬開發產品原型

Web新技術調研和資訊整理

web前端工程師需要掌握的技能？

第一，必須掌握基本的Web前端開發技術，其中包括：CSS、HTML、SEO、DOM、BOM、Ajax、JavaScript等，在掌握這些技術的同時，還要清楚地瞭解它們在不同瀏覽器上的相容情況、渲染原理和存在的Bug。

第二，在一名合格的前端工程師的知識結構中，網站效能最佳化、SEO和伺服器端的基礎知識也是必須掌握的。

第三，必須學會運用各種工具進行輔助開發。

第四，除了要掌握技術層面的知識，還要掌握理論層面的知識，包括程式碼的可維護性、元件的易用性、分層語義模板和瀏覽器分級支援，等等。

可見，看似簡單的網頁製作，如果要做得更好、更專業，真的是不簡單。這就是前端開發的特點，也是讓很多人困惑的原因。如此繁雜的知識體系讓新手學習起來無從下手，對於老手來說，也時常不知道下一步該學什麼。

程式碼質量是前端開發中應該重點考慮的問題之一。例如，實現一個網站介面可能會有無數種方案，但有些方案的維護成本會比較高，有些方案會存在效能問題，而有些方案則更易於維護，而且效能也比較好。這裡的關鍵影響因素就是程式碼質量。CSS、HTML、JavaScript這三種前端開發語言的特點是不同的，對程式碼質量的要求也不同，但它們之間又有著千絲萬縷的聯絡。

有句話叫做“方法不對，努力白費”所有的前端大神都有自己的學習方法，而學web前端的學習也基本一致，而對於一個什麼都不懂的初學者，根本不會知道該怎麼學，這也是造成失敗的最直接原因。如果你處在迷茫期，找不到方向。可以加入我們的前端學習秋秋qun ：⑦⑥⑦-②⑦③-①零②
（從零基礎開始到前端專案實戰教學分享，學習工具，職業規劃指導）點： 前端學習交流圈

什麼是UI設計？

ui設計（或稱介面設計）是指對軟體的人機互動、操作邏輯、介面美觀的整體設計。UI設計分為實體UI和虛擬UI，網際網路常用的UI設計是虛擬UI，UI即User Interface(使用者介面)的簡稱。

好的UI設計不僅是讓軟體變得有個性有品位，還要讓軟體的操作變得舒適簡單、自由，充分體現軟體的定位和特點。

UI設計的職責？

負責公司產品在智慧電視、PC端、移動端頁面/應用的整體設計。

基於使用者體驗、人機互動、圖形化設計、介面設計等前沿理論實現產品風格設計。

充分理解產品策劃思路及理念，配合產品經理和研發人員實現產品介面的視覺設計。

建立和完善產品介面視覺設計規範。

根據互動設計及產品規劃，完成產品（iPhone、Android 、Web平臺App及網站）相關的使用者介面視覺設計。

配合產品開發中的圖形介面（GUI）設計。
完成產品相關推廣活動的專題頁面、FLASH的設計及製作。

與研發團隊充分溝通協作，確認可控的誤差範圍和視覺效果的最終實現。

根據視覺設計的發展趨勢及使用者研究的結果不斷最佳化產品的圖形介面。

UI設計需要掌握的技能？

視覺設計主要是以美術設計為主，介面的色彩、結構、圖示等工作都需要視覺設計師來完成。主要使用的軟體是以Adobe公司的軟體為主，如PS、AI、AE、FW，當然還有後起之秀Skitch等，一般來講從業者都是美術專業相關院校的畢業生，也有少部分計算機專業畢業生。
互動設計主要是以產品互動原型設計為主，完成設計互動原型圖，但是其實是一個很考驗綜合能力的職位，需要了解使用者體驗知識、介面設計知識、產品業務知識等。互動的設計軟體比較多，沒有視覺軟體上Adobe那種一家獨大，每種軟體都有自己的特點，AxureRP、Balsamiq Mockups、Omnigraffl Pro等，一般來講都是需要一定的從業經驗才能很好勝任。另外還有很多公司將互動相關職位進行了更的細劃分，出現了使用者體驗設計師、使用者研究員、無線互動設計師等職位。

（注：部分內容來自百度百科）

總體來說呢，這兩個職位都是可以的，該如何選擇的話可以根據實際情況以及自身愛好進行選擇。希望這篇文章可以幫到你！加油吧少年！