作為一個職業(yè)的頁面重構者，我們從事的工作簡單的說就是“將設計稿轉換成WEB頁面”，這一過程可以很簡單到直接把PSD從PS里切成成網(wǎng)頁；也可復雜到需要考慮頁面中每個標簽的使用，考慮“頁面性能”。以“前端工程師”為目標的同學可能會不愿承認將頁面重構這塊分出來，但隨著工種的細分，加上頁面重構本身的專業(yè)性，獨立為一個職業(yè)也不是不可能，如果你覺得一個前端工程師必須去畫設計稿，可以不理會下面的內(nèi)容。

單純的頁面重構，所涉及到的工作內(nèi)容一般是“分析設計稿=>切圖=>寫DIV和CSS”，雖然看起來很少，但要做好這份工作，絕非所想的那么容易。
原因很簡單：
工作內(nèi)容單一，在時間和工作量上必會很苛刻，往往跟設計師的工作時間是3:1，即設計師給三天的時間，制作只給一天的時間完成。
在這種工作強度下，很多人都是靠著對這份工作的喜愛在維持著，一旦時間長了，很容易就會變得枯燥，保持熱情也成了重構工作者應該具備的能力。

跟“前端工程師”所要求的有所不同，“頁面重構”雖然也是“前端工程師”的一個范疇，在職業(yè)化中，對專職的頁面重構者，要求當然也更高。不單是做出頁面，而是做出好頁面。那什么是好頁面呢？”，創(chuàng)新互聯(lián)成都網(wǎng)絡公司提出以下幾點：

結構完整，可通過標準驗證
標簽語義化，結構合理
充分考慮到頁面在站點中的“作用和重要性”，并對其進行有針對性的優(yōu)化
很多初學者多少都遇到過方向不明，不知道自己應該提高些什么，我們可以從“分析設計稿=>切圖=>寫DIV和CSS”這個工作內(nèi)容，針對每一點提出一些要求，以方便我們分析自己的能力水平，為繼續(xù)提高確定個方向：

一、設計稿的分析
設計稿的分析是指對設計稿如何制作成頁面的分析，即哪一塊的內(nèi)容可以做為公共的部分、哪一塊的內(nèi)容結構可以如何實現(xiàn)等。對設計稿的分析能力可以劃分成下面的幾個階段：

能分清設計稿中的公共與私有的部分
在1的基礎上對各部分的實現(xiàn)方式有一個初步的方案（包括如何切圖、寫結構、寫樣式）
在1的基礎上，準確的給出各部分的實現(xiàn)方案（包括如何切圖、寫結構、寫樣式）
在3的基礎上，能同時考慮方案的擴展性、復用性及頁面性能（包括如何切圖、寫結構、寫樣式）
在4的基礎上，考慮整站的結構分布（包括文件分布、目錄結構）
上面這些都是在還沒開始動手制作之前所要做的。

二、切圖
切圖是指將設計稿切成便于制作成頁面的圖片。都有個誤區(qū)，覺得切圖就是把圖片切出來，其實并不完全是這樣，還包括把切出來的圖片合并到一起，怎么切、從哪切才能將性能大化，說“切圖實際上就是一門藝術”和雕刻一樣，有人能雕好，有人就不行。切圖也可以劃分成幾個階段：

切成所需要的圖片（如何將需要的部分切出來）
在1的基礎上，對切出來的圖片進行一些優(yōu)化（包括壓縮文件大小、選擇圖片類型）
在2的基礎上，規(guī)劃切出來的圖片（包括文件分布）
在3的基礎上，考慮整體的性能（包括合并圖片、壓縮文件大小）

HTML的DIV和CSS的編寫
HTML的DIV和CSS的編寫是指將上面完成的內(nèi)容，通過HTML的DIV和CSS的編寫，將設計稿轉換成WEB頁面重要的一塊，也是我們所要重點掌握的內(nèi)容，把它們放在一起，是因為它們相互的關聯(lián)性太強，HTML的DIV寫法會影響到CSS的寫法，它又可以劃分成下面幾個階段：

還原設計稿視覺效果，并通過標準驗證（HTML）
在1的基礎上，實現(xiàn)多瀏覽器的兼容（HTML）
在2的基礎上，標簽語義化（HTML）
在3的基礎上，選擇較優(yōu)的實現(xiàn)方式（包括模塊化結構，方便程序腳本使用，HTML和CSS）
在4的基礎上，考慮到擴展性、復用性和可維護性（HTML和CSS）
在5的基礎上，考慮到整站的樣式分布（包括如何實現(xiàn)分布）
在6的基礎上，樣式寫法的優(yōu)化（包括技巧的應用）
是對所遇到問題的解決能力，這一點在不同的階段都可能會遇到，所以沒有寫到上面。

如果你已經(jīng)達到或超過3、4、5，恭喜你，你已經(jīng)是一個職業(yè)的“頁面重構工作者”了。為了我們自身的發(fā)展，關注新技術、技術創(chuàng)新、提高用戶體驗、審美觀、程序腳本的實現(xiàn)方式等，也是十分必要的。

創(chuàng)新互聯(lián)公司后告訴初學朋友門，要想成為一個職業(yè)的頁面重構工作者，你需要的是激情、不要因為枯燥而放棄！你需要細心，努力的做好每一個細節(jié)，以保證作品性能大化！有必要去學習SEO的相關知識，不要輕視站內(nèi)優(yōu)化，要知道會頁面重構的SEO和不會頁面重構的SEO，那不在一個層次上，因為搜索引擎分析的就是代碼。

網(wǎng)站題目：如何成為一個職業(yè)的頁面重構工作者
網(wǎng)頁地址：http://sd-ha.com/news/258443.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、靜態(tài)網(wǎng)站、品牌網(wǎng)站設計、網(wǎng)站收錄、云服務器、品牌網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)