從這一篇文章開始，我將結(jié)合我們多年的外貿(mào)網(wǎng)站建站、優(yōu)化經(jīng)驗，教大家如何設(shè)計自己的網(wǎng)站，從而滿足國外客戶的用戶體驗，全面提升外貿(mào)自建站的流量與訂單獲取能力。

這個是2018年下半年，我們?yōu)橐患夜こ虣C械客戶開發(fā)的外貿(mào)網(wǎng)站，開發(fā)周期將近1個半月。在這期間，沒有任何一個階段爭取過客戶的改進意見。從開始設(shè)計到驗收，一次性一氣呵成。

根據(jù)這個案例，我來講解，我從哪些角度去進行網(wǎng)站架構(gòu)和內(nèi)容設(shè)計。你們開始記！

#1、了解全球行業(yè)網(wǎng)站通用色調(diào)

每一個行業(yè)和產(chǎn)品領(lǐng)域，都有其獨特的主流色系。這種顏色背景，能夠不斷強化產(chǎn)品或者服務(wù)在客戶心里的感覺。

我們看很多網(wǎng)站的設(shè)計并不美觀，但是在行內(nèi)客戶看來，它又及其地道，這在很多程度上取決于網(wǎng)站的主色調(diào)。

對于工程機械行業(yè)而言，我在進行網(wǎng)站開發(fā)之前，會通過相關(guān)關(guān)鍵詞，搜索全球競爭對手的產(chǎn)品圖片、服務(wù)流程、電子版彩本（我在之前的文章，提及過我有下載老外彩本的愛好。實際上，這對于我的設(shè)計方案，幫助很大）。

很多工作和積累，看似無用，當(dāng)真正發(fā)揮效力的時候，你會感覺信手拈來而又自信滿滿。

所以，最終我做了兩套色系方案：

#FE0000（紅色）+ #000000（黑色）+ #FFFFFF（白色）+ #FFB717（黃色）

#FFBE00（黃色）+ #000000（黑色）+ #FFFFFF（白色）+ #F1F1F1（灰色）

第一種方案，紅色與黑色、白色相結(jié)合，一定會有機械設(shè)備高端的感覺。但是由于工程機械的產(chǎn)品需要添加土黃色，所以視覺上的紅色一定會被黃色沖淡和同化，所以我舍棄了這個方案。

現(xiàn)在給大家呈現(xiàn)的，就是第二種色系搭配。

我是一個經(jīng)常自以為是的人，所以很少聽取客戶的設(shè)計意見。我很自信，對于國外網(wǎng)站元素和用戶體驗的理解和把控，比客戶更加精準(zhǔn)。

所以，我想說的是，如果你打算做好自己的網(wǎng)站，平時一定要注意整理自己行業(yè)的電子彩本、產(chǎn)品色調(diào)、品牌網(wǎng)站。僅靠臨時抱佛腳，就想一蹴而就的事情，基本不會發(fā)生。

#2、首屏Banner海報設(shè)計，獨樹一幟

開篇引入的Banner只是其中一張海報，以下是另外一張。我們要向客戶傳達兩點內(nèi)容：一是目前熱賣的主打產(chǎn)品；第二個方面是我們的產(chǎn)品最大的理念和價值。

我希望大家在做構(gòu)圖和文案的時候，能夠準(zhǔn)確切中客戶要害，不要寫一些不痛不癢的廢話。什么叫不痛不癢的廢話？比如：

我們是中國最大的***供應(yīng)商，專注于***產(chǎn)品研發(fā)與設(shè)計**年。

更高的產(chǎn)品質(zhì)量、更好的售后服務(wù)。致力于如何服務(wù)于全球多少國家、多少客戶。

不要整些虛頭巴腦的，老外不傻。我們需要深入地了解客戶在應(yīng)用產(chǎn)品時，出現(xiàn)的每一個問題、每一個細(xì)節(jié)、每一個因為產(chǎn)品或者系統(tǒng)故障所帶去的損失！

把這些變成設(shè)計的靈感和文案，直擊心底、毫不留情。與此同時，你要記住，你不是一個只賣產(chǎn)品的供應(yīng)商，你是一直在進行技術(shù)服務(wù)的輸出，所以不要盲目地只關(guān)注產(chǎn)品的頁面感覺，多一些應(yīng)用和技術(shù)細(xì)節(jié)展示，會讓客戶印象深刻。

#3、產(chǎn)品展示，風(fēng)格清新靈活

我不喜歡阿里巴巴的產(chǎn)品展示風(fēng)格，過于對稱和死板。而你看大量的國外網(wǎng)站，都是講求順其自然，局部與整體的融合感。

在這里，會有兩個問題你要問我：

為什么整體背景顏色選擇淺灰色？為什么產(chǎn)品要加邊框，而且是圓形邊框？

首先，因為整個Body的字體顏色一定為黑色，這是毋庸置疑的設(shè)計常識。在此基礎(chǔ)上，淺灰色會襯托出黑色的正式、大氣、嚴(yán)謹(jǐn)。

所以，在展示產(chǎn)品時，如果能夠給客戶這樣一種感覺，就再好不過了。

然后，對于產(chǎn)品主圖添加圓形邊框，主要因為產(chǎn)品外形環(huán)狀居多，加上圓框，視覺上的融合度更高，看上去更加舒服，毫不突兀。

你看，同樣在展示產(chǎn)品大類，其實老外更加喜歡簡潔明了，不要加一些JavaScript的動態(tài)特效，嘩眾取寵的結(jié)果往往貽笑大方。

#4、關(guān)于我們，頁面的靈魂所在

你不要告訴我，只要把產(chǎn)品的優(yōu)勢和特點描述清楚即可。信用全球化的時代，任何人都逃避不了建立信用體系這件事。

這件事情本身的價值，遠超產(chǎn)品出口所帶來的的短期利益。

但其實我們國內(nèi)供應(yīng)商，并不在意。長此以往，中國沒有品牌這一定論，毫不為過。那么，我是怎么做About Us或者說Company Overview的布局設(shè)計？

首先，我要多寫。為什么？—— 逆向思維。

只有沒有實力的公司，才會經(jīng)常性地運用圖片和虛無縹緲的內(nèi)容來湊版塊。

老外的網(wǎng)站都是結(jié)結(jié)實實的案例、技術(shù)細(xì)節(jié)、加工與研發(fā)能力。

越不說，越顯得心虛；自曝其短，往往也是取得信任的過程。

要多說，好的、不好的都說。怎么可能有完美的供應(yīng)商？敢于承認(rèn)自己曾經(jīng)出現(xiàn)的問題，恰恰是贏得信任非常重要的前奏?？蛻舨粫δ惝a(chǎn)生懷疑，他們在乎的是你后來，怎么一步步改善和提高的。

所以，在這些思維的引導(dǎo)下，我采用了這種布局。讓公司的歷程與核心技術(shù)工藝，躍然眼前。

#5、緊抓不放，時刻將解決方案擺在首位

毫不避諱地講，任何產(chǎn)品和服務(wù)的內(nèi)驅(qū)力，一定來自它扎實的技術(shù)體系。這種技術(shù)（研發(fā)和生產(chǎn)）不一定是最完善或者最先進的。但是對于老外，尤其是歐美國家客戶而言，扎實靠譜的技術(shù)方案，一定是產(chǎn)品的核心競爭力。

所以，在設(shè)計網(wǎng)站頁面的時候，你要時時刻刻提醒自己：向客戶展示你的系統(tǒng)方案，而不是只會報價、只會推銷產(chǎn)品。

你的網(wǎng)站設(shè)計應(yīng)該展現(xiàn)出一種氣質(zhì)：我不賣產(chǎn)品，甚至你給我錢我都不要；我只講我的技術(shù)和方案，不管你聽沒聽懂，在我講完之后，你哪里來回哪里去。

我們看德國的產(chǎn)品公司，永遠輸出的都是自我價值。正是因為沉迷于自己構(gòu)建的技術(shù)體系，追求技術(shù)層面的不斷深入和探索，才有產(chǎn)品價值的飛速提升。不是不知道客戶的重要性，是真的沒有時間Care那些表面工程。

在做網(wǎng)站設(shè)計時，也是同樣道理。更多地來展示技術(shù)細(xì)節(jié)和系統(tǒng)方案，是最為重要的。在這里，我想說三點感受：

一個好的設(shè)計師，是要具備自己發(fā)現(xiàn)、總結(jié)、感悟的能力的，不是一味地依賴客戶提供素材。

老外往往不是靠你“舔”來的，高端的客戶往往看重的是你的技術(shù)、細(xì)節(jié)、自信。

系統(tǒng)方案永遠比只賣單一產(chǎn)品更能體現(xiàn)品牌價值和利潤空間。

所以你看，在準(zhǔn)備設(shè)計自己網(wǎng)站之前，其實我們需要深入了解非常多的東西，建立多個角度的運營思維。這些思維，會幫助我們創(chuàng)造出更加合適的框架模塊。

這種架構(gòu)的表現(xiàn)力，往往是更加具有穿透力的。在用戶訴求方面，也更加到位而富有張力。

（來源：外貿(mào)網(wǎng)站SEO推廣攻略）

以上內(nèi)容屬作者個人觀點，不代表雨果網(wǎng)立場！本文經(jīng)原作者授權(quán)轉(zhuǎn)載。

上雨果網(wǎng)搜索“跨境資料庫”,領(lǐng)取歐美/東南亞各國市場商機、各大平臺熱銷品報告、跨境電商營銷白皮書！