1. 程式人生 > >“世界那麽大,我想去看看” ——10款精美的旅遊網站設計欣賞

“世界那麽大,我想去看看” ——10款精美的旅遊網站設計欣賞

不知大家是否還記得那個最具情懷的辭職信“世界那麽大,我想去看看”。我想我們現在都還沒有這個勇氣辭職,背起行囊來一場說走就走的旅行。


說起旅行,就想起去年在某著名旅行網站上的體驗。網站的設計巧妙,特別是圖片有特色也很精美,當時去的是三亞,看了這些圖片和介紹後毫不猶豫的就去了。為了更多的訂單量,網站設計也會想盡一切辦法來“留住”用戶。在我看來,旅遊網站的設計的圖片選擇是更能打動用戶,當然用戶體驗不能太糟。以下總結的9個旅行網站的設計tips,大家可以參考:


  • 用戶需要一目了然的重點
  • 用合適精美的大圖作為背景
  • 完整詳細的酒店信息
  • 切換圖片時減少誤點可能
  • 特別信息應該特別標註
  • 圖文並茂的生動點評頁
  • 手機端友好
  • 減少輸入框和必填項
  • 真實性


接下來介紹的這10個優質的旅遊網站設計例子都是基於以上的設計原則選取的,讓人看了就想背起背包來一場說走就走的旅行。


1. Airbnb


Airbnb是一個旅行房屋租賃社區,用戶可通過網絡或手機應用程序發布、搜索度假房屋租賃信息並完成在線預定程序。你可以在倫敦、巴黎、日本、羅馬等國家享受當地的美食和文化。據官網顯示

,其社區平臺在191個國家、65,000個城市為旅行者們提供數以百萬計的獨特入住選擇,不管是公寓、別墅、城堡還是樹屋。Airbnb被時代周刊稱為“住房中的EBay”。

UI 設計:網站的整體風格主要是以陳列圖片為主,圖片不但有當地的特色文化,還有各個民宿的內部布景設計展示,各類旅遊項目和美食盡收眼底。

用戶體驗設計:網站的預訂信息完整詳細、提供的服務清楚明了、CTA放置明顯、每個項目後面還有用戶評價增加了整個網站的真實性。

1.Airbnb.png


2. Another escape


這個網站和普通的旅遊網站不同的是,她出售以戶外生活方式,創意文化等出版刊物來探索不同的人、事、物。給人們提供不同的生活方式和靈感。

UI設計:整個網站的設計都是以戶外生活為主,一張大的山脈背景圖讓人流連忘返,向下滾動還能看到更多的戶外冒險為主題的圖片。

用戶體驗設計:網站的整個用戶體驗設計良好,打開速度快。導航欄雖然不是在頂部,但在右側明顯的位置,點擊導航欄展開可以看到你想了解的一切信息。

2.Another escape.png


3. Design hotels


這個網站和Airbnb不同的是,它提供的是豪華的酒店信息,為遍布全球50多個國家的300多家獨立擁有的小型精品酒店和豪華酒店提供酒店服務。你可以選擇一個屬於自己的獨特酒店並以最優惠的價格入住。

UI設計:整個頁面的可視化結構並不混亂,巨大的背景照片和其他界面設計圖都是為了強調不同酒店的設計風格,以吸引用戶。

用戶體驗設計:整個網站的響應式布局凸顯了重要信息,例如,酒店登記信息、酒店促銷等,用戶一眼就能看見自己想要了解的內容,CTA的擺放也很明顯。網站打開速度快並且容易操作。

3.Design hotel.png


4. Visit Finland


想看北極光?想看真正的聖誕老人?想看原生態的大自然?這個網站提供關於芬蘭的一切旅遊信息,並且這是芬蘭國家旅遊局官方網站。

UI 設計:整個網站的視覺沖擊力很強烈,多以大圖作為背景,圖片選擇很精美,如極光、雪景、哈士奇拉雪橇等照片,突出了整個網站的主要內容,還有動態的地圖添加趣味性和獨特性。

用戶體驗設計: 網站提供完整的芬蘭旅遊信息,並且告知用戶哪些是熱門的項目,有什麽項目是值得觀賞的等。用戶可以通過滾動頁面的方式來了解具體的詳情。語言選擇方面除了通用的英文之外,還提供了日語和中文等。極力推薦大家看看這個網站。

4.VisitFinland.png


5. The Yacht Week


如果厭倦了森林冒險和陸地生活,那麽這個網站能夠提供給你最佳的遊艇冒險。每天醒來都是新的旅程,新的島嶼等你去探索,與你的朋友和數百個其他遊艇周遊者一起航行,享受各種派對和遊艇生活。

Ui設計:這個網站的設計主題以海上生活的圖片為主,顏色主要以藍白為主。當然也是以輪播大圖的形式來凸顯主要信息,並加上一個具有說服力的視頻引導。

用戶體驗設計:雖然頂部的導航欄的文字小,但是整體的結構很完整。隨意點擊幾下就能獲得你想要的信息。網站還提供具體預定教程,非常詳細。


5.Theyachtweek.png


更多旅遊網站範例欣賞:


6. Pitch Tent— 戶外帳篷旅行為主題

6.Pitch Tent.png


7. Parley Manor— 結婚旅行為主題


7. ParleyManor.png


8. Jackaroo Caravans—房車旅行為主題


8. JackarooCaravans.png


9. Turneffe Island Resort—島嶼旅行為主題


9. Turneffe.png


10. Outlines—自由行為主題


10. Outlines.png


如何高效地利用工具來設計一個打動人的旅遊網站

現在你已經掌握了基礎的旅遊網站設計原則,也瀏覽了這麽多精致優美的網站設計。唯一缺的就是一款簡潔高效的網站設計工具來幫助你設計一款好看的旅遊網站。在這裏給大家推薦一款個人比較中意的網頁設計工具—Mockplus,做原型更快更簡單,五分鐘就能創建一個原型交互頁面,無須代碼知識。對網頁設計的友好特點包括:

1. 3000個圖標(包括矢量圖標)和200個封裝組件

2. 除了有網頁項目,自由項目,還有自定義項目可供多種選擇

3. 拖拽即可完成交互

4. 屬性面板設置易操作,清楚明了,無需多余時間學習。

5. 8種演示方式供你選擇,發布分享簡單

6. 新增的格子功能和填充功能節省設計成本

7. 團隊協作功能讓你和你的成員溝通無障礙

11.png


總結


設計師在設計網站的時候,考慮的不僅僅是整個界面的美觀,當然在旅遊網站設計中視覺沖擊是占據主要位置的。同時,應該結合用戶心理來提升整個網站的用戶體驗。希望以上的分享可以帶給你設計靈感。

“世界那麽大,我想去看看” ——10款精美的旅遊網站設計欣賞