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