幾乎每一個網頁設計師可以證明，他們的大部分工作是重復的。我們發現自己完成相同的任務，即使稍加修改一遍又一遍，對每個Web項目。經過詳細的網站設計和開發過程可以加快您的工作，并幫助您的客戶了解項目的作用。本文試圖說明如何開發網頁設計可以組織開發的思想，加快項目的時間表，并準備發展一個自由企業的一個過程。

首先，究竟是一個“過程”？一個Web開發過程是一個需要采取從開始到結束，以完成一個典型的Web設計項目的步驟記錄的輪廓。它劃分和歸類的工作，然后分解成任務，并可以作為每個項目的路線圖所使用的資源這些高層次的部分。

一個典型的過程

這里是一個標準的過程，是放在一起使用來自互聯網以及我自己的經驗例子。（注：請參閱在每個階段結束時的資源鏈接。）

1。規劃

規劃階段可以說是最重要的，因為什么決定，并制定在這里為整個項目的階段。這也是階段，需要客戶的互動和隨行注重細節。

• 需求分析
  ，包括客戶的目標，目標受眾，詳細的功能要求，并盡可能多的相關資料，你都不可能收集。即使客戶有精心策劃的他或她的網站，不要怕從你的經驗，提供有益的建議。
• 項目章程
  項目章程（或同等文件）總結了已收集并同意后，在前面點的信息。這些文件通常是簡潔，而不是過分的技術，他們作為整個項目提供參考。
• 站點地圖
  站點地圖導游到底是誰在結構丟失的用戶或需要找到一條信息迅速。而不是簡單的列表頁面，包括一個網頁鏈接和組織層次是很好的做法。
• 合同定義的角色，版權和金融分
  這是一個文件的關鍵因素，并應包括付款條件，項目結束條款，終止條款，著作權的歸屬和時間表。小心蓋上自己的這份文件，但要簡潔，高效。
• 訪問服務器和建立文件夾結構
  典型的信息獲取和驗證，包括FTP主機，用戶名和密碼，控制面板的登錄信息，數據庫配置及任何語言或框架目前已安裝。
• 確定所需的軟件和資源（商業攝影，字體等）
  之外確定任何第三方媒體的需求，找出你可能需要聘請分包商及任何其他軟件，你可以親自要求。所有這些添加到項目的預算，客戶如有需要充電。

這一階段的資源鏈接：

• Jumpchart：客戶端/開發協作工具
• Dropbox的：文件共享和協作工具
• Mindmeister：免費線上心智圖軟件
• 寫作防彈網頁設計合同

2。設計

在設計階段通常涉及移動在規劃階段變為現實進一步所列資料。其主要成果是有記錄的網站結構，更重要的是，可視化表示。當設計階段完成后，網站應該或多或少已經形成，但對于內容和特殊功能的情況下。

• 線框和設計元素規劃
  這是該網站的可視化布局初步形成。利用從規劃階段客戶端收集的資料，開始設計布局使用線框。鉛筆和紙張有著驚人的有用在這個階段，盡管許多工具以及在線幫助。
• 需求分析的基礎上實物模型
  設計模擬- UPS在Photoshop中相對容易的修改允許的話，它保留了設計元素在各層組織，它素數的切片和編碼您到時以后。
• 審查和批準周期
  的審查，調整和審批的實物模型周期經常發生，直到（理想）客戶端和承包商與設計感到滿意。這是最簡單的時間進行更改，而不是設計后已編碼。
• 切片和代碼有效的XHTML / CSS
  它的編碼時間。切片最后Photoshop的實物模型，并編寫HTML和CSS的基本設計規范。互動元素和jQuery還在后面：現在，只獲得視覺效果一起在屏幕上，并且一定要驗證在移動之前的所有代碼。

這一階段的資源鏈接：

• 為線框草圖打印模板
• 顏色方案設計
• 型測試儀，字體比較
• iPlotz，在線模板和線框工具
• 條紋發生器
• Favicon發生器
• 圖標搜索器
• 證券交易所，自由照片

3。發展

開發涉及到大量的編程工作，以及裝載的內容（不論是由您的團隊或客戶端的）。保持代碼的組織和評價，并參考不斷的規劃細節完整的網站需要的形狀。采取的戰略方針，并避免通過不斷的測試，當您去未來的麻煩。

• 構建發展框架。
  這是唯一的要求時，可能會迫使你偏離的過程。如果你使用Rails的，一個ASP / PHP框架或內容管理系統，紅寶石現在是時候落實，取得了基本的引擎啟動和運行。這樣做早期確保服務器能夠處理的安裝和設置順利。
• 每一頁的類型代碼模板。
  一個網站通常有幾頁（如家，大致內容，博客文章，形式），可以基于模板的。為此，創建自己的模板是很好的做法。
• 開發和測試的特殊功能和互動性。
  這里就是看中要素開始發揮作用。我想借此在添加靜態內容的網站，因為這個服務現在提供了一個比較干凈，整潔的工作空間。有些開發商想獲得形式和驗證并在此階段運行也是如此。
• 填寫的內容。
  對于枯燥的一部分時間：加載客戶端或作家提供的所有內容。雖然平凡，不失誤在這里，因為即使是最簡單的需求緊張的頁面排版和精心注重細節。
• 測試和驗證的鏈接和功能。
  這是一個完整的網站檢討的好時機。作為一個指導你使用文件管理器，穿行每一個頁面上，您已經創建了，一切從主頁，提交確認頁面，并確保一切工作正常，這是你沒有錯過任何視覺或功能。

這一階段的資源鏈接：

• Wufoo，形成發電機
• 土坯Browserlab，跨瀏覽器的分析
• 選擇合適的Web平臺

4。啟動

對發射階段的目的是準備供市民瀏覽該網站。這就需要設計元素，互動性和深刻的測試和功能，最重要的是，一個用戶體驗審議的最后拋光。在這個階段的一個重要步驟是將早期的網站，如果需要的話，其永久Web服務器。在生產環境中進行測試非常重要，因為不同的服務器可以有不同的功能和異常行為（如不同的數據庫主機地址）。

• 拋光
  特別是如果你不急于滿足最后期限，打磨基本完成設計可以有很大的不同。在這里，你可以識別的網站，可以在小的方面改進的地方。畢竟，你想成為這個網站的客戶端自豪。
• 轉移到現場服務器
  這可能意味著轉移到現場的Web服務器（雖然希望你已經在生產環境中進行測試），“取消隱藏”的網站或消除“正在建設中”頁面。你的最后一分鐘的直播網站審查發生了。要確保這個階段的客戶都知道，和敏感的時間，如果該網站已流行。
• 測試
  運行通過使用可用的工具的最終診斷，網址為：代碼驗證器，破碎環節跳棋，網站健康檢查，拼寫檢查等等。你想找到自己的任何失誤，而不是從客戶或最終用戶聽力的投訴。
• 最后的跨瀏覽器檢查（IE，火狐，鉻，野生動物園，歌劇院，iPhone，黑莓）
  不要忘記檢查在多個瀏覽器的網站最后一次。正因為代碼是有效的，并不意味著它會與在IE 6脆布局神采奕奕。

這一階段的資源鏈接：

• W3C驗證（HTML，CSS）
• 土坯Browserlab，跨瀏覽器的分析

5。后啟動

經營重新進入在這一點上的圖片作為你把相關的項目關閉所有的小任務的照顧。包裝源文件，使用說明和提供任何必要的培訓在這個時候發生。始終保留為盡可能簡潔地告知客戶，并試圖預測任何問題，他們可能有。不要留下一個封閉的門項目;溝通您是在為將來的維護提供，并致力于持續的支持。如果維修費尚未得到共享，建立他們現在。

• 手頭寬裕客戶
  確保客戶端與產品，而且所有的合同義務已得到滿足（參考項目章程）感到滿意。一個封閉的項目應該離開你和客戶滿意，沒有燒毀的橋梁。
• 提供文件和源文件
  提供的，如軟拷貝的網站地圖上的框架和語言使用的詳細信息的網站，文檔。這將防止任何意外，為客戶以后，它也將是有益的，他們應該永遠與其他Web開發人員。
• 項目結束時，最后文件
  獲取客戶簽字的最后檢查，提供您的支持聯系信息，并正式關閉項目。保持與客戶的關系，雖然，在路上檢查在一個月內，以確保一切都很順利，往往贊賞。

如前所述，這只是一個樣品的過程。您的版本將被修改根據您的客戶群和設計風格。進程也可以根據不同產品的性質，例如，電子商務網站，Web應用程序和數字營銷都有著獨特的要求。

記錄過程

創建和保留兩個版本的Web設計過程：
一為你或你的團隊為指導使用你在后端的工作，一個與客戶分享。兩者本質上的差異應該是清楚的：你會更詳細，包括技術資源，以幫助發展客戶的將是一個簡潔，非技術性的過程圖，從開始到結束。

用于記錄業務流程常用的工具是一個簡單的Microsoft Word文檔，Microsoft Visio和心智圖軟體如Freemind。如果你雄心勃勃，甚至可以開發自己的內部基于Web的工具。

使用過程

現在，你應該明白什么是過程的樣子，包括每個階段的具體細節，并有一定的如何構建您的特定網頁設計的構思過程。這是一個偉大的第一步，但它仍然只是第一步！不要錯過這個下位：知道進程如何能提高你的整體業務，以及如何使用它時，接近并與客戶進行交互。

煉油過程

這一過程將會是不同的每一個設計師，并為每個項目。制定自己的過程，并確定什么是有用的你或你的團隊。只有這樣，才能真正有用的過程。畢竟，自由職業者可以起到顯著不同的目標市場。

項目符號列表是很好，但是這個過程可以更有效和較復雜。的資源，工具和網頁設計博客和Twitter發布的許多鏈接送入過程的不同部分適合。這是一種非常有用的方法來改進過程就是添加資源鏈接到每個階段，并開發自己的資源，如品牌的文檔模板。

自由職業者的一些常用的文件：

• 客戶調查問卷，
• 發票，
• 項目章程，
• 文檔交付給客戶，
• 用戶帳戶，
• 數據庫表的圖表，
• 網站地圖。

文件和歸檔

文件和儲存是非常重要的把握。由于世俗的，因為這些任務就可以了，他們一定的幫助時報稅季節來臨時，或當小自由企業開始擴大。你永遠不能過于紀律，當涉及到工作效率和時間。你可以建立一個標準的文件格式，所有的客戶端和文件夾結構，或保持以前的客戶和項目文件的列表或存檔。你可以使用任何東西，從簡單的名單，以全力以赴的小企業會計行為。

一個過程使得客戶放心

許多客戶認為作為一個黑盒子Web開發，即使你試圖教育他們的方法。對他們來說，他們提供他們的要求，建議和內容，然后一段時間后會出現一個網站或開始初具規模。他們往往完全主要方面的過程中，如設計和開發分離，不知道。手頭上有一個有組織的，簡潔的過程可以幫助組織客戶的想法，并于安心，更何況幫助他們了解他們的錢哪里去。

大綱作為自由職業者我的基本過程是迄今為止最常見的第一步，我與潛在的或新的客戶需要。快速，高層次“，這是它的工作原理”的討論提供了整個項目的框架。一旦你有這樣的討論，客戶將能更好地了解哪些是他們特別需要，你會在某些點提供的時間表，什么類型的工作你會參與，當您去。最重要的是，可以討論任何誤解或扼殺在萌芽狀態混亂。

設計師往往過于深入到網頁設計，以實現大多數人不知道他們做什么或了解他們的術語，知道創造一個成品所涉及的步驟。開始與理解“無能”客戶端新鮮可以艱巨。

它是一個商業

這是一個企業，并概述了這里的步驟基本的路徑小型企業管理。當你在客戶或員工或承包商成長，你會發現有一個不斷增長自己的工作清單，并從所有的事情頭痛的跟蹤。給自己一個突破，并在尋找投資工具，以幫助您有效地完成工作一段時間。擴大的過程文件是一個偉大的這條道路上邁出的第一步。

提示

• 問一個非技術的朋友，審查您的進程。如果他們是有意義的，它會使你的客戶意識。
• 以此為出發點，以建立或完善自己的其他設計師的過程。查看相關資源的鏈接。
• 構建到您的過程文檔模板和Web應用程序。這將節省時間，讓你更專業。

風險

一個進程不能被應用到每一個項目。雖然你的進程將是有益的，當你第一次參加在規劃討論客戶端，一定要審查之前發生的討論，以確保它適合的項目。