其實(shí)酒店和旅游類的網(wǎng)站最能體現(xiàn)多媒體內(nèi)容和文字的搭配技巧了，這類網(wǎng)站通常需要營(yíng)造氛圍，展現(xiàn)美感，體現(xiàn)吸引力，優(yōu)秀的案例比比皆是。今天我們就來(lái)看一組優(yōu)秀的案例。

現(xiàn)如今的旅游和酒店類網(wǎng)站設(shè)計(jì)的越來(lái)越帶感了，壯美的風(fēng)景和精致的界面融為一體，優(yōu)質(zhì)的服務(wù)和夢(mèng)幻般的界面讓用戶在網(wǎng)站中流連忘返。

這些網(wǎng)站以驚艷的圖片和視頻立足，配合以突出的現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)技術(shù)，結(jié)合當(dāng)下的設(shè)計(jì)趨勢(shì)，視差滾動(dòng)、全景圖片、響應(yīng)式布局、動(dòng)態(tài)圖片一個(gè)都不缺席。這些網(wǎng)站巧妙地將多媒體技術(shù)、文字排版和特效平衡為一體，為用戶提供了身臨其境的體驗(yàn)。

Pygmy Elephant

Pygmy Elephant 是一個(gè)旅游機(jī)構(gòu)，網(wǎng)站為用戶提供了逼真而難忘的視覺(jué)體驗(yàn)。其中涵蓋的多媒體類型豐富，通過(guò)豐富的視覺(jué)體驗(yàn)鼓勵(lì)游客踏上旅程。網(wǎng)站使用了視頻背景，漂亮的圖文混排，精致的交互細(xì)節(jié)。

Cruise Me

為了讓項(xiàng)目效果突出，設(shè)計(jì)和開(kāi)發(fā)團(tuán)隊(duì)使用了諸多先鋒的技術(shù)。當(dāng)用戶打開(kāi)網(wǎng)站的時(shí)候能夠看到首頁(yè)上交互性極強(qiáng)的地圖，每個(gè)地標(biāo)都能夠?yàn)橛脩籼峁┴S富的信息以便瀏覽和了解。再向下，用戶可以翻看不同主題不同旅游項(xiàng)目的卡片，有目的和針對(duì)性地了解具體信息。整個(gè)網(wǎng)頁(yè)的設(shè)計(jì)友好而令人愉悅。

Bird Luxury Travel PR

Bird Luxury Travel PR 的首頁(yè)采用了全景式的大圖，將最美的風(fēng)景直接推送到用戶面前。這個(gè)全景式的圖片是以輪播圖的形式存在的。網(wǎng)站的整體結(jié)構(gòu)相對(duì)傳統(tǒng)，但是內(nèi)容相當(dāng)吸引人，用戶會(huì)樂(lè)于探索這樣的網(wǎng)站。

The Art of Travel

The Art of Travel 的網(wǎng)頁(yè)很好地將現(xiàn)代設(shè)計(jì)趨勢(shì)融入到頁(yè)面設(shè)計(jì)當(dāng)中，現(xiàn)代十足的居中式布局，幽靈按鈕，視差滾動(dòng)特效，以及最典型的漢堡圖標(biāo)，所有的這些設(shè)計(jì)元素讓整個(gè)網(wǎng)站顯得充滿活力又充滿吸引力。

S-Trip

S-Trip 是一個(gè)內(nèi)容和信息密度相當(dāng)高的頁(yè)面，設(shè)計(jì)師在多媒體內(nèi)容和文本的平衡上很下功夫。整個(gè)頁(yè)面的色彩明亮，排版布局相當(dāng)?shù)恼�齊，讓人不由得新生好感。

Henge Travel

作為一個(gè)旅行類網(wǎng)站，Henge Travel 所采用的這種區(qū)塊式布局非常適合于展示。5個(gè)小區(qū)塊播放著不同的視頻，展示著不同地域不一樣的風(fēng)情。它們各自占據(jù)不同的空間，為用戶提供導(dǎo)航。這樣的首頁(yè)一打開(kāi)，就為用戶營(yíng)造一種即刻就要出發(fā)的氛圍。

Batty Langleys

Batty Langleys 的網(wǎng)站設(shè)計(jì)看起來(lái)足夠奢華，華麗的圖片和夢(mèng)幻般的插畫(huà)，最終以動(dòng)態(tài)的方式展現(xiàn)出來(lái)。時(shí)尚的氣息和維多利亞時(shí)期的元素完美的融合到了一起。

Kivo Hotel

網(wǎng)站將經(jīng)典的橫向布局和柵格系統(tǒng)結(jié)合起來(lái)，讓整個(gè)首頁(yè)的設(shè)計(jì)顯得非常有范兒。頁(yè)面中不同的區(qū)塊承載著不同的內(nèi)容和作品，更重要的是使用了不同的風(fēng)格來(lái)進(jìn)行處理：水彩效果，漸變，像素化和線條化。這些不同的內(nèi)容區(qū)塊本身也有著導(dǎo)航的作用。

The Cambrian, Hotel Adelboden

大氣而細(xì)節(jié)豐富的圖片是這個(gè)著陸頁(yè)的主體，充滿吸引力。首頁(yè)的每一個(gè)區(qū)塊都使用了大氣無(wú)比的圖片，布局采用的是單欄和雙欄切換交疊的模式，看起來(lái)相當(dāng)?shù)默F(xiàn)代。

Villa Honegg

網(wǎng)站不僅僅通過(guò)圖片讓用戶對(duì)于這個(gè)酒店有所了解，網(wǎng)站還采用了全景式的視頻，將酒店最美的一面呈現(xiàn)了出來(lái)，給用戶以身臨其境的感覺(jué)。

Matterhorn Focus

Matterhorn Focus 的頁(yè)面中充滿了優(yōu)雅而精致的圖片，而也是這些別致的圖片吸引著用戶一直瀏覽下去。

Lloyds Baia Hotel

Lloyds Baia Hotel 并沒(méi)有跟風(fēng)走極簡(jiǎn)現(xiàn)代風(fēng)，網(wǎng)站的信息密度相當(dāng)高，但是并不顯得難用。在內(nèi)容豐富的同時(shí)，網(wǎng)站的設(shè)計(jì)也足夠整潔，頁(yè)面主體布局上采用的是不對(duì)稱的兩欄式排版，讓圖片的優(yōu)先級(jí)比起文字內(nèi)容更高，視覺(jué)化內(nèi)容的優(yōu)先級(jí)更高。

Le Germain Hotels

同樣是酒店的網(wǎng)站，Le Germain酒店的官網(wǎng)設(shè)計(jì)更加扁平，這種方正無(wú)比、凸顯排版的設(shè)計(jì)讓整體顯得更加奢華。網(wǎng)站的整體結(jié)構(gòu)穩(wěn)定，細(xì)致的排版營(yíng)造出一種精致而值得信任的氛圍。

Alex Perry Hotel and Apartments

這個(gè)網(wǎng)站采用的是典型的極簡(jiǎn)主義的設(shè)計(jì)，大量的留白凸顯出網(wǎng)站的視覺(jué)焦點(diǎn)，色調(diào)平易近人，給人以優(yōu)雅而友好的感覺(jué)。網(wǎng)站整體散發(fā)出的魅力讓人忍不住想多了解一下這家酒店和公寓。

TZVG

TZVG 是一個(gè)典型的視差滾動(dòng)式的網(wǎng)頁(yè)，整體的設(shè)計(jì)充滿活力，動(dòng)感十足。幾何圖形、色塊和圖片功能構(gòu)成了網(wǎng)頁(yè)的主要元素，順滑的過(guò)渡效果和微妙的動(dòng)效將不同的頁(yè)面連接到了一起。

Giannoulis Hotels and Resorts

網(wǎng)站的首頁(yè)被設(shè)計(jì)成兩欄式的布局，左側(cè)較窄的側(cè)邊欄是功能性的導(dǎo)航欄，而右側(cè)則放置的是高清大圖，用來(lái)為營(yíng)造氛圍，給用戶以好的印象。夾在兩者之間還有特別宅的一欄，它僅僅承載了幾個(gè)小圖標(biāo)，用來(lái)引導(dǎo)用戶獲取地圖、聯(lián)系電話、選擇語(yǔ)言。

Isabela Galapagos Cruise

這個(gè)著陸頁(yè)被設(shè)計(jì)成7個(gè)不同的區(qū)塊，每個(gè)區(qū)塊對(duì)應(yīng)一個(gè)旅程。每個(gè)旅程區(qū)塊都由一幅漂亮的圖片替代，纖細(xì)的線條構(gòu)成的圖形讓每一個(gè)區(qū)域都顯得精致而細(xì)膩。

St. Moritz

為了避免網(wǎng)站的信息過(guò)載，St.Moritz 的設(shè)計(jì)團(tuán)隊(duì)并沒(méi)有將頁(yè)面塞滿各種圖片和文字，而僅僅只是將最關(guān)鍵的信息展現(xiàn)出來(lái)。文本和圖片按照現(xiàn)代流行的左右結(jié)構(gòu)分別放置，文本內(nèi)容被精心的安放在特定的區(qū)域中，營(yíng)造出精致而熨帖的氛圍，同時(shí)也易于瀏覽。

THB Hotels

THB賓館的網(wǎng)站首頁(yè)所采用的大圖背景是海洋，剔透而精致的場(chǎng)景給人夏日的涼爽和放松的氛圍。網(wǎng)站使用了大量?jī)?yōu)質(zhì)的視覺(jué)線索引導(dǎo)用戶瀏覽，提供了輪播圖和卡片式的UI控件，兼顧了功能和體驗(yàn)。

Travelscope

Travelscope 是一個(gè)小而精悍的網(wǎng)站，網(wǎng)站的交互性極強(qiáng)，在谷歌瀏覽器中打開(kāi)能讓提價(jià)最佳。任意選取一個(gè)國(guó)家或者地區(qū)，你能看到這個(gè)國(guó)家的護(hù)照的使用范疇。唯一的問(wèn)題是它對(duì)觸摸屏的支持不夠優(yōu)秀。