在網站(zhàn)開(kāi)始制(zhì)作(zuò)前我們需要(yào)對(duì)要(yào)做(z​uò)的(de)網站(zhàn)有(yǒu)個(gè)基本的(de)定位和(hé)規劃，比如(rú)要(yào)展示的(de)數(λshù)據是(shì)什(shén)麽？數(shù)據量多(duō)大(dà)？用(yòng)戶是(shì£)誰？訪問(wèn)量多(duō)大(dà)？公司有(yǒu)沒有(yǒu)自(zì)己的(de)基本色要(yào)求？對(duì)網站(zhàn)技(jì)術(shù)架構有(yǒu)沒有(✔yǒu)要(yào)求？後期運維需求是(shì)什(shén)麽？網站(zhàn)對(duì)工(gōng)期的(de)要(yào)求？這(zhè)些(✔xiē)問(wèn)題需要(yào)網站(zhàn)所有(yǒu)者心裡(lǐ)有(yǒu)數(shù)或者需要(yào)和(₽hé)制(zhì)作(zuò)團隊一(yī)塊來(lái)調研搞清楚，否則會(huì)影(yǐng)響後邊的(de)技(jì)術(shσù)、架構的(de)選型，及UI的(de)設計(jì)等。蘇州網站(zhàn)制(zhì)作(zuò)給大(dà)家(jiā)詳細介§紹下(xià)網站(zhàn)的(de)制(zhì)作(zuò)流程。
 

一(yī)、前期準備溝通(tōng)工(gōng)作(zuò)

1、明(míng)确要(yào)展示的(de)數(shù)據

我們在産品或者項目開(kāi)發中往往提到(dào)數(shù)據驅動，知(zhī)道(dào)要(yào)展示的(de)數(★shù)據是(shì)什(shén)麽才能(néng)設計(jì)以什(shén)麽的(de)頁面樣式、組件(jiàn)來(lái)展示數(shù)據。比如(rú)數(shù)據就(jiù)是(sh×ì)一(yī)篇篇的(de)文(wén)章(zhāng)，那(nà)我們在設計(jì)頁面的(de)時(shí)候可∑(kě)以參照(zhào)今日(rì)頭條。但(dàn)是(shì)數(shù)據如(rú)果是(shì)些(xiē)金(jīn)融類的(de)數(shù)據可(kě)∞能(néng)就(jiù)需要(yào)用(yòng)k線圖、柱狀圖、雷達圖或者金(jīn)融方面更專業(yè)的(de)圖表了(le)。可(kě)以說(shuō)要(yào)展示什(shén)<麽數(shù)據決定了(le)頁面樣式、頁面功能(néng)等。分(fēn)析要(yào)展示的(de)數(shù)據對(duì)後邊數(shù)據庫的(de)設計(jì)也(yě) 是(shì)必要(yào)的(de)。是(shì)選擇關系型數(shù)據庫、還(hái)是(shì)非關系型，或者本身(shēn‍)就(jiù)不(bù)需要(yào)數(shù)據庫，文(wén)件(jiàn)存儲就(jiù)滿足要(yào)求了(le)。

2、數(shù)據量的(de)大(dà)小(xiǎo)

數(shù)據量的(de)大(dà)小(xiǎo)決定後台存儲架構，單機(jī)存儲還(hái)是(shì)分(fēn)布式，需不(bù)需要(yào)利用(yòng)緩存技π(jì)術(shù)等。對(duì)大(dà)數(shù)據量怎麽解決網站(zhàn)訪問(wèn)讀(dú)寫的(de)性能(nεéng)問(wèn)題等。這(zhè)塊比較偏技(jì)術(shù)架構，不(bù)過對(duì)網站(zhàn)的(de)性能(néng)、可(kě≠)維護性、可(kě)擴展性至關重要(yào)。

3、确定網站(zhàn)的(de)用(yòng)戶

網站(zhàn)面對(duì)的(de)用(yòng)戶一(yī)般分(fēn)為(wèi)2B和(hé)2C，或者兩類用(yòng)戶€都(dōu)有(yǒu)。對(duì)于2B類的(de)網站(zhàn)在設計(jì)上(shàng)偏傳統些(xiē)、還(hái)要(yào)考慮相(xiàng)關的("de)行(xíng)業(yè)風(fēng)格。2C的(de)一(yī)般比較互聯網化(huà)，在技(jì§)術(shù)上(shàng)可(kě)以選擇更先進的(de)技(jì)術(shù)。為(wèi)什(shé≈n)麽這(zhè)麽說(shuō)那(nà)，2B的(de)業(yè)務很(hěn)多(duō)是(shì) 辦公室用(yòng)的(de)，涉及到(dào)網絡安全問(wèn)題對(duì)操作(zuò)系統版本、浏覽器(qì)版本可(k¶ě)能(néng)有(yǒu)限制(zhì)，如(rú)果使用(yòng)技(jì)術(shù)比較新可(kě)能(néng)浏Ω覽器(qì)不(bù)兼容，實施起來(lái)的(de)工(gōng)作(zuò)量就(jiù)比較大(dà)了(le)。筆(bǐ)者曾經做(zuò)過國(guó≈)家(jiā)部委的(de)web系統，整個(gè)部委官方的(de)系統是(shì)xp、ie是(shì)7或者8。如(rú)果在網站(zhàn)設計(jì)之前對₹(duì)這(zhè)個(gè)不(bù)了(le)解，那(nà)就(jiù)是(shì)一(yī)個(gè)大(dà)坑！

4、訪問(wèn)量

網站(zhàn)架構師(shī)會(huì)根據訪問(wèn)量的(de)大(dà)小(xiǎo)設計<(jì)系統架構，配置系統資源。比如(rú)服務器(qì)的(de)數(shù)量、網絡帶寬，并根據并發數(s'hù)設計(jì)系統架構等。小(xiǎo)的(de)網站(zhàn)一(yī)台服務器(qì)甚至買些(xiē)發布空(λkōng)間(jiān)就(jiù)夠了(le)，對(duì)于訪問(wèn)量大(dà)、并發要(yào)求高(gāo)的(de)就(Ωjiù)需要(yào)在硬件(jiàn)資源和(hé)架構上(shàng)進行(xíng)整體(tǐ)考慮。

5、公司基本色等

網站(zhàn)除了(le)要(yào)滿足一(yī)些(xiē)功能(néng)外(wài)，對(duì)外(wài)也(yě)是(shì)公司的(πde)宣傳窗(chuāng)口，網站(zhàn)的(de)顔色、風(fēng)格等也(yě)反應了(le)公司的(de)調性。很(hěn)<多(duō)公司也(yě)有(yǒu)自(zì)己的(de)基本色或者是(shì)行(xíng)業(yèσ)的(de)基本色。比如(rú)環保類的(de)企業(yè)、婚慶類的(de)、喪葬類的(de)在選色應該有(yǒu)所不(bù)一(yī)樣。還(hái)有(yǒu)就(jiù)是→(shì)公司logo需要(yào)在網站(zhàn)上(shàng)體(tǐ)現(xiàn)的(de)需要(yào)提前準備好(hǎo)。

6、網站(zhàn)架構要(yào)求

很(hěn)多(duō)公司有(yǒu)自(zì)己技(jì)術(shù)團隊或者開(kāi)發完後需要(yào)自(zì)己的(de)團隊對(duì)網站(zhàn)進行(xíng)後期版€本叠代、bug修改。為(wèi)了(le)延續技(jì)術(shù)的(de)統一(yī)，需要(yào)網站(zh"àn)的(de)技(jì)術(shù)和(hé)現(xiàn)有(yǒu)的(de)團隊是(shì)匹配的(de)。這(zhè)對(duì)後期運維至關重要(yào)。另外(wài)需要(yào)₽注意的(de)是(shì)技(jì)術(shù)方面的(de)先進性、流行(xíng)性。不(bù)能(néng)用(yòng☆)太老(lǎo)的(de)技(jì)術(shù)，太生(shēng)僻的(de)技(jì)術(shù)等。

7、後期運維需求

為(wèi)什(shén)麽把後期運維單獨提出來(lái)強調那(nà)？很(hěn)多(duō)公司或者™沒有(yǒu)做(zuò)過網站(zhàn)的(de)公司很(hěn)容易忽略這(zhè)塊，這(zhè)塊也(yě)是(shì)較重的(de)隐性成本。&一(yī)般的(de)網站(zhàn)會(huì)帶一(yī)個(gè)後台管理(lǐ)系統，包括用(yòng)戶管理(lǐ)、日(rì)志(zhì)管理(lǐ)、內(nèi)容管理(lǐ)£等，在網站(zhàn)建設前對(duì)這(zhè)塊也(yě)需要(yào)評估功能(néng)點和(hé)工(gōng↓)作(zuò)量。

8、網站(zhàn)工(gōng)期

根據網站(zhàn)工(gōng)期的(de)要(yào)求，需要(yào)制(zhì)定産品開(kāi)發計(jì)劃、人(rén)員(yuán)投入調配以及服務器(qì) 、域名等資源調配。

二、網站(zhàn)制(zhì)作(zuò)

1、網站(zhàn)設計(jì)

設計(jì)師(shī)會(huì)根據前期溝通(tōng)對(duì)網站(zhàn)整體(tǐ)布局結構進行(xíng)設計(jì)，包括風(fεēng)格、配色、字體(tǐ)、圖标等。整個(gè)設計(jì)要(yào)包含網站(zhàn)的(de)所有(yǒu)功能π(néng)，所有(yǒu)頁面。有(yǒu)的(de)公司把設計(jì)還(hái)分(fēn)為(wèi)産品設計(jì)、UI/UE設計(jì)。這(zhè)個(gè)階段↔需要(yào)用(yòng)戶深入參與，以避免後期的(de)修改和(hé)返工(gōng)。設計(jì)☆師(shī)在這(zhè)一(yī)階段還(hái)需要(yào)把設計(jì)的(de)頁面進行(xíng)切∑圖等工(gōng)作(zuò)，以給前端進行(xíng)前端開(kāi)發用(yòng)。

2、前端頁面制(zhì)作(zuò)

前端工(gōng)程師(shī)根據網站(zhàn)的(de)整體(tǐ)設計(jì)利用(yòng)®HTML、js等前端技(jì)術(shù)把網站(zhàn)實現(xiàn)出來(lái)。同時(shí)需要(yào)進行(xíng)兼容性測試，在ie、谷歌(gē)、火(huǒ≤)狐、360等不(bù)同品牌不(bù)同版本間(jiān)進行(xíng)測試，以保證網站(zhàn)在不(bù)同的(de)浏覽器(qì)之↔間(jiān)都(dōu)能(néng)正常訪問(wèn)，并能(néng)達到(dào)設計(jì)的(de)效果。

3、架構及環境搭建

涉及到(dào)後台開(kāi)發的(de)網站(zhàn)需要(yào)搭建服務器(qì)、數(shù)據庫、ide、類庫等開(kāi )發環境，有(yǒu)時(shí)候前端也(yě)需要(yào)。複雜(zá)的(de)系統還(hái)需要(yào)考慮分(fēn)布式™部署、負載均衡、數(shù)據庫分(fēn)層等。

4、後端開(kāi)發

後端開(kāi)發主要(yào)實現(xiàn)網站(zhàn)的(de)交互、數(shù)據存取等。包括用(yòλng)戶的(de)登錄注冊、業(yè)務數(shù)據的(de)增加修改删除、用(yòng)戶體(tǐ)系的(de<)建立維護、後台管理(lǐ)等。後端是(shì)整個(gè)系統業(yè)務邏輯的(de)實現(xiàn)，需要(yào)和(hé)前端工(gōng)程師(shī)定義→交互協議(yì)、接口等。也(yě)需要(yào)和(hé)前端工(gōng)程師(shī)進行(xíng)聯調測€試。

5、測試

測試分(fēn)為(wèi)單元測試和(hé)整體(tǐ)測試。複雜(zá)的(de)系統需要(y®ào)寫測試用(yòng)例，并伴随整個(gè)開(kāi)發周期。另外(wài)除了(le)進行(xíng)功能(néng)測試外(wà§i)，還(hái)需要(yào)進行(xíng)性能(néng)測試。比如(rú)測試網頁的(de)響 應速度、并發量等。測試過程的(de)bug需要(yào)記錄提交，修改完後也(yě)需要(yào)複測确認。

6、發布運行(xíng)

系統測試完bug修改後，在确保沒有(yǒu)bug後，系統可(kě)以發布運行(xíng)。這(zhè)時(shí)≈候需要(yào)制(zhì)定系統上(shàng)線、運維的(de)機(jī)制(zhì)和(hé)保障。比如(rú∞)後期bug修改後的(de)系統發布時(shí)間(jiān)、數(shù)據備份周期等。

7、域名、服務器(qì)等的(de)申請(qǐng)

另外(wài)如(rú)果是(shì)互聯網系統還(hái)需要(yào)申請(qǐng)域名和(hé)外(wài)網IP，服務器∏(qì)可(kě)以采用(yòng)托管、雲等方式進行(xíng)配置。

以上(shàng)就(jiù)是(shì)網站(zhàn)建設的(de)一(yī)般流程，其實複雜(€zá)網站(zhàn)系統在建設開(kāi)發過程要(yào)複雜(zá)的(de)多(duō)，需要(yào)多(duō)個₩(gè)團隊協作(zuò)完成。以上(shàng)蘇州網站(zhàn)建設隻是(shì)梳理(lǐ)一(yī)般™需要(yào)的(de)流程。大(dà)系統需要(yào)設計(jì)、前端制(zhì)作(zuò)、後端開(kāi)≠發、測試、上(shàng)線等反複叠代發布。