編輯導(dǎo)讀：一個(gè)公司的官網(wǎng)可以說是一家公司的門面，在用戶對公司以及產(chǎn)品沒有任何了解時(shí)，官網(wǎng)是向用戶傳達(dá)信息的重要途徑。在某種程度上來說，官網(wǎng)影響著用戶對這家公司及其產(chǎn)品的認(rèn)知和信任。本文從4個(gè)方面出發(fā)，分享了官網(wǎng)設(shè)計(jì)需要注意的一些問題，供大家一同參考和學(xué)習(xí)。

官網(wǎng)可以說是企業(yè)的門面之一，承載了品牌宣傳、信息展示、功能輸出等等屬性，是一個(gè)大綜合產(chǎn)品，里面有一些門道值得研究。

01 官網(wǎng)定位

做一個(gè)產(chǎn)品，首先要從上層確定產(chǎn)品的定位是什么，官網(wǎng)也是一樣。先回答“官網(wǎng)三連問”：

1. 誰會看官網(wǎng)？為什么會看？
2. 在什么場景/渠道下看？
3. 我希望他看完之后怎么樣？

根據(jù)這些問題答案的不同，官網(wǎng)大致可以分為以下幾種類型

1. 信息展示型

此類官網(wǎng)多用做品牌形象展示，是企業(yè)信息集中展示的入口，多結(jié)合品宣、活動推廣一起運(yùn)營。

所有企業(yè)的官網(wǎng)都有企業(yè)信息展示型屬性，力求在用戶看到官網(wǎng)后，就可以了解到企業(yè)的品牌等信息，直接促進(jìn)進(jìn)一步的溝通交易等延伸場景。所以品牌信息在此類官網(wǎng)中可以說是“多多益善，形式多樣”。

2. PPT型

此類官網(wǎng)一般是b端企業(yè)偏多，定位官網(wǎng)是“老板的PPT”，在沒有講解之前是不能準(zhǔn)確了解信息詳情，比如行業(yè)資訊、企業(yè)發(fā)展成果、企業(yè)專屬稱謂等等。

此類官網(wǎng)一般是和線下推廣渠道結(jié)合在一起，推廣人員當(dāng)面講解隱藏信息，直接推動業(yè)務(wù)。

3. 綜合型

此類官網(wǎng)包含交易模型，附屬信息展示屬性，PPT屬性，是企業(yè)信息宣傳、業(yè)務(wù)承載的綜合體?！按斯倬W(wǎng)非彼官網(wǎng)”，更像是在公司主產(chǎn)品內(nèi)，加入幾個(gè)單獨(dú)的信息展示模塊，附帶傳統(tǒng)官網(wǎng)能力。

隨著web技術(shù)的不斷完善，更多的公司重新選擇B/S結(jié)構(gòu)作為主產(chǎn)品架構(gòu)，進(jìn)而更多的官網(wǎng)屬性和主交易產(chǎn)品被設(shè)計(jì)在一個(gè)入口下，綜合型官網(wǎng)是目前的主流選擇。

從企業(yè)產(chǎn)品矩陣角度看官網(wǎng)，能為官網(wǎng)定位更多的產(chǎn)品屬性，比如連接業(yè)務(wù)產(chǎn)品、線索入口、加盟入口等，可以說“沒有業(yè)務(wù)的官網(wǎng)都是內(nèi)耗資源”。官網(wǎng)定位是一個(gè)前臺產(chǎn)品直連用戶，這決定了官網(wǎng)可以承擔(dān)增加用戶粘性，輔助業(yè)務(wù)交互體驗(yàn)的角色。

02 信息準(zhǔn)備

官網(wǎng)定位清晰后，就可以準(zhǔn)備官網(wǎng)的信息，這里面包含兩個(gè)環(huán)節(jié)：

1) 信息匯總

2) 信息展示

1. 信息匯總

直觀印象官網(wǎng)的信息大部分來自企業(yè)內(nèi)部，這完全是個(gè)誤解。好的官網(wǎng)是在所屬行內(nèi)有影響力，做行業(yè)信息輸出。如果沒有那么高的段位，至少做到由行業(yè)出發(fā)，結(jié)合本企業(yè)做個(gè)性化調(diào)整。所以準(zhǔn)備官網(wǎng)信息，首選需要置身行業(yè)，整理行業(yè)的信息，站在“面”得角度看，可以提升官網(wǎng)的深度。

收集企業(yè)內(nèi)部信息的時(shí)候，需要基于需求出發(fā)，或者基于需求做信息處理。每個(gè)部門角色對官網(wǎng)的期待不同，也就是需求不同，整合需求和信息的對照表，結(jié)合企業(yè)階段目標(biāo)，做信息有效性和優(yōu)先級排序處理，進(jìn)而確定官網(wǎng)信息展示優(yōu)先級，以指導(dǎo)后期的版本規(guī)劃及頁面優(yōu)先級排列。

2. 信息展示

考慮信息展示，首先確定官網(wǎng)想給誰看，誰會看。想給誰看對應(yīng)著推廣渠道，不同的渠道受眾不同；誰會看對應(yīng)著用戶的劃分，包含種類、等級、分布等等層面。對不同角色要展示的信息以及信息的模塊是有很大差別，即便是c端產(chǎn)品也不要奢求讓所有人能看懂每一個(gè)信息。

第二部分決定信息展示的是場景，不同用戶在什么時(shí)間，什么場合，什么需求背景下會看官網(wǎng)，進(jìn)而決定了官網(wǎng)的展現(xiàn)形式，如pc還是m，圖片還是視頻，一步展示還是分步展示等。

很多官網(wǎng)會自成產(chǎn)品矩陣，比如延伸活動頁面矩陣、嵌套多個(gè)前置廣告頁面，開通多個(gè)子官網(wǎng)，信息屬性和產(chǎn)品玩法結(jié)合思考，同步推進(jìn)。

03 產(chǎn)品小套路

產(chǎn)品展現(xiàn)層的內(nèi)容，是根據(jù)以上的信息分析處理的決定的，官網(wǎng)的基本形式已經(jīng)趨同就不再贅述，這里只說一些小套路。

1) 能動就不要靜，能用圖就不用字

根據(jù)對注意點(diǎn)的研究結(jié)果，顯示人對運(yùn)動物體的注意力強(qiáng)于靜止物體，對圖的注意力強(qiáng)于文字。基于這個(gè)理論，官網(wǎng)里面的重要信息最好采用圖片或者動態(tài)的方式展示，設(shè)計(jì)用戶的注意力的走向。

2) 內(nèi)容有限，交互來湊

當(dāng)展示內(nèi)容有限的時(shí)候，可以通過增加交互的方式“騙”用戶。

把功能大致的劃分為實(shí)際功能和頁面功能，實(shí)際功能就是真實(shí)的數(shù)據(jù)流轉(zhuǎn)，頁面功能是在前端操作但不影響數(shù)據(jù)的動作。頁面的一些交互設(shè)置，可以增加用戶使用的沉浸感，讓用戶感覺做了多個(gè)操作，實(shí)際后臺沒有數(shù)據(jù)流轉(zhuǎn)。最常見的就是增加轉(zhuǎn)場動畫、設(shè)置可以無限點(diǎn)擊的“快感小按鈕”比如多次點(diǎn)贊等等。

交互方面，不要有交互的死胡同，能點(diǎn)進(jìn)去但退不出來的體驗(yàn)非常不好。

3) 頁面間可以來回跳轉(zhuǎn)

觀察很多官網(wǎng)，頁面數(shù)量其實(shí)很少，但給用戶的感覺是頁面非常多，簡單的說就是“在沒幾個(gè)頁面間跳來跳去”，這個(gè)我們戲稱“耍流氓式的產(chǎn)品設(shè)計(jì)”。頁面設(shè)置多個(gè)互相跳轉(zhuǎn)的入口，但背后相同的跳轉(zhuǎn)邏輯。

這樣的方式可以使用，但注意產(chǎn)品的縱向跳轉(zhuǎn)深度最好不要超過5層，有數(shù)據(jù)顯示5層過后的體驗(yàn)會驟降，頁面流失率會成倍增加。

跳轉(zhuǎn)可以跳級，這也是個(gè)小技巧，一步一動和一步多動結(jié)合使用。常見的比如交易前需登錄的網(wǎng)站，未登錄狀態(tài)下在交易頁面點(diǎn)擊下單，會彈出登錄頁面，操作登錄后，是跳轉(zhuǎn)首頁呢？還是停留在當(dāng)前交易頁面？

04 SEO優(yōu)化

無論什么類型的官網(wǎng)，無論給什么類型用戶準(zhǔn)備的內(nèi)容，多一點(diǎn)人看總是好的，讓目標(biāo)用戶能在百度搜到官網(wǎng)是基礎(chǔ)，所以說官網(wǎng)一定要做搜索引擎優(yōu)化，也就是SEO。

直觀順序是先設(shè)計(jì)官網(wǎng)，上線后再做搜索優(yōu)化，常規(guī)順序沒有問題。更好的方式是在官網(wǎng)設(shè)計(jì)的過程中，就要有搜索優(yōu)化的意識，做搜索優(yōu)化的準(zhǔn)備。

百度的小蜘蛛來抓取信息，收錄詞條，提升排名的規(guī)則非常復(fù)雜而且持續(xù)更新，不是專業(yè)做搜索相關(guān)的公司對其大的方向保持了解跟進(jìn)即可，對一些產(chǎn)品內(nèi)提升搜索優(yōu)化的方式要持續(xù)積累。這里羅列一些產(chǎn)品產(chǎn)品層面的優(yōu)化方式：

• 各頁面的TDK必須完整；品牌詞、核心業(yè)務(wù)詞需要多次展現(xiàn)；圖片最好有alt、title屬性；
• 不要出現(xiàn)單一url，主要針對前端VUE框架，把連接都封裝在一個(gè)url里的方式對搜索優(yōu)化非常不友好；
• 不能存在低質(zhì)量或空白頁面，減少相似頁面出現(xiàn)的概率；
• 面包屑盡量完整，最好有單獨(dú)的site map頁面；
• 404、302頁面必須存在；
• 網(wǎng)站導(dǎo)航欄位置要主次分明，蜘蛛抓取習(xí)慣為從左向右，因此越重要的欄目靠前，關(guān)于我們、聯(lián)系我們等不作為排名的欄目靠后；
• 產(chǎn)品列表頁最佳展示8-10條/頁；產(chǎn)品詳情頁最好有產(chǎn)品推薦；
• 內(nèi)容資訊模塊最好有，這部分占權(quán)重比較大，每篇內(nèi)容中出現(xiàn)5-8次關(guān)鍵詞為最佳；

官網(wǎng)在產(chǎn)品經(jīng)理心中的地位比較復(fù)雜，說大可大，說小可小，大到是公司的核心門面產(chǎn)品，小到可能無聊的只是幾個(gè)靜態(tài)頁面間跳轉(zhuǎn)。

但可以確定的是，官網(wǎng)是需要隨著企業(yè)發(fā)展，持續(xù)調(diào)整價(jià)值導(dǎo)向、能力加持。

本文由 @謝宇 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議