網站設計:單頁還是多頁好?別爭了,看這里
當你的設計是為了追隨時尚潮流,而不是為了滿足用戶的目標為目的,那你的設計就出現問題了。接下來,我們分析下單頁面和多頁面網頁的UI設計,以便于做出更好的設計選擇。
現在,網頁設計整體趨向于單頁網站設計。這種趨勢是由于對追求簡單和速度的推動。簡單的單頁網站也是一種很好的響應式設計,并且可以適應所有設備。當然,也有很多情況下需要用到多頁設計。比如,快餐網站Chipotle為了便于快速瀏覽菜單,使用的就是多頁面設計。
但面對很多相關的利益,很容易落入添加額外的素材或者忽略必要的內容這樣的糾結中。
所以,這個很難決策是使用單頁還是多頁設計網站。
一些小提示
大型的網頁設計由于有子網站以及經常變化的內容變得很復雜。當然,單頁設計的網站也會遇到類似的問題,因為你必須消化掉復雜的內容,展示給用戶簡潔的內容并且不讓用戶感到困惑。
在設計用戶體驗時,請考慮適用于任何網站的以下基本要求:
- 你是要提供給多少個用戶?(信息,產品,或者場景)
- 在網站的層級結構上哪個是最重要的元素?
- 如何才能讓用戶盡可能簡單的使用你的網站?
- 如何讓用戶更愉悅的使用你的網站?
單頁網站
單頁網站設計有助于讓用戶保持在一個舒適的網絡環境中。
如果所有的內容都只適應一個頁面,還要怎樣添加內容?有時候甚至很少的內容需要跳轉幾個頁面。一個優秀的UX或UI設計師需要了解設計的網頁所需要的正確尺寸。在這里會了解到但也網站的優勢或劣勢。
優勢
單頁網站最直接的好處是以簡單,容易和可操作的方式展示給用戶。
單頁站點可以讓用戶沉浸在簡單的線性體驗。整個頁面有簡單的頭部,中部,尾部。事實上,單頁網站的滾動特性使得它們非常適合于習慣了該手勢的移動用戶。
有些專家認為,與較大的多頁網站相比,單頁網站的轉化率更高。
當然,單頁導航對于服務于單一目的的網站來說比大型的復雜網站更直接些。如果你的目標是講故事,那么單頁網站也是視覺敘事的最好選擇。
單頁網站的好處是:簡單的滾動比點擊無限鏈接可以更容易和更連續的操作。如果用戶開始滾動,那么您可能發現它們更可能繼續滾動,而不是停下來點擊擊鏈接。
劣勢
單頁網站最大的劣勢就是陷入把過多的內容放置在一個頁面里。因為一個頁面不可能容納所有的一切。而是需要有視覺層次和大量的規范制約。
隨著內容類別的增加(例如博客,新聞,服務,產品),單頁網站的可用性越高。從技術的角度來看,單頁網站的搜索優化比多頁網站少。當一個頁面上的內容和圖像很多時,他們會加載很慢。
對搜索的內容查詢。雖然單頁網站可能會提高您的主要關鍵字的相關性,但更有可能會稀釋其在自己的網頁上排名更高或次之的子主題和字詞的相關性。
多頁網站
多頁網站通常由擁有廣泛產品或服務的大公司所有。 他們的用戶也可能是相當多樣化。
這些網站的要點是:
- 需要盡可能大容量;
- 由于內容的數量,他們需要層次分明;
- 很多時候,它們由許多微型網站和子部分組成,以分解信息和內容,并提供多個入口點;
- 它們提供對多個頁面和改變內容的SEO的更好控制。
優勢
多頁網站對于需要傳統導航的用戶來說很有意義。他們需要給用戶提供更多的信息。
例如,對于電子商務網站,用戶不想花費一個頁面了解您公司的故事或員工。而是想要找到想要的產品,付費然后使用。在這種情況下,到不同頁面的導航欄就會非常有效。
事實上,混合的單頁網站(如上面的Hell’o Baby)出現給設計師提供了一個很好的方向。單頁結構可以優化轉換。另一方面,頂部導航可以給用戶更多的操控比純滾動體驗更好。
劣勢
如果設計的網站越復雜,傳統導航就越難展示和查找。
有些人認為,導航可以舒適地適應前三個級別。
- 導航必須擴展,最終占用更多的屏幕空間
- 信息架構中的更深的頁面不再會出現在導航中。 如果用戶在網站內部深處,他們將丟失他們的位置的上下文,因為他們沒有看到當前頁面有合適的導航在網站中。
隨著網站的擴展,我們需要考慮所有不同切入點產生的問題。如果網站有多個入口點,則必須使用戶能夠很容易的通過導航回到主頁或其他感興趣的頁面
總結
- 采取內容優先的方法。 找出用戶關心的內容,然后相應地設計您的界面。
- 確保你的網站適合純粹的單頁體驗。 如果你不能把所有內容簡潔的放入一個頁面,請考慮混合網站。 如果需要用戶知道多個類別,請使用多頁網站。
- 不要忽視SEO, 可以用單頁網站建立搜索引擎優化。
- 用戶不總是喜歡閱讀, 這就是為什么信息圖表和視頻是新用戶體驗的一部分。 任何大小的網站都需要使用戶可以快速瀏覽。
- 把事情簡單化, 設計的一致性實際上對用戶來說操作更簡單。
- 網站的清晰度很重要。
原文作者:Speider Schneider
原文地址:https://www.uxpin.com/studio/blog/single-page-vs-multi-page-ui-design-pros-cons/
譯者:小船,微信公眾號【漁夫和Ta的靈魂】
本文由 @小船 翻譯發布于人人都是產品經理。未經許可,禁止轉載。
http://hell-o-baby.com/ 但是打不開