網(wǎng)站建設(shè)實戰(zhàn)：從0開始做外貿(mào)B2B電子商務(wù)網(wǎng)站（一）

時間：2022-08-25 20:57:01 | 來源：網(wǎng)站運營

時間：2022-08-25 20:57:01 來源：網(wǎng)站運營

許多想涉足電商的傳統(tǒng)行業(yè)客戶，不知道怎么入手做電子商務(wù)網(wǎng)站。那么我就拿自己的http://www.export.cn 項目作為實戰(zhàn)項目詳細(xì)解說電商網(wǎng)站設(shè)計開發(fā)過程。http://www.export.cn 網(wǎng)站功能比較復(fù)雜，整個網(wǎng)站設(shè)計開發(fā)過程耗時長，我會堅持更新完。

做一個網(wǎng)站首先得有一個網(wǎng)站域名，我們采用的 http://www.export.cn 域名，logo設(shè)計一開始考慮的是“中國絲綢之路”這種象征意義的logo，如下圖：







后來發(fā)現(xiàn)logo設(shè)計不夠簡單，結(jié)構(gòu)太復(fù)雜，縮小了不好看，就最終確定采用簡約易記的logo設(shè)計，如下圖：




就這樣定下來了logo設(shè)計。

網(wǎng)站詳細(xì)功能需求文檔也非常重要，這是網(wǎng)站設(shè)計開發(fā)公司（網(wǎng)站建設(shè)公司）報價和報時間的依據(jù)，也需要將來作為合同附件雙方一起簽字。這里放上export.cn網(wǎng)站詳細(xì)欄目功能需求文檔下載鏈接。有興趣的朋友可以下載文檔查看。

logo和網(wǎng)站功能需求文檔都確認(rèn)好了，接下來就開始做網(wǎng)站首頁設(shè)計。首頁排版布局有點復(fù)雜，所以先出首頁線框圖，如下圖：








首頁線框圖細(xì)節(jié)上調(diào)整一些內(nèi)容之后，大體上覺得沒啥問題，然后網(wǎng)站設(shè)計師會盡快設(shè)計好網(wǎng)站首頁。那么只能等幾天了。

幾天后....

網(wǎng)站首頁設(shè)計稿出來了。如下圖：







顏色是我個人比較喜歡的綠色，綠色和藍(lán)色一樣，適合頁面文字長期閱讀（有利于增強用戶訪問PV）。整個頁面排版布局盡量簡約、清爽，符合歐美網(wǎng)站用戶審美觀。感謝設(shè)計師把各種產(chǎn)品一級類別小圖標(biāo)也設(shè)計出來了，她花了不少時間?？傮w上還不錯，但感覺有點和其他b2b網(wǎng)站雷同了。我沒想用藍(lán)色或者橘紅色作為網(wǎng)站主色調(diào)就是希望用戶能方便的把http://export.cn網(wǎng)站和其他b2b網(wǎng)站區(qū)分開來。目前這個首頁設(shè)計稿感覺還不夠區(qū)分明顯，已經(jīng)交代了設(shè)計師要區(qū)分明顯一些，尤其是首頁頁頭第一屏設(shè)計要和其他b2b網(wǎng)站區(qū)分開來。

又過了一兩天......

首頁設(shè)計稿，設(shè)計師聽取我的意見，把首頁第一屏視覺效果盡量做得與其他b2b網(wǎng)站不同，將logo居中了（比較少網(wǎng)站這么做吧？）。為了用戶搜索方便同時也為了頂部元素排版布局美觀，將頂部搜索條放大放寬。同時在頁面其他內(nèi)容做了一些細(xì)節(jié)調(diào)整。如下圖(請點擊下圖看大圖)：







我看了之后，覺得可以再區(qū)分明顯一些，把頁頭和頁尾加上綠色底色。于是改成了如下圖(請點擊下圖看大圖)：







這樣子應(yīng)該差不多了，就這么把網(wǎng)站首頁設(shè)計稿定下來吧。下一步還得繼續(xù)整理網(wǎng)站內(nèi)頁頁面和頁面字段內(nèi)容。

未完，下次繼續(xù)。