當前位置: 首頁 > 設(shè)計資訊 > 理論文摘 > 正文

勾引你出門旅游的網(wǎng)站都長什么樣?

2017-12-05 2210 0

其實酒店和旅游類的網(wǎng)站最能體現(xiàn)多媒體內(nèi)容和文字的搭配技巧了,這類網(wǎng)站通常需要營造氛圍,展現(xiàn)美感,體現(xiàn)吸引力,優(yōu)秀的案例比比皆是。今天我們就來看一組優(yōu)秀的案例~現(xiàn)如今的旅游和酒店類網(wǎng)站設(shè)計的越來越帶感了,壯美的風景和精致的界面融為一體,優(yōu)質(zhì)的服務(wù)和夢幻般的界面讓用戶在網(wǎng)站中流連忘返。這些網(wǎng)站以驚艷的圖片和視頻立足,配合以突出的現(xiàn)代網(wǎng)頁設(shè)計技術(shù),結(jié)合當下的設(shè)計趨勢,視差滾動、全景圖片、響應(yīng)式布局、動態(tài)圖片一個都不缺席。這些網(wǎng)站巧妙地將多媒體技術(shù)、文字排版和特效平衡為一體,為用戶提供了身臨其境的體驗。Pygmy Elep

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

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

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

Pygmy Elephant

1.jpg

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

Cruise Me

2.jpg

為了讓項目效果突出,設(shè)計和開發(fā)團隊使用了諸多先鋒的技術(shù)。當用戶打開網(wǎng)站的時候能夠看到首頁上交互性極強的地圖,每個地標都能夠為用戶提供豐富的信息以便瀏覽和了解。再向下,用戶可以翻看不同主題不同旅游項目的卡片,有目的和針對性地了解具體信息。整個網(wǎng)頁的設(shè)計友好而令人愉悅。

Bird Luxury Travel PR

3.jpg

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

The Art of Travel

4.jpg

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

S-Trip

5.jpg

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

Henge Travel

6.jpg

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

Batty Langleys

7.jpg

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

Kivo Hotel

8.jpg

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

The Cambrian, Hotel Adelboden

9.jpg

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

Villa Honegg

10.jpg

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

Matterhorn Focus

11.jpg

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

Lloyds Baia Hotel

12.jpg

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

Le Germain Hotels

13.jpg

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

Alex Perry Hotel and Apartments

14.jpg

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

TZVG

15.jpg

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

Giannoulis Hotels and Resorts

16.jpg

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

Isabela Galapagos Cruise

17.jpg

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

St. Moritz

18.jpg

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

THB Hotels

19.png

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

Travelscope

20.jpg

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



16
評論區(qū)(0)
正在加載評論...