個人都喜歡單頁網(wǎng)站。

設計趨勢一定是發(fā)生了某些變化。這種現(xiàn)象已經(jīng)持續(xù)了好一段時間，但是依然在增長，并且有太多的網(wǎng)站傾向于采用這種設計。

請參閱：Creative Single Page Website Designs, Examples

很久以前，擁有一個單頁網(wǎng)站并不是什么值得驕傲的事情。那樣的網(wǎng)站只是單純的用來提供信息，“名片”式的網(wǎng)站被認為既廉價又讓人厭煩。

但是現(xiàn)在，作為一項設計趨勢，單頁已經(jīng)完全不同了。它剔除設計中雜亂無章的部分，留下一個整潔，但是優(yōu)美的用戶界面，其中的內容既簡潔，又重點明確。從用戶體驗（UX）的角度來說，單頁設計既有好的一面，也有壞的一面，但是通常用戶鐘愛于瀏覽這些網(wǎng)站，這就已經(jīng)是要思考的事情了。

[[120152]]

盡管幾乎沒有證據(jù)，一些專家還是辯稱相比傳統(tǒng)的多頁面導航網(wǎng)站，單頁網(wǎng)站傾向于擁有更高的轉化率。我唯一能找到的研究案例就是37signals。它表明相比原先的多頁面版本，一個長的單頁面著陸頁會多出37.5%的注冊量。

好吧，這并不令人震驚。

• 單頁導航更加直觀；瀏覽者不會迷失在網(wǎng)站中，一切僅僅需要轉動幾下滾輪就可以達到。

• 頁面更加專注和整潔，可以更容易的傳遞網(wǎng)站的主要信息。

• 單頁網(wǎng)站幾乎可以在任何設備上流暢的運行，因為導航主要通過滾輪或是滑動實現(xiàn)，而不是點擊鼠標或是敲擊屏幕。

單頁設計的***挑戰(zhàn)是如何讓用戶不斷的滾動屏幕。高分辨率的圖片，大膽夸張的顏色，優(yōu)美的樣式都可以吸引注意力，但這些并不是總能夠激發(fā)用戶的興趣。通過一些用戶數(shù)據(jù)分析和 A/B 測試，你能夠找到方法來抓住用戶的心。讓我們來探討一些小竅門，讓你的單頁網(wǎng)站對用戶更加友好。

1. 將內容分成一些小塊

當你只有一頁來講故事，很重要的一點是不要給用戶灌輸太多的信息。不要害怕把內容折疊起來變成多個部分。確保消息和媒體內容自始至終保持干凈簡潔。更重要的是，單頁網(wǎng)站的內容應該是連續(xù)的，并且要順序排列（事情—>原因—>怎么做—>地點—>時間）。有一些優(yōu)秀的例子采用了這樣一個平滑和有意義的內容流，包括Mijilo的designawatch.mijlo.com和agencysurvivalkits.com。

[[120153]] 

吸引客戶關注點的另外一種方式是視覺和文字內容雙管齊下，進行故事化的設計.故事化設計 Storytelling 是一種傳遞內容的非常強大的方式，而它實際上是屬于另外一個領域的發(fā)展潮流，而這一次則進入了內容市場. Storytelling 的活力深入到了核心信息，擁有同用戶更加強烈的互動性. 這并不意味著你必須去雇傭一個小說編輯. 你只要更多的專注于內容的情感方面，并嘗試讓你所寫的東西更加的人性化.

2. 為快速訪問設計備選的導航
 

單頁面網(wǎng)站整個就是一張可以往下滾動的頁面，有時候甚至可以無限滾動. 這就好像是一個不知道到底有多長的內容的海洋. 你要確保用戶在這樣的頁面中體驗舒適，并且其體驗總是可以被追蹤控制的; 你可以嘗試將它同一個傳統(tǒng)的導航系統(tǒng)整合在一起. 通用的實踐方式就是讓它有一個有粘性的導航條，而無論你將頁面滾動到哪里，這個滾動條都能待在頁面的頂部. 這樣易用性的方面也得到了很好的解決. 粘性的導航可以用一種更加醒目和更具交互性的方式替代更傳統(tǒng)的面包屑導航.

如果你的單頁面應用相當?shù)拈L，讓頁面有一個“回到頂部”的按鈕，或者一個垂直的滾動條就會很有用，它們能讓用戶快速的訪問頁面的頂部和其它地方.

3. 在動作上使用強烈的號召性語言

如果你問一個數(shù)字產(chǎn)品業(yè)務員，再一次會談中什么才是最重要的因素，他的答案幾乎總會是使用強烈的號召性語言. 精心制作的CTA就算不代表完成了整個工作，也至少是一大半. 我敢說那些為特定目的設計的網(wǎng)站，它們的情況確實是這樣的, 不管它是移動應用的下載，訂單的放置，demo演示還是簡單的聯(lián)系信息表單的提交. 除了本身的目的之外，對于用戶動作號召的質量決定了轉換的機會.

依據(jù)對某人的  KISSMetrics 案例研究, “ 用更醒目的動作號召可以讓轉換的機會增加百分之591.”

好消息是單頁面應用網(wǎng)站變得更加專注和清晰，并可以在精致的CTA方面做得更好. 在一個單頁面應用中，少有文本和多媒體內容能讓用戶在其訪問的網(wǎng)站的主要目標上分心. 同樣的，擁有好的storytelling，你可以在網(wǎng)站上引導用戶直到***終點, 在那里你就應該有一個對動作的強烈號召用語.

這里要再做一次A/B測試，來看看哪一種CTA能在你的網(wǎng)站上運作得更好, 因為有時即使是顏色、位置或者用語上的一點最小改變，都會帶來轉換率的急劇變化.

4. 保持簡單而不乏味
 

傳統(tǒng)的多頁面網(wǎng)站的設計中，設計的主題，還有幾個起作用的內部頁面模板是相當關鍵的. 設計單頁面應用更具挑戰(zhàn)性，但同時也給與了創(chuàng)造性更大的空間. 隨著近年來 CSS3, HTML5 和 Javascript 的發(fā)展，創(chuàng)造一個簡單但卻能引人入勝的網(wǎng)站這一挑戰(zhàn)具有無限多的可能. 加入小動畫以及漂亮靈動的過渡僅僅只是細節(jié)，但卻是有關細節(jié)的一個好的UX（用戶體驗）?

只是，請你不要在CSS的魅力上太得意忘形，也不要在整個頁面上把那些跳躍，浮動，以及翻翻覆覆的元素用得太過了，請適可而止.

[[120154]] 

5. 讓頁面變輕
 

單頁面網(wǎng)站***的一個缺點就是加載慢. 因為只有一個用戶在傳遞內容，網(wǎng)站常常變得更重，需要更多的時間去加載. 按照前面說的觀點，請不要往網(wǎng)站里塞入不必要的動畫和其它會顯著影響加載時間的設計元素. 節(jié)約用戶的時間應該在你那里應該有***的優(yōu)先級. 拖慢加載可能也會影響你網(wǎng)站的SEO，這顯然是單頁面網(wǎng)站的短板. 你的網(wǎng)站需要更多關注和努力，以使它獲得用戶的認同，當然還有Google爬蟲的認同.

總結

單頁面設計是一種吸引用戶并把他們轉換成商機的***大方式. 但這嚴重依賴于站點的業(yè)務類型及其目標。一般，單頁面設計最適合單一活動的網(wǎng)站，比如應用下載，單一產(chǎn)品的采購，捐贈等等. 但請不要受***實踐的限制，因為那些總是別人的經(jīng)驗，可能并不適合與你.

英文原文：5 Best Practices for Single-Page UX Design

譯文出自：http://www.oschina.net/translate/ux-single-page-websites