對于網(wǎng)站，主頁是外觀，它直接決定用戶是否可以準(zhǔn)確地接收網(wǎng)站的主題，以及它是否可以產(chǎn)生對網(wǎng)站的興趣。

我們先來看一下基于Web的主頁的布局：

1.總體布局分析

除浮動導(dǎo)航外，網(wǎng)頁采用左右布局，分為兩列和多行。左欄是內(nèi)容區(qū)，占據(jù)布局的3/4，根據(jù)導(dǎo)航分類推薦內(nèi)容;右欄有更多的尺寸，包括好書推薦，熱門文章，熱門帖子等，但只要你小心，你會發(fā)現(xiàn)，除了熱門文章。其他類別是軟促銷或硬促銷。

恰到好處的促銷不僅會消除用戶，還會增加用戶體驗，給用戶留下“有用”的印象。

接近用戶的當(dāng)前需求。

不要阻止用戶的當(dāng)前行為。

不要干擾用戶的視線。

當(dāng)然，如何平衡廣告效果和用戶體驗是一個永恒的問題，具體取決于具體情況。

此時，Web主頁可以抽象為以下內(nèi)容：

根據(jù)人類的閱讀習(xí)慣：從左到右，從上到下。

用戶將首先瀏覽到左側(cè)的推薦內(nèi)容。當(dāng)視線移動到右側(cè)時，將看到促銷內(nèi)容，然后向下移動，并且將從推薦內(nèi)容中看到促銷內(nèi)容;當(dāng)用戶養(yǎng)成習(xí)慣時，用戶將厭倦正確的促銷內(nèi)容。當(dāng)視線到達(dá)內(nèi)容區(qū)域的邊界時，用戶可以縮回視線，并繼續(xù)向下瀏覽;并且認(rèn)為促銷內(nèi)容有用的用戶可以直接確定右側(cè)的位置并向下瀏覽。

因此，這樣的布局將確保促銷有效，并且不會干擾用戶的行為并影響用戶體驗。

2.導(dǎo)航柱合理性分析

該網(wǎng)站使用導(dǎo)航欄，允許訪問者找到所需的資源區(qū)域，并更清楚，清晰地查找資源。

主頁總共有2個導(dǎo)航欄，一個是網(wǎng)站的總導(dǎo)航欄（浮動），另一個是主頁的內(nèi)容導(dǎo)航欄。我認(rèn)為內(nèi)容導(dǎo)航欄中有兩個不合理的東西：

首先，分類的基礎(chǔ)不統(tǒng)一，沒有邏輯。

“最新文章”，&ndquo;      &ndquo;是基于“文章的特點”，最新的，流行的，我訂閱的，基本上是文章?？梢院喜⒊伞拔恼隆?rd ;; “文章”，“熱門答案”，“知識體系”，“PM日報”根據(jù)“內(nèi)容類型”進(jìn)行分類，類型包括文章，問答，專題，日報;單靠網(wǎng)站導(dǎo)航，無法概括。

它被歸類為：熱帶水果，紫色水果，小吃，蔬菜。當(dāng)用戶看到“熱帶水果”和“紫色水果”時，很容易根據(jù)現(xiàn)實生活的邏輯確定該導(dǎo)航是水果分類導(dǎo)航。當(dāng)你看到“零食”，“草編蔬菜”時，你會發(fā)現(xiàn)與自己的邏輯不一致，找不到新的邏輯歸納，只能用作零碎的單詞記憶;當(dāng)用戶想在下次找到“零食”時，內(nèi)存無法及時與導(dǎo)航欄聯(lián)系，會增加學(xué)習(xí)成本和用戶熟悉度。

降低用戶學(xué)習(xí)成本的方法

使用與大多數(shù)產(chǎn)品一致的符號和手勢（例如：喜歡，喜歡的符號，幻燈片刷新，左右手勢），

充分利用現(xiàn)實世界用戶熟悉的邏輯（例如：微信“銀行卡”;“我的錢包”中的入口;），

為用戶提供新手指導(dǎo)

其次，導(dǎo)航欄內(nèi)容在主頁入口處不止一個

在網(wǎng)站的主導(dǎo)航欄上，還有問題和答案，每日PM，以及我訂閱的入口。使用兩個條目分析用戶的操作路徑，如圖所示。

總導(dǎo)航欄和內(nèi)容導(dǎo)航欄之間的區(qū)別在于，總導(dǎo)航欄暫停在整個網(wǎng)站的頂部，并且在任何頁面上都很突出，也可以直接操作;并且內(nèi)容導(dǎo)航欄僅位于主頁的較低位置?；诖思墑e，用戶更愿意使用總導(dǎo)航欄。

從用戶的實際操作來看，Q&A，PM daily和我的訂閱是不同的。

問答：大多數(shù)用戶（偏向于看到答案）希望看到問題和答案是對流行的問題和答案，學(xué)習(xí)知識和發(fā)展思維的良好答案。少數(shù)用戶（有偏見回答問題）希望看到引起他們回答問題的最新問題。因此，大多數(shù)用戶更方便地使用內(nèi)容導(dǎo)航欄（但是在內(nèi)容導(dǎo)航欄下只有問題和答案等，這與用戶期望看到答案不一致，這將在后面討論）。

PM Daily：兩個入口的端點是一樣的，路徑差別不大，但總導(dǎo)航欄中的PM日報隱藏在寶箱里，所以用戶一般都使用日報的內(nèi)容輸入導(dǎo)航欄。

我的訂閱：大多數(shù)用戶訂閱作者，以便查看作者喜歡的文章，而不是查看我喜歡的作者列表，然后查看他們發(fā)表的文章的單一視圖;所以總導(dǎo)航欄（或個人中心）“我的訂閱”是雞肋，很少被用戶使用。但是，我的訂閱位置“rdquo;置于“個人中心”更符合用戶邏輯。

一般來說，整個導(dǎo)航欄的入口位置更好，內(nèi)容導(dǎo)航欄的入口更符合用戶的需求;對于新用戶來說，這兩個入口容易混淆并降低效率，尤其是“我的訂閱”。名稱，進(jìn)入后結(jié)果不同，用戶需要適應(yīng);對于老用戶來說，兩個入口都不盡如人意，位置邏輯上是入口，操作路徑麻煩，操作符合入口要求，位置不合理。

請參閱第四點，了解如何優(yōu)化導(dǎo)航欄。

3.內(nèi)容區(qū)域布局分析

左側(cè)內(nèi)容區(qū)域有一個奇怪的地方，如下所示。在默認(rèn)類別（最新文章）的推薦內(nèi)容部分中，遍歷一段“學(xué)習(xí)主題”。

“學(xué)習(xí)主題”相當(dāng)于內(nèi)容分類導(dǎo)航中的“知識系統(tǒng)”。這是一個文章集。共有46個系列，每個系列包括5-30篇文章，其中大部分集中在13篇文章中。關(guān)于。

但是，這種設(shè)計對新用戶來說非常困惑。原因如下：

含義模糊：無論是“學(xué)習(xí)主題”還是“知識”，這兩個名稱都不足以讓用戶快速聯(lián)系“文章集”。當(dāng)用戶不確定要看什么時，用戶將選擇忽略跳過而不是主動嘗試。

分散視覺的一致性：文章之間的布局是一致的，但它與插入的學(xué)習(xí)主題布局不一致，這將使用戶感到尷尬和混亂，并在視覺上破壞用戶的瀏覽順暢。

弱化部分內(nèi)容后：當(dāng)用戶瀏覽推薦文章時突然中斷，用戶對文章的興趣和關(guān)注度將被破壞，以下文章的興趣減少，因此以下文章推薦非常差，非常無味;同時用戶可能被“學(xué)習(xí)主題”帶走并完全放棄了以下文章。

那我們?yōu)槭裁匆@樣設(shè)計呢？為了弄清楚設(shè)計師的想法，這樣的設(shè)計確實有意義。

首先，由于以下原因，“知識體系”的存在非常薄弱。 （對于新用戶）

弱勢位置：內(nèi)容分類導(dǎo)航欄，按“l(fā)dquo;最新文章”，“七天熱“rdquo;“ “熱門問答”，“知識系統(tǒng)”，“PM每日”，“我的訂閱”知識系統(tǒng)的順序排名第四，而且已經(jīng)是普通用戶不太可能的地方探索。

弱吸引力：其他類別是用戶熟悉的術(shù)語，用戶自然會不假思索地嘗試;而“知識系統(tǒng)”使用戶感到困惑并降低了他們的嘗試欲望。

弱功能：“知識系統(tǒng)”是文章的集合，“最新文章”，“7天熱”，有交叉，“最新文章”，““為期七天的熱門“兩者都處于一個更顯眼的位置。這兩個類別加上搜索功能將削弱“知識系統(tǒng)”。

然而，設(shè)計師非常重視“知識系統(tǒng)”，并希望新用戶能夠通過該主題快速理解“知識系統(tǒng)”并更有效，更系統(tǒng)地學(xué)習(xí)。為了提高“知識系統(tǒng)”的存在感，在用戶最有可能的瀏覽過程中插入“學(xué)習(xí)主題”來介紹用戶。

4.內(nèi)容區(qū)域重新設(shè)計

結(jié)合2點和3點的分析，我做了以下重新設(shè)計：

總體：

整合優(yōu)化“l(fā)dquo;最新文章”，“七天熱“rdquo;“學(xué)習(xí)系統(tǒng)”“我的訂閱”為'ldquo;文章”

帶來“最新”&“熱”"對于排序（如圈2），流行的排序算法結(jié)合發(fā)布日期;

將“學(xué)習(xí)系統(tǒng)”納入文章主題（如第3圈），總是建議至少一篇專題文章向用戶介紹該主題;

要將“我的訂閱”放在用戶標(biāo)記（例如圈4）上，請始終推薦“我訂閱的用戶”一文。

Q&A：

對該部分內(nèi)容的合理添加和刪除。

刪除答案用戶列表（… 19人參與討論）;重復(fù)了答案的數(shù)量，用戶頭像列表意義不大。

添加熱門答案，包括：答案作者，收藏夾數(shù)量，收藏夾數(shù)量，答案開頭，這對用戶更具吸引力。 （如圈1）

推送作者已回答的問題，并將訂閱作者的答案放在第一位。 （如圈2）

在本節(jié)結(jié)尾處，添加“rdquo;每天都要問“頁面輸入，雖然總導(dǎo)航欄上的入口更方便，但用戶在瀏覽推薦的問題和答案時很可能找不到感興趣的內(nèi)容，期望看到更多;然后需要在該部分的末尾進(jìn)入頁面。 （例如圈3）

知識體系

對主題進(jìn)行排序。

共有46個知識系統(tǒng)，根據(jù)實際順序列出前10個主題，如圖所示。功能頁面沒有特殊的搜索功能。也就是說，當(dāng)用戶想要找到滿足46個主題中沒有邏輯順序的要求的主題時，有必要從頭開始瀏覽或跳轉(zhuǎn)整個頁面。

因此，我認(rèn)為我們應(yīng)該根據(jù)新手的學(xué)習(xí)順序進(jìn)行粗略的排序。通過這種方式，新手可以通過排序（基本到高級）來學(xué)習(xí)，非新手也可以根據(jù)排序邏輯確定他們正在尋找的主題的大致位置。

5.輪播推薦區(qū)域分析

輪播推薦區(qū)域也有一個奇怪的（與大多數(shù)網(wǎng)站不同），如下所示。它不是將五個推薦的物品放入一個旋轉(zhuǎn)木馬，而是旋轉(zhuǎn)三個物品并分別顯示兩個物品。

這種設(shè)計有優(yōu)點和缺點：

缺點

切割板太碎，在視覺上不夠大氣，并且具有視覺上的不一致性。

利

允許用戶一目了然地看到三篇推薦文章，大大提高了推薦效果。如果您制作旋轉(zhuǎn)木馬5地圖，用戶可能會看到第三個地圖并放棄。

總結(jié)

通常，優(yōu)點大于缺點。我原本想進(jìn)行類似下圖的重新設(shè)計。我合并了右側(cè)的兩個圖像空間，并將其替換為文本版本中的熱門文章。設(shè)計發(fā)現(xiàn)空間太小，文章標(biāo)題容易斷線。而“Carousel””與“活動推薦”之間的兩張大圖片，也會造成視覺上的差異和不適。最后放棄重新設(shè)計。

總結(jié)

主頁的整體布局合理，主要體現(xiàn)在內(nèi)容的比例和分布以及推廣上。

內(nèi)容導(dǎo)航欄不合理，導(dǎo)航分類沒有邏輯，可以組合和優(yōu)化。

內(nèi)容區(qū)域插入“知識主題”布局不合理，可以刪除，并以文章源的形式反映在文章列表中。

問答清單是不合理的。刪除不太有意義的答案用戶顯示，增加常用答案，并反映“我的訂閱”。

學(xué)習(xí)主題排序可以根據(jù)新手學(xué)習(xí)的一般順序進(jìn)行優(yōu)化，以提高主題的專業(yè)性;提供邏輯，方便用戶查找定位。

旋轉(zhuǎn)木馬的推薦區(qū)域的布局具有優(yōu)點和缺點?？傮w優(yōu)勢超過了缺點，預(yù)計沒有更好的計劃。

如果有問題，請糾正我。

本文最初由@蔻三發(fā)表。未經(jīng)許可，禁止復(fù)制。

該地圖來自unsplash，基于CC0協(xié)議

« 廈門家裝公司網(wǎng)絡(luò)營銷解決方案 | 豬微信卡憑證系統(tǒng)是新的。代理商設(shè)置完全個性化 »