AnyForWeb正式推出旅游網(wǎng)站設(shè)計分析的系列文章，定時更新，本次主題為旅游網(wǎng)站中的在線酒店預訂板塊設(shè)計，歡迎關(guān)注!
酒店預訂也許并不是大家經(jīng)常使用的網(wǎng)站類型，但有過使用或設(shè)計經(jīng)歷的人一定會有感觸：由于這類網(wǎng)站本身需要的功能涉及比較廣泛，因此用戶體驗變得格外重要，在視覺設(shè)計上也會有些復雜，而如何讓兩者完美并存，這是令很多設(shè)計師頭痛不已的問題。
1.用戶需要一目了然的重點
進入酒店預訂網(wǎng)站或是板塊的用戶一般來說目的性很強，他們心里其實已經(jīng)有了很完整的設(shè)想，而來到網(wǎng)站只是為了完成計劃。因此，讓用戶在首頁就直觀的看到他們需要的內(nèi)容，并且盡可能的減少其他不重要內(nèi)容的出現(xiàn)，這是一個提升用戶體驗的好方法。
正如Agoda的設(shè)計，網(wǎng)站設(shè)計首屏以令人浮想聯(lián)翩的風景圖作為背景，酒店預訂的快捷入口最為搶眼，就連公司口號標語也只是簡短的出現(xiàn)在頁面上方。首頁設(shè)計以熱門內(nèi)容為主，根據(jù)大多數(shù)用戶的喜好和點擊查詢量列出推薦，這樣的想法確實很好，但是底部顯示的“熱門國家地區(qū)”和“熱門城市”是不是有點太多了…
2.用合適的大圖作為背景
用美觀的高清大圖作為網(wǎng)站背景似乎已經(jīng)成了一種萬能的設(shè)計方法，一張大圖搭配簡單的文字，就能輕輕松松讓網(wǎng)站變得莫名的高大上。在圖片的選擇上，“是否足夠美觀?”可能是我們一味的關(guān)注點，而“是否合適”也許對我們的整體網(wǎng)站設(shè)計更重要。這里所說的“合適”包括很多方面，色彩、布局、大小，甚至圖片中表達的含義。
Airbnb的網(wǎng)站的圖片使用方面很值得借鑒。首屏主要以大圖片為主，在熙熙攘攘的人群中有一男一女快樂的行走，有一種回家的感覺。下半部分分別使用了具有各地特色的照片作為背景，讓用戶能更直觀了對當?shù)仫L俗有初步了解。
3.切換圖片時減少誤點可能
在酒店詳情頁中最受關(guān)注且最先出現(xiàn)的是關(guān)于酒店的一些圖片，而這些圖片內(nèi)容對用戶來說可能又愛又恨。當用戶正在瀏覽的時候會覺得圖片表現(xiàn)完整但有些雜亂，而當用戶沒需求的時候又會因為一些正常的操作造成誤點。如果網(wǎng)站能先展示一部分圖片，讓需要查看更多圖片的用戶點擊進入一個專門的圖片板塊，并且對這些圖片進行分類，便于用戶有針對性的快速找到自己需要的內(nèi)容，這樣的網(wǎng)站設(shè)計才更符合用戶體驗。
游多多的詳情頁圖片使用了鼠標懸停后放大圖片的效果，另外設(shè)有“全部圖片”按鈕。
點擊“全部圖片”出現(xiàn)彈窗，左側(cè)顯示關(guān)于圖片內(nèi)容類型的分類，供用戶自行選擇;右側(cè)顯示圖片和縮略圖。這種形式讓圖片部分的條理十分清晰。
4.完整詳細的酒店信息
酒店信息詳情頁中的信息內(nèi)容都大同小異，但一些細微的差別卻能令網(wǎng)站的用戶體驗大相徑庭。大多數(shù)網(wǎng)站的介紹以“酒店簡介”之類的官方信息作為首要內(nèi)容，其實，用戶實際需要的并不是這些官方資料，與其息息相關(guān)的實用型內(nèi)容才是他們最關(guān)注的。
住哪兒網(wǎng)酒店詳情頁的內(nèi)容排序與大多數(shù)網(wǎng)站不同，文字介紹部分以“酒店設(shè)施”、“酒店政策”、“酒店介紹”…的順序排列，真正按照用戶的實際需求來做設(shè)計。
5.特別信息應該特別標注
這里所說的特別信息并不全部特指重要信息，也可以是一些網(wǎng)站方認為需要引起用戶注意的優(yōu)惠信息、贈送項目，或者數(shù)量提醒等。
Booking是一個專業(yè)的全球酒店預訂網(wǎng)站，網(wǎng)站中的設(shè)計都比較人性化。正如案例中顯示的酒店預訂環(huán)節(jié)，使用的文字及其色彩都以使用者角度出發(fā)，對用戶可能會感興趣的內(nèi)容作了不同顏色的顯示，這種做法很利于促成銷售。
6.圖文并茂的生動點評頁
其他用戶的點評是很多正在選擇的用戶都會關(guān)注的板塊之一，這些點評意見可能會對他們的最終選擇起到很大的引導作用，因此這部分的設(shè)計更應該被重視。常規(guī)化的劃分會讓用戶覺得沉悶單調(diào)，嘗試著設(shè)計一個活潑生動的點評板塊，讓用戶更容易接受和認可。
到到網(wǎng)的點評部分設(shè)計成了對話框的形式，并且支持圖文并茂，增加用戶的信任感，也讓用戶在瀏覽的時候更有參與感。
7.情感化預訂日歷
預訂日歷雖然只是一個很細小的環(huán)節(jié)，但是用戶很容易在這里產(chǎn)生混亂，所以給予用戶及時的交互反應變得格外重要，色差顯示或小批注都不會顯得多余。但在這部分的設(shè)計中也要注意，區(qū)域始終應該保持整潔，不能因為內(nèi)容多而疏忽視覺感受。
去哪兒網(wǎng)的預訂日歷設(shè)計表現(xiàn)的十分體貼。在選擇日期的時候顯示淺藍色底紋，并且用小標識告訴用戶總計天數(shù)，很大程度的減少了用戶的思考時間。
8.互動產(chǎn)生反饋
用戶在瀏覽任何網(wǎng)站時都喜歡有一種“我不是一個人在瀏覽”的感覺，所以每次鼠標懸停產(chǎn)生的一個小動作都會讓用戶覺得很溫暖。
藝龍的首頁交互效果做的很充分，幾乎每一處懸停都會有反饋。但雖然案例網(wǎng)站的交互反應比較多，卻也不會令人感到多余和復雜。這也給了我們一些啟發(fā)：當一個頁面中交互動作多的時候，需要注意產(chǎn)生的反應最好在一個指定的范圍內(nèi)，一旦超出范圍影響到其他版塊，就會令人覺得過于繁瑣。
9.拆分復雜的流程
酒店預訂的流程大多不會很復雜，和一般網(wǎng)上購物的流程大致類似，但首次預訂的用戶可能會少了一些安全感，而拆分并且顯示整個過程就是消除用戶不安的最好方法。
同程網(wǎng)站很仔細的對整個過程做了拆分。將每個比較重要的環(huán)節(jié)用口語化的文字表現(xiàn)出來，讓用戶不僅能夠?qū)χ笠鍪裁从辛饲宄牧私猓瑫r增加了網(wǎng)站的親和力。
10.減少輸入框和必填項
滿屏的輸入框和標記著紅色星號的必填項與生俱來著一種令人反感的視覺體驗，而很多網(wǎng)站恰巧就是這么做的!為什么一定要讓用戶必須先注冊才能預訂或者購買?這種強制性的行為要求會讓用戶覺得自己處于很被動的位置。如果網(wǎng)站能以柔和的態(tài)度解決登錄注冊問題會不會更好?
珠海市天惠設(shè)計制作有限公司，成立于1996年8月,是為拓展中國Internet領(lǐng)域應用而專門成立的高新技術(shù)企業(yè)，是企業(yè)電子商務技術(shù)服務和解決方案綜合服務提供商。