前幾天剛給一家本溪的公司弄了個(gè)網(wǎng)站，說(shuō)讓我分享一下建站過(guò)程，真沒(méi)他們想的那么復(fù)雜。我今天就按我自己從頭做到尾的步驟來(lái)嘮嘮，就四步。

第一步：得先搞清楚他們想要個(gè)啥樣的網(wǎng)站

我直接聯(lián)系了那家本溪公司的老板，約了個(gè)地方坐下聊。他拿出一張紙，上面密密麻麻寫(xiě)了好多想法。這個(gè)說(shuō)“要展示產(chǎn)品”，那個(gè)說(shuō)“要有客戶留言功能”，還有個(gè)說(shuō)要讓用戶能直接在網(wǎng)上下單。

我，一邊聽(tīng)，一邊拿小本本記重點(diǎn)，還得不停問(wèn)：

• “咱這公司主要干啥的？目標(biāo)客戶是哪些人？”
• “網(wǎng)站顏色、樣式有偏好嗎？喜歡大氣還是清爽？”
• “這些功能哪個(gè)是最急的，哪個(gè)可以晚點(diǎn)做？”

聊了差不多倆小時(shí)，總算把他們那堆想法理清楚了。我就把要點(diǎn)都記下來(lái)，弄了個(gè)簡(jiǎn)單需求單，雙方簽字確認(rèn)。這一步可太關(guān)鍵了，后面做起來(lái)就省事。

第二步：開(kāi)始動(dòng)手設(shè)計(jì)網(wǎng)站的樣子

需求弄明白了，我就開(kāi)始琢磨網(wǎng)站的布局了。坐電腦前，先畫(huà)了好幾個(gè)草圖。

首頁(yè)放什么？產(chǎn)品展示放哪？聯(lián)系方式擺哪？一點(diǎn)點(diǎn)摳細(xì)節(jié)。我用工具簡(jiǎn)單做了個(gè)首頁(yè)的設(shè)計(jì)圖，還有幾個(gè)內(nèi)頁(yè)的樣子圖，選了個(gè)偏藍(lán)色的主題，看著比較穩(wěn)當(dāng)。

然后把這些圖紙發(fā)給公司老板看。他們也不是特別清楚，不過(guò)看圖就比之前明白多了，提了個(gè)小意見(jiàn)，把導(dǎo)航欄的位置挪了挪。來(lái)回搞了兩三次，總算把這個(gè)網(wǎng)站的“樣貌”給定了下來(lái)。

第三步：真刀真槍開(kāi)始搭網(wǎng)站了

設(shè)計(jì)圖搞定，真正動(dòng)手開(kāi)搞。我這頭找了個(gè)好使的開(kāi)源系統(tǒng)搭后臺(tái)框架，省得自己從零寫(xiě)代碼。

• 開(kāi)始往里填內(nèi)容，產(chǎn)品圖片、公司介紹、成功案例… 一個(gè)一個(gè)版塊整。
• 功能部分就比較費(fèi)勁了，客戶留言板得安裝插件調(diào)試下單功能也是單獨(dú)搞了個(gè)插件集成進(jìn)去。
• 邊做邊預(yù)覽效果，看看手機(jī)顯示正常不？用平板打開(kāi)會(huì)不會(huì)錯(cuò)位？檢查好幾天。

功能基本弄好后，趕緊叫老板他們自己來(lái)試，點(diǎn)哪里都試試看。結(jié)果留言功能有點(diǎn)小卡，他們提交不順暢，又回頭調(diào)了半天代碼。所有鏈接都得一個(gè)一個(gè)點(diǎn)開(kāi)測(cè)試，怕出404頁(yè)面錯(cuò)誤。

第四步：一步上線開(kāi)跑！

網(wǎng)站內(nèi)部搞掂了，剩下就是讓它能在網(wǎng)上被看到。老板提前買好了網(wǎng)站地址。

• 我就去找服務(wù)器服務(wù)商，花幾百塊租了一個(gè)基礎(chǔ)版本空間。
• 把在本地調(diào)試好的所有網(wǎng)站文件，包括程序、數(shù)據(jù)庫(kù)、圖片啥的，全部打包上傳到網(wǎng)上服務(wù)器。
• 把網(wǎng)址解析記錄設(shè)置

打開(kāi)瀏覽器，輸入他們買的網(wǎng)站地址，“唰”的一下，網(wǎng)站成功蹦出來(lái)了！

這還沒(méi)完。接下來(lái)幾個(gè)月，我偶爾還盯著后臺(tái)。有次服務(wù)器響應(yīng)慢了，排查了一下是流量有點(diǎn)超標(biāo)，趕緊聯(lián)系升了個(gè)空間套餐；還有次老板說(shuō)某個(gè)產(chǎn)品價(jià)格想調(diào)整，我馬上登錄后臺(tái)幫他改

整個(gè)過(guò)程下來(lái)，確實(shí)就像標(biāo)題說(shuō)的，分這四步真挺順溜。只要一開(kāi)始談得夠細(xì)夠明白，后面按部就班來(lái)搞，上線確實(shí)沒(méi)那么嚇人。