互聯網最令人著迷的地方在于它會不斷地進化，每年都會不斷涌現新的工具和技術替換過時者，用新的解決方案來搞定各種問題。
單頁設計在前幾年就已經出現，并且愈演愈烈直到今年成為當仁不讓的網頁設計大趨勢。它已經站在流行最前線，今天我們來聊一聊為什么它會這么火。
什么是單頁式網站設計？
界定一個網站是否是單頁設計很簡單，顧名思義，單頁設計就是一個網站僅需一個URL，進入之后只需要縱向或者橫向滾動就可以瀏覽信息而無需點擊。看看下面這個例子：
這是一個非標準的單頁設計，網頁中使用熱氣球元素來引導用戶進行瀏覽。
選擇單頁設計的原因很多，但是其中有五個主要的優勢值得設計師為之側目。
一個單頁網站的頁面空間是有限的，所以其中的內容需要足夠有條理，將最希望用戶看到的內容呈現在他們面前。單頁式設計對于頁面長度并無限制，即使需要呈現的內容很多，也不要急吼吼地將圖文堆砌在一起，合理運用留白可以帶來非常不錯的視覺效果。
在有限的頁面空間中呈現內容是需要講究技巧的，字體、圖像、排版、列表、信息圖等元素的合理使用，都值得仔細推敲。
當你打算將一個傳統網站重新設計成為一個單頁網站的時候，情形就變得非常有意思了，因為這意味著你多年以來為這個傳統網站所添加的內容，在這個時候都需要進行精簡整合了，把亂七八糟一塌糊涂的信息收拾得井井有條。這個過程就像是從郊區2層小樓搬到市區兩居室一樣，不斷去蕪存菁。
重新組織整理網站的另外一個理由，是用戶喜歡簡約整潔的頁面。通常，用戶為了找到他們需要的產品、服務或者信息，需要翻閱海量的頁面，瀏覽各種各有的文章和列表。問題在于，用戶沒法仔細閱讀每一個字，不停的掃視文章尋找關鍵詞，最終找到的可能就是一句話、一個鏈接或者一張圖片。這就是為什么單頁網站流行的原因：用戶不用在頁面、Tab和長篇大論的文章之間來回切換了，鼠標滾輪一擼到底，就可以清晰地瀏覽核心內容和重點信息，找到想要的信息。
即使你真的有大量的信息，大把的圖片，以及無數“不得不”置于網頁上的內容，你也有必要用心嘗試一下設計成單頁網站。為什么不呢？很多時候你至少要嘗試一下那些讓你感到害怕恐懼或者“看起來不可行”的方案，成功了可以收獲經驗，失敗了也提升了技巧，不是么？看看下面兩個案例：
這個單頁網站使用了視差滾動式的設計，網頁向下滾動的過程中使用了很多典型的視差滾動網頁的圖片設計技巧。
這個牙醫網站使用了綠色的色調，手繪的效果也拿捏的不錯，垂直滾動的過程中伴隨著動畫效果。和許多同類網站一樣，滾動到底部就是分享按鈕了。
不論如何單頁設計是大勢所趨。潮流和趨勢來來去去是沒錯，但是誰原因蹲在陰影里坐視潮流和趨勢從眼前溜走呢？喜歡就是放肆，愛就是克制。在你深愛上某種潮流之前，先放肆地試試吧。在單頁設計最流行的今年，不要錯過。
有些事情并不難，不是么？你所得到的不僅僅是一個時尚的單頁網站，簡單愉悅的用戶體驗也是你的用戶的訴求，只需要滾動就可以完整瀏覽的單頁不會令人失望的。
看看這個網頁設計的案例吧，當時尚和鮮活的色彩與視差滾動相遇在單頁網站的時候，感覺就是這么美妙。
與用戶進行溝通，最有效的方法之一就是講故事。比起千奇百怪的頁面優化，一個清晰明了恰如其分的故事來的更靠譜。如果你也喜歡用網站講述故事，這篇《網頁設計新思路！用故事來吸引用戶》千萬不要錯過，戳下圖跳轉~
對于講故事最常見的誤解就是它必須以一段文字、一組圖片或者一個視頻的形式而存在，與設計無關。但事實并非如此。單頁式的網頁設計本身就是一個承載一系列內容的絕佳載體，流動性的頁面與連貫性的內容在邏輯上完全相合。接下來，我們看看單頁式網頁設計所涉及到的一些網頁元素：
The Art of Texture Movie Website
這個網站充分使用了視頻、圖片和滾動效果來呈現故事。
導航是網頁瀏覽的基石。不論是商業項目網站還是作品集展示頁面，導航欄都是最重要的組成部分。復雜的導航欄不僅需要耗費大量的時間來進行設計，也會讓用戶敬而遠之。這也是為什么單頁設計會逐漸流行甚至占據主流。
單頁網站讓信息呈現更加扁平，最大化地降低了獲取信息的難度。鼠標滾動，信息就全部展現在用戶面前，還有什么方式比這個更加簡單？
如果你是一個極富創意的設計師，或許可以輕松駕馭橫向式的單頁網站設計，甚至其他的非標準式滾動瀏覽方式——比如頁面滾動方向一會兒向左一會兒向下——總而言之，單頁網站設計的創意空間無限大。
這個網站設計得賞心悅目，用戶可以直接滾動，也可以使用點擊來控制瀏覽的節奏。內容被安置在一個頁面上，但是分組呈現的方式，降低了持續瀏覽帶來的疲憊。
從某種程度上適應移動設備和講故事的核心非常接近，導航才是重點。
響應式設計的優勢相比你已經耳朵聽出繭子了，而我想說的是，單頁式網站的設計本就是響應式設計概念的一部分。諸如鼠標懸停下拉框這樣的導航欄設計，在普通網站中很常見，但是要進行響應式設計中，在移動端中正常使用并不方便，如果在移動端網頁中將其舍棄又不太合適。所以，要想在多屏幕多設備上保持體驗的一致，單頁式設計的很多思路反而比傳統的網站更有優勢，那些簡單直觀的導航更容易遷移到移動端頁面上，令體驗一致，取悅用戶。
是否應該將多頁面的網站重新設計成單頁網站？
假使你已經擁有一個現成的網站，它是一個典型的多頁面式的網站，你需要為之重新設計，有幾個選項可供選擇，一保留現有結構和框架，在網站的設計風格和細節上做文章，另外一種方案是放棄現有的結構和內容，重新設計成單頁式網站。這兩種選擇要如何取舍，主要取決于網站本身的結構、內容和發展方向。如果網站的結構和內容并沒有想象中那么重要的話，那么你是時候考慮是否跟隨設計趨勢，設計屬于自己的單頁網站了。
接下來我們看看案例吧~
2014年，值得你細嚼慢咽的網頁設計趨勢！
先來一碗當紅炸子雞Material Design！
《超全面總結！深聊MATERIAL DESIGN引領的設計趨勢》再干了這杯口感香醇的響應式設計！
《干貨！設計師必讀的15個響應式網頁設計教程》酒足飯飽在來一盤棒棒噠“幽靈按鈕”！
《網頁設計新趨勢！你聽說過“幽靈按鈕”嗎？》
原文地址：instantshift
優設網翻譯：@陳子木
本文由優設網原創翻譯，請尊重版權和譯者成果，轉摘請附上優設鏈接，違者必究。謝謝各位編輯同仁配合。
【優設網 原創文章 投稿郵箱：2650232288@qq.com】
================關于優設網================
“優設網uisdc.com“是一個分享網頁設計、無線端設計以及PS教程的干貨網站。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量76萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的”福利”嗎？
添加 優秀網頁設計 微信號：【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加：
非特殊說明，本文版權歸原作者所有，轉載請注明出處
本文地址：http://www.uisdc.com/single-page-websites-design
