[網頁設計]前端工程師應該具有的三種思惟

若是你是一個天才等級的工程師（立刻能夠離開），能夠獨立完成一個不少事情，你能夠是一個怪咖，由於我相信沒有一我的不會不佩服你。但現實歸現實，多數人都不是天才，而咱們在職場上也不是單打獨鬥，咱們須要團隊合做，須要協調和配合，須要考慮除了代碼之外的更多事情。

　　前端工程師，也不只僅只是負責接資料，撈數據，作個迴應。固然只作這些也並無不對，但咱們須要和後端工程師溝通，咱們也須要和設計溝通，也須要和 PM 溝通，怎麼作纔是對這三方都比較有好處？

　　邏輯思惟

　 　在開始寫某一段代碼的時候，想一下它會用在哪裏，會重複用嗎？ 它之後會不會變，若是會變，那能夠怎樣變？通常網頁結構的變化，雖然有不少可是也有一個根據，這個根據就是能夠預先估計好的。沒有一個案子，是不會「不 改」的，不少時候你都是要一邊作一邊改，甚至可能會來個乾坤大挪移。當真的須要發生變更和修改的時候，你有什麼對策？這些都是須要想好，而且創建在一個邏 輯上。

　　一般專業的設計師，設計一個網頁的元素都是同質性很高，等比或對比的，因此代碼按理也是能夠重複用的。因此爲什麼你要學會用 CSS preprocessor (Sass,stylus,less)，寫一個 Mixin 或一個變量，一開始用你會以爲很麻煩，可是用了你就回不去了，不但提升你的效率還提升了你的準確率。

　　工程師的世界就如武林，你們都各自修煉，天天都有新的祕籍，你們都很好奇跑去修煉一下，但願有天成爲武林高手。這也是提高你見識和專業的潛動力，若是你沒有好奇心，看的和懂得東西太少，邏輯天然不會跟上時代。要保持不斷的學習，來磨練本身的邏輯思惟。

　　邏輯思惟某程度，就是你的程序專業能力，除了能寫出來還要可維護，可閱讀。當事情創建在一個很好的邏輯上，那麼出錯概率就會比較低，和你工做的人也會比較愉快。

能夠把一件事作的很好，那是師傅；能夠把一件事作好和預測將來的事，那纔是專家。

　　商業思惟

　　PM、老闆或者客戶，都會問你，「你須要多少時間」，若是說的過短，可能會作不完；若是說的太長，也不可能，這是一個怎麼回答怎麼死的問題。有時候，須要換一個立場，站在第三方的角度思考。咱們的完成度，和他們的完成度多是不同的。

　　咱們把案子的細節分紅兩種狀況，一種是你已經有經驗，能夠預估時間的；一種是你沒有作過或你很陌生的，你沒有時間估計的基礎。

　 　那麼提出一個，他們能夠最低接受的標準，例如一個 App 網站，最低標準須要一個首頁，和一個連接去下載 app 的 2 個按鈕，這些都是能夠預估的。而剩下的，你須要 Research 一下，以後再給一個比較有根據的時間。估計一個案子須要多少時間作完，是很是很是的重要，由於你消耗的是一組人的時間，不是你本身的（除非你本身一我的 作，或者你是老闆）。若是你估算錯了，後面就會延期，作不出來沒有很大的關係，最重要是把問題解決，提出你的解決方法，什麼樣的方法才能夠達到解決問題的 目的。

　　換一個立場提出解決方案，對事情是有幫助的，對公司或客戶是有幫助的，客戶不會在意你解決不了手機網頁看不到 20 個欄位的 table 那個問題，可是客戶很樂意聽你說，這樣的 Table 很差看，能夠換一個顯示的方法。客戶也不太在乎你是用 Rails 仍是 php（有些是很在乎，他們僞裝他們懂），能夠購物和發文就好。

　　前端工程師可能很容易接觸到客戶的投訴，因此有些東西沒有想好，就會很麻煩。作個網站，換做你是網友或客戶，你會滿意你本身作的網站嗎？

　　設計思惟

　　不少時候，前端工程師自己也是設計師，可是也有不少是自己是前端工程師也是後端工程師，設計和前端是分割不開的。固然我這裏說的設計，不是真的要你弄一個畫面或完整的設計圖。

」It’s not just what it looks like and feels like. Design is how it works.」 —Steve Jobs

　　前端的設計是指一個畫面或元素，如何被執行和創造，移動或消除，這個設計在不一樣的寬度和高度，不一樣的裝置看，效果是怎樣，考慮進去就是你的設計思惟，怎麼把設計師的畫面弄成一個活生生的網頁，要用設計師的角度去思考，纔能有辦法把設計圖的概念充分的表達出來。

　 　話說早前，收到一個「設計圖」，上面有一個「X」，我問客戶這是什麼，他說是「回上一頁」，爲什麼回上一頁是「X」，這不是一個 popup 也不是一個 modal，同時這個圖上還有不少不一樣顏色和大小的「X」，分別表明了「刪除」、「關閉」、「滑下」，這是一個不太合理的設計。

　　設計 的思惟，會直接影響你寫的代碼結構和網頁結構，由於你看不出設計的重點在哪裏，怎麼寫才能夠達到設計師要求的效果，你沒有辦法好好的組織你 的結構和元素，就沒法好好把網頁拼湊出來。這不但大大下降了你的效率，作出來的東西也不會一致。可能一個網站，就出現幾種本該同樣，結果「很像」可是不一 樣的按鈕，由於你用了幾個 class 和不一樣結構來作。你一開始就沒有好好思考設計。

　　你能夠作什麼

　　1，沒事要練功，FB 逛幾分鐘就好，不須要留戀過久。

　　2，作好一個網站，本身玩一下，給你朋友玩一下，問一下他們的意見？多問幾個。

　　3，多看設計圖，看思考一下你會怎麼作。