B端產(chǎn)品一級導(dǎo)航為什么大多在左側(cè)

1、實驗發(fā)現(xiàn)左導(dǎo)航操作效率高JR Kingsburg 曾經(jīng)做過一次實驗（A comparison of three-level menu navigation structures for web design）。他把一個三層導(dǎo)航電商使用 8 種不同的左導(dǎo)航和頂導(dǎo)航布局，分別給 8 組用戶使用，發(fā)現(xiàn)一級導(dǎo)航在左側(cè)時，效率高、遲疑和錯誤更少，用戶也普遍比較喜歡。但這次調(diào)研的 B 端產(chǎn)品都是使用的 Web 端，而做過 Web 端的設(shè)計師肯定知道，頂導(dǎo)航是最常見的網(wǎng)站布局方式。隨便打開幾個網(wǎng)站，幾乎是清一色的頂導(dǎo)航：百度知乎京東那么為什么 C 端網(wǎng)站大多用頂導(dǎo)航，B 端產(chǎn)品卻大多用左導(dǎo)航呢？其實準(zhǔn)確來說

2、，應(yīng)該這么理解：信息型產(chǎn)品適合頂導(dǎo)航功能型產(chǎn)品適合左導(dǎo)航把產(chǎn)品分成信息型和工具型兩大類，它們在范圍層、結(jié)構(gòu)層和框架層的體驗要素都不相同，可見是有不小的差異。用戶體驗要素信息型產(chǎn)品導(dǎo)航偏簡單用戶使用信息型產(chǎn)品時，大量時間都花費(fèi)在閱讀和搜索上，使用的功能反而比較少。所以信息型產(chǎn)品容易走簡潔風(fēng)格，因為只需要展示出少數(shù)基本功能，就能滿足多數(shù)用戶使用。即便提供高級功能，也可以隱藏起來，反正使用的人不多。例如百度導(dǎo)航的更多里，就折疊了不少小眾功能，這些東西擺出來只會讓絕大部分普通用戶覺得礙眼。百度既然導(dǎo)航里放的內(nèi)容少，放在頂部是最合適的，主要占用空間少。以前的電腦屏幕小，又尺寸不統(tǒng)一，通常都定一個 960

3、px 之類較窄的固定寬度。這么窄的頁面，要是再往左側(cè)加一條導(dǎo)航，頁面就更擁擠了。而網(wǎng)站早期大多都是信息型的，例如2000 年左右的門戶網(wǎng)站、新聞網(wǎng)站2003 年的Hao123所以頂導(dǎo)航自然而然就成了網(wǎng)站設(shè)計的經(jīng)典布局直到后來出現(xiàn)越來越多的功能型網(wǎng)站。功能型產(chǎn)品導(dǎo)航偏復(fù)雜所謂功能型產(chǎn)品，大多都是當(dāng)工具用的，B 端產(chǎn)品就是如此。C 端也有功能型的產(chǎn)品，例如在線文檔，雖然一級導(dǎo)航也在頂部，但是通常都有一個很重要的左導(dǎo)航。語雀功能型的產(chǎn)品的用戶，追求的是使用產(chǎn)品完成目標(biāo)任務(wù)，注重的是功能完整性和操作便捷性。功能型的產(chǎn)品需要把很多功能擺出來，不能像信息型產(chǎn)品那樣只展示少量功能，否則大部分用戶都會覺得不方

4、便。所以，功能型產(chǎn)品很難走簡潔風(fēng)格，需要一個足夠大的導(dǎo)航容納各種豐富功能。電腦屏幕本身就比較寬，瀏覽器本身已經(jīng)占了頂部一行，如果產(chǎn)品再把導(dǎo)航放在頂部，會讓頁面的縱向空間十分有限。如果把導(dǎo)航放在左側(cè)，容納的信息更多，面積大一些也不會覺得特別擁擠。如果內(nèi)容還是放不下，左導(dǎo)航還可以加縱向滾動，而頂導(dǎo)航加橫向滾動就沒那么方便了。綜上所述，對于功能型產(chǎn)品來說，使用左導(dǎo)航真是再合適不過了。但是，功能型產(chǎn)品即便需要左導(dǎo)航，也沒必要用作一級導(dǎo)航吧？可以一級導(dǎo)航用頂導(dǎo)航，二級導(dǎo)航再用左導(dǎo)航。但是文章開頭說過了，調(diào)研發(fā)現(xiàn) 11 款 B 端產(chǎn)品中 8 款使用使用一級左導(dǎo)航，只有 2 款使用二級左導(dǎo)航，那么為什么B 端產(chǎn)品大多用一級左導(dǎo)航呢？C 端功能型產(chǎn)品確實很多使用一級頂導(dǎo)航+二級左導(dǎo)航的布局：騰訊收集表其實最理想的情況，是頁面上只存在一種類型的導(dǎo)航，如果頂導(dǎo)航和左導(dǎo)航同時存在，不論是理解成本還是操作成本，都要增加的。C 端功能型產(chǎn)品，尤其是免費(fèi)那種的，功能相對簡單，很多場景只需要頂導(dǎo)航就夠了，所以才會盡可能地使用看起來輕量一點的頂導(dǎo)航。但是 B 端功能型產(chǎn)品通常比 C 端功能型產(chǎn)品要復(fù)雜得多