對于許多網(wǎng)頁(yè)設計師而言,是選擇單頁(yè)面還是多頁(yè)面的設計,可能會(huì )非常的棘手。隨著(zhù)移動(dòng)端和社交媒體的興起,簡(jiǎn)單快速響應迅速的單頁(yè)網(wǎng)站,成為了目前網(wǎng)頁(yè)設計的趨勢。另一方面,傳統的多頁(yè)設計也因其廣泛的認知,而被廣大用戶(hù)所認可。
所以,真正要在兩者之間做取舍,并不容易。單頁(yè)和多頁(yè)式的設計哪個(gè)更好,影響因素很多。網(wǎng)站的內容如何鋪排,導航如何運作,整體的策略和需求,出發(fā)點(diǎn),都會(huì )影響到選擇的決策。不過(guò),內容始終是最核心的影響因素,從內容入手,分析哪種導航,哪種布局更合適,是一種合理的策略。
當然,具體怎么做,看下去,這篇文章會(huì )給你答案。
一、單頁(yè)網(wǎng)站
單頁(yè)網(wǎng)站,顧名思義,指的是網(wǎng)站本身并沒(méi)有采用多頁(yè)式的布局,而是將內容都放置在單個(gè)頁(yè)面上,諸如我們常見(jiàn)的「關(guān)于」「聯(lián)系我們」等分頁(yè)都是不存在單獨分頁(yè)的。
正如 Awwwards 所解釋的那樣,單頁(yè)式網(wǎng)站將內容完全整合在一頁(yè)當中,使得整個(gè)體驗更加流暢。用戶(hù)借助單頁(yè)內的導航同樣可以快速定位,滾動(dòng)瀏覽也很容易。
單頁(yè)網(wǎng)站在為用戶(hù)提供內容的時(shí)候,其信息和內容都是經(jīng)過(guò)篩選和管控的,確保更適宜閱讀和瀏覽。這也是為什么絕大多數的產(chǎn)品頁(yè)面、作品集和事件相關(guān)的頁(yè)面會(huì )采用單頁(yè)設計。在這樣的情況下使用單頁(yè)設計能夠最大程度降低信息噪音的影響,讓用戶(hù)專(zhuān)注于最重要的內容。
1. 單頁(yè)網(wǎng)站設計的優(yōu)點(diǎn)
為什么那么多人會(huì )選擇單頁(yè)設計呢?的確,單頁(yè)網(wǎng)站更容易理解,拆分出來(lái)的區塊也不算多,用戶(hù)也很容易消化。
單頁(yè)設計更容易直觀(guān)地呈現整個(gè)用戶(hù)歷程。不需要額外的頁(yè)面加持,訪(fǎng)客可以直觀(guān)而清晰地感知到整個(gè)信息流,如果呈現故事的話(huà),起承轉合是非常的順暢的呈現。
單頁(yè)設計的另外一個(gè)優(yōu)點(diǎn),是交互足夠簡(jiǎn)單。研究表面,單頁(yè)網(wǎng)站比多頁(yè)網(wǎng)站的轉化率要高37.5%,用戶(hù)可以更快地瀏覽,更快地獲取信息,不會(huì )因為頁(yè)面和復雜的交互而分心。
單頁(yè)式網(wǎng)站在移動(dòng)端上的優(yōu)勢也更加明顯。在小屏幕匹配上更加精簡(jiǎn)直觀(guān)的內容,加上簡(jiǎn)單而自然的滾動(dòng)交互,用戶(hù)體驗可謂是輕松而舒適。
但是,這還不是全部。設計師從中同樣獲得不少好處:再也不用增加來(lái)回跳轉的鏈接和頁(yè)面了,工作量沒(méi)那么大,頁(yè)面功能也更容易實(shí)現,也便于迭代和維護。
2. 單頁(yè)網(wǎng)站設計的缺點(diǎn)
單頁(yè)網(wǎng)站的缺點(diǎn)和優(yōu)點(diǎn)同樣突出。單頁(yè)網(wǎng)站的缺陷主要體現在幾個(gè)不同的方面。
單頁(yè)網(wǎng)站在 SEO 上的優(yōu)勢并不大。事實(shí)上,在網(wǎng)站排名這個(gè)事情上,單頁(yè)網(wǎng)站先天就競爭力不足,這也導致借由搜索引擎進(jìn)入網(wǎng)站的打開(kāi)率相對較低。由于內容較少,目標關(guān)鍵詞在單頁(yè)網(wǎng)站上常常會(huì )被忽略掉。
另外,單頁(yè)網(wǎng)站也不是成長(cháng)型品牌在設計網(wǎng)站時(shí)候的首選,因為它的擴展性是比較有限的。正如同我們所看到的那樣,單頁(yè)網(wǎng)站的關(guān)注度相對較低,不適合大量?jì)热莸摹⑿畔⒔Y構復雜的網(wǎng)站來(lái)使用。因此,如果你正在運營(yíng)一個(gè)不大的網(wǎng)站,但是有計劃進(jìn)行多方面拓展的話(huà),盡量選擇多頁(yè)網(wǎng)站設計。
最后,網(wǎng)站本身通常只會(huì )有一個(gè) URL地址。這本身并不存在問(wèn)題,可是當你需要借助諸如 Google Analytics 來(lái)分析網(wǎng)站數據的時(shí)候,內容并不是通過(guò)鏈接來(lái)區分的,這使得你所獲得分析數據是非常有限的。
二、多頁(yè)網(wǎng)站
多頁(yè)網(wǎng)站包含有多個(gè)子頁(yè)面。與單頁(yè)網(wǎng)站不同,多頁(yè)網(wǎng)站的設計中需要借助導航來(lái)承載不同頁(yè)面的鏈接。
多頁(yè)網(wǎng)站幾乎能夠承載所有類(lèi)型的網(wǎng)站項目,諸如 Amazon 這樣的電商網(wǎng)站,諸如 Atlassian 這樣的儀表盤(pán)式的網(wǎng)站,也可以滿(mǎn)足 Lynda 這樣的在線(xiàn)學(xué)習網(wǎng)站的需求。
1. 多頁(yè)網(wǎng)站設計的優(yōu)點(diǎn)
和單頁(yè)網(wǎng)站相比,多頁(yè)面的網(wǎng)站的優(yōu)點(diǎn)主要體現在三個(gè)方面:
首先,多頁(yè)面網(wǎng)站有著(zhù)明顯更強的拓展性。根據需求創(chuàng )建幾乎任意數量的子頁(yè)面,設計師能夠通過(guò)整合來(lái)創(chuàng )造出可用的導航系統。諸如電商網(wǎng)站,會(huì )采用一個(gè)大型的自定義導航菜單,搭配上搜索框,用戶(hù)可以借此抵達幾乎每一個(gè)頁(yè)面和產(chǎn)品。當然,值得注意的是,導航的設計應該取決于網(wǎng)站的縱深,這個(gè)需要設計師仔細衡量和把控。
其次,多頁(yè)面網(wǎng)站的導航流程,更容易遵循。多頁(yè)面的網(wǎng)站設計早在90年代就已經(jīng)形成了,用戶(hù)對于這類(lèi)網(wǎng)站的使用方式早已熟悉,它們的使用已經(jīng)成為一種約定俗成的模式,遵循即可。
最后,多頁(yè)面的站點(diǎn)在 SEO 上有著(zhù)更多的功能和突出的優(yōu)勢。我們都能確定,多頁(yè)面的網(wǎng)站比單頁(yè)網(wǎng)站更容易承載更多的內容,在搜索引擎優(yōu)化上也有更多的潛能可供挖掘,可以承載更加多樣的營(yíng)銷(xiāo)策略。
2. 多頁(yè)網(wǎng)站設計的缺陷
事物總是具有兩面性的。多頁(yè)網(wǎng)站的缺點(diǎn)也是不能回避的問(wèn)題。
多頁(yè)面網(wǎng)站需要更加頻繁、工作量更大的維護,這無(wú)論是對于設計團隊、開(kāi)發(fā)團隊還是內容團隊而言,都是頗為繁重的工作。在選擇單頁(yè)面還是多頁(yè)面的網(wǎng)站的時(shí)候,需要考慮內容的體量和工作量,作出合理的衡量。正如同 Undsgn 所說(shuō):「更新和維護單個(gè)頁(yè)面比處理多個(gè)頁(yè)面要容易得多,基本的數學(xué)規律你是違反不了的!」尤其重要的是,追求數量而輕視質(zhì)量對于企業(yè)而言是極為不利的。
另外一個(gè)需要注意的問(wèn)題就是網(wǎng)的跳出率。根據《Search Engine Journal》的統計,擁有大量?jì)热莸木W(wǎng)站相對而言加載速度會(huì )更慢,用戶(hù)注意力更容易被分散,這會(huì )導致網(wǎng)站的跳出率提升。雖然并非每個(gè)多頁(yè)面網(wǎng)站都會(huì )被內容所拖累,但是內容和信息量的增加是必然會(huì )帶來(lái)注意力的分散,這個(gè)是需要注意的。
最后,多頁(yè)面網(wǎng)站設計在移動(dòng)端上,也沒(méi)有單頁(yè)設計那么友好。和單頁(yè)不同,多頁(yè)面網(wǎng)站即使是通過(guò)響應式設計在移動(dòng)端上呈現,在交互和界面上所耗費的時(shí)間也是更長(cháng)的,所達到的效果卻不一定理想。你會(huì )為了移動(dòng)端上的一致性,而犧牲桌面端上的一些設計么?
三、最佳解決方案
其實(shí)今天的文章,我們的目標是通過(guò)闡述單頁(yè)設計和多頁(yè)面設計之間的差異,讓你能夠在設計上作出更好的決策。簡(jiǎn)單總結一下:當你的網(wǎng)站功能比較集中,關(guān)注度也較低的時(shí)候,單頁(yè)設計會(huì )非常有用,它也是移動(dòng)端網(wǎng)頁(yè)的首選方案。如果你需要復雜的、多功能、可拓展式的網(wǎng)站,那么還是采用傳統的多頁(yè)式設計,結合合理的導航設計,并且加入可靠的 SEO策略。
選擇單頁(yè)還是多頁(yè),很多時(shí)候需要靈活應變,因地制宜,內容始終是網(wǎng)站的靈魂,多考慮用戶(hù)打開(kāi)網(wǎng)站時(shí)候的使用場(chǎng)景,也許整個(gè)局面就很明朗了。
蘇公網(wǎng)安備 32021402000219號