網(wǎng)頁設(shè)計(jì)的吸睛策略
標(biāo)簽：
網(wǎng)頁設(shè)計(jì)
2017.04.17
網(wǎng)絡(luò)時(shí)代中，當(dāng)各種產(chǎn)業(yè)都面向網(wǎng)路經(jīng)濟(jì)時(shí)，網(wǎng)頁設(shè)計(jì)是否夠吸睛，往往成了營(yíng)銷致勝的關(guān)鍵主因之一。我們整理了 8 個(gè)網(wǎng)頁設(shè)計(jì)的主流應(yīng)用方向，希望可以作為網(wǎng)站改版或活動(dòng)網(wǎng)站設(shè)計(jì)的參考依據(jù)。
1. 滿版圖片設(shè)計(jì)
相較于純文字的描述，視覺性內(nèi)容更容易吸引網(wǎng)友眼球，利用高畫質(zhì)圖片讓網(wǎng)友愿意多花一點(diǎn)時(shí)間在網(wǎng)站中，并開始留意網(wǎng)站所提供的產(chǎn)品服務(wù)說明。其實(shí)大圖的設(shè)計(jì)風(fēng)格我們可以從 2014 年的一些網(wǎng)站中逐漸尋覓軌跡，例如 Wearemammoth,Fiftythree,Dodocase 等網(wǎng)站中了解網(wǎng)頁設(shè)計(jì)的趨勢(shì)。除此之外，大家可能會(huì)好奇高畫質(zhì)的圖片去哪下載呢？筆者提供一個(gè)自己常用的圖庫網(wǎng)站 Stocksnap.io，不僅免費(fèi)而且無需經(jīng)過授權(quán)。
2. 扁平式設(shè)計(jì)
扁平式設(shè)計(jì)為 2014 年初所釋出的一種設(shè)計(jì)風(fēng)格，由 Apple 以及 Microsoft 引領(lǐng)此種設(shè)計(jì)風(fēng)格，其優(yōu)點(diǎn)在于能夠結(jié)合不同素材，并且利用較短的時(shí)間就能完成設(shè)計(jì)。其中 Google’s Material design 就是最好的范例之一。
3. 情緒性圖片設(shè)計(jì)
情緒性圖片不單純只是一張圖片，它能藉由圖片中的人、事、物深化內(nèi)容資訊，讓網(wǎng)友從圖片就能意會(huì)到作者或編輯欲想表達(dá)的情境與感覺，這也就是為什么情緒性圖片是許多部落格寫手與作家最喜歡在網(wǎng)站中所使用的圖片類型，例如Snow fall 與Rolex awards 是使用情緒性圖片的范例網(wǎng)站。
4. 印刷式設(shè)計(jì)
網(wǎng)站使用的字型也會(huì)影響到瀏覽的視覺效果。我們能夠從許多網(wǎng)站發(fā)現(xiàn)，越來越多網(wǎng)站開始使用高畫質(zhì)印刷字型或云端字型作為網(wǎng)站的設(shè)計(jì)風(fēng)格，其優(yōu)點(diǎn)在于能運(yùn)用簡(jiǎn)單的資訊內(nèi)容與強(qiáng)烈對(duì)比讓網(wǎng)友能迅速對(duì)網(wǎng)站品牌留下印象，其中以Rsq 與Je Sus Unico 的網(wǎng)站最明顯。
5. 異想情境設(shè)計(jì)
利用脫離現(xiàn)實(shí)情境的設(shè)計(jì)風(fēng)格來吸引網(wǎng)友的注意力。此種設(shè)計(jì)風(fēng)格的網(wǎng)站較為稀少，其中以 Magic Leap 為此種設(shè)計(jì)風(fēng)格的范例。國(guó)外營(yíng)銷團(tuán)隊(duì) Hubspot 也預(yù)測(cè)在 2015 年將會(huì)有更多網(wǎng)站開始使用異想情境的設(shè)計(jì)風(fēng)格。
6. 手繪風(fēng)格設(shè)計(jì)
網(wǎng)頁設(shè)計(jì)的制式風(fēng)格可能脫離不了又大又美的圖片以及搶眼的印刷字體，但手繪式風(fēng)格卻逆向操作，利用平易近人的設(shè)計(jì)突顯出另一種吸睛的網(wǎng)站風(fēng)格，讓網(wǎng)友能夠以輕松的心情瀏覽網(wǎng)頁，增加網(wǎng)站的停留時(shí)間。例如 A List Apart 以及 Basecamp 等都是利用手繪風(fēng)格設(shè)計(jì)的范例網(wǎng)站。
7. 背景影片設(shè)計(jì)
比起高畫質(zhì)圖片，動(dòng)態(tài)背景更容易傳遞品牌價(jià)值給網(wǎng)友。此種設(shè)計(jì)風(fēng)格是利用短暫的背景動(dòng)態(tài)影片循環(huán)來加深網(wǎng)友對(duì)于品牌的印象。在2014 年，許多網(wǎng)站普遍采用高畫質(zhì)圖片輔助網(wǎng)站的視覺效果，我們也能預(yù)見這類風(fēng)格的網(wǎng)站在未來將持續(xù)帶給網(wǎng)友耳目一新的視覺體驗(yàn)，例如： Airbnb,Rosewater Film,Maersk Fleet 都是使用背景影片設(shè)計(jì)的范例網(wǎng)站。
8. 電影動(dòng)態(tài)設(shè)計(jì)
相較于圖片與影片的設(shè)計(jì)，電影動(dòng)態(tài)影片雖然較為特別，但也更難掌控視覺呈現(xiàn)的效果。藉由靜態(tài)動(dòng)圖的呈現(xiàn)方式，讓每張圖片更具有張力與故事性，發(fā)揮網(wǎng)友的想像力，將每個(gè)部分的故事串接起來，宛如看電影一般。 Cinemagraphs 與 The Guardian Firestorm 都是使用電影動(dòng)態(tài)設(shè)計(jì)的范例網(wǎng)站。
無論是哪種網(wǎng)頁設(shè)計(jì)的方向，不同類型的網(wǎng)站都必須思考如何利用最有效的網(wǎng)頁設(shè)計(jì)輔助營(yíng)銷傳播，而前提必須符合目標(biāo)族群、產(chǎn)品與市場(chǎng)定位的考量，再衡量上述分享的應(yīng)用設(shè)計(jì)是否符合需求；畢竟如果為了設(shè)計(jì)而設(shè)計(jì)，反而失去了網(wǎng)站設(shè)計(jì)的初衷，而讓網(wǎng)頁設(shè)計(jì)成效大打折扣。
1. 滿版圖片設(shè)計(jì)
相較于純文字的描述，視覺性內(nèi)容更容易吸引網(wǎng)友眼球，利用高畫質(zhì)圖片讓網(wǎng)友愿意多花一點(diǎn)時(shí)間在網(wǎng)站中，并開始留意網(wǎng)站所提供的產(chǎn)品服務(wù)說明。其實(shí)大圖的設(shè)計(jì)風(fēng)格我們可以從 2014 年的一些網(wǎng)站中逐漸尋覓軌跡，例如 Wearemammoth,Fiftythree,Dodocase 等網(wǎng)站中了解網(wǎng)頁設(shè)計(jì)的趨勢(shì)。除此之外，大家可能會(huì)好奇高畫質(zhì)的圖片去哪下載呢？筆者提供一個(gè)自己常用的圖庫網(wǎng)站 Stocksnap.io，不僅免費(fèi)而且無需經(jīng)過授權(quán)。
2. 扁平式設(shè)計(jì)
扁平式設(shè)計(jì)為 2014 年初所釋出的一種設(shè)計(jì)風(fēng)格，由 Apple 以及 Microsoft 引領(lǐng)此種設(shè)計(jì)風(fēng)格，其優(yōu)點(diǎn)在于能夠結(jié)合不同素材，并且利用較短的時(shí)間就能完成設(shè)計(jì)。其中 Google’s Material design 就是最好的范例之一。
3. 情緒性圖片設(shè)計(jì)
情緒性圖片不單純只是一張圖片，它能藉由圖片中的人、事、物深化內(nèi)容資訊，讓網(wǎng)友從圖片就能意會(huì)到作者或編輯欲想表達(dá)的情境與感覺，這也就是為什么情緒性圖片是許多部落格寫手與作家最喜歡在網(wǎng)站中所使用的圖片類型，例如Snow fall 與Rolex awards 是使用情緒性圖片的范例網(wǎng)站。
4. 印刷式設(shè)計(jì)
網(wǎng)站使用的字型也會(huì)影響到瀏覽的視覺效果。我們能夠從許多網(wǎng)站發(fā)現(xiàn)，越來越多網(wǎng)站開始使用高畫質(zhì)印刷字型或云端字型作為網(wǎng)站的設(shè)計(jì)風(fēng)格，其優(yōu)點(diǎn)在于能運(yùn)用簡(jiǎn)單的資訊內(nèi)容與強(qiáng)烈對(duì)比讓網(wǎng)友能迅速對(duì)網(wǎng)站品牌留下印象，其中以Rsq 與Je Sus Unico 的網(wǎng)站最明顯。
5. 異想情境設(shè)計(jì)
利用脫離現(xiàn)實(shí)情境的設(shè)計(jì)風(fēng)格來吸引網(wǎng)友的注意力。此種設(shè)計(jì)風(fēng)格的網(wǎng)站較為稀少，其中以 Magic Leap 為此種設(shè)計(jì)風(fēng)格的范例。國(guó)外營(yíng)銷團(tuán)隊(duì) Hubspot 也預(yù)測(cè)在 2015 年將會(huì)有更多網(wǎng)站開始使用異想情境的設(shè)計(jì)風(fēng)格。
6. 手繪風(fēng)格設(shè)計(jì)
網(wǎng)頁設(shè)計(jì)的制式風(fēng)格可能脫離不了又大又美的圖片以及搶眼的印刷字體，但手繪式風(fēng)格卻逆向操作，利用平易近人的設(shè)計(jì)突顯出另一種吸睛的網(wǎng)站風(fēng)格，讓網(wǎng)友能夠以輕松的心情瀏覽網(wǎng)頁，增加網(wǎng)站的停留時(shí)間。例如 A List Apart 以及 Basecamp 等都是利用手繪風(fēng)格設(shè)計(jì)的范例網(wǎng)站。
7. 背景影片設(shè)計(jì)
比起高畫質(zhì)圖片，動(dòng)態(tài)背景更容易傳遞品牌價(jià)值給網(wǎng)友。此種設(shè)計(jì)風(fēng)格是利用短暫的背景動(dòng)態(tài)影片循環(huán)來加深網(wǎng)友對(duì)于品牌的印象。在2014 年，許多網(wǎng)站普遍采用高畫質(zhì)圖片輔助網(wǎng)站的視覺效果，我們也能預(yù)見這類風(fēng)格的網(wǎng)站在未來將持續(xù)帶給網(wǎng)友耳目一新的視覺體驗(yàn)，例如： Airbnb,Rosewater Film,Maersk Fleet 都是使用背景影片設(shè)計(jì)的范例網(wǎng)站。
8. 電影動(dòng)態(tài)設(shè)計(jì)
相較于圖片與影片的設(shè)計(jì)，電影動(dòng)態(tài)影片雖然較為特別，但也更難掌控視覺呈現(xiàn)的效果。藉由靜態(tài)動(dòng)圖的呈現(xiàn)方式，讓每張圖片更具有張力與故事性，發(fā)揮網(wǎng)友的想像力，將每個(gè)部分的故事串接起來，宛如看電影一般。 Cinemagraphs 與 The Guardian Firestorm 都是使用電影動(dòng)態(tài)設(shè)計(jì)的范例網(wǎng)站。
無論是哪種網(wǎng)頁設(shè)計(jì)的方向，不同類型的網(wǎng)站都必須思考如何利用最有效的網(wǎng)頁設(shè)計(jì)輔助營(yíng)銷傳播，而前提必須符合目標(biāo)族群、產(chǎn)品與市場(chǎng)定位的考量，再衡量上述分享的應(yīng)用設(shè)計(jì)是否符合需求；畢竟如果為了設(shè)計(jì)而設(shè)計(jì)，反而失去了網(wǎng)站設(shè)計(jì)的初衷，而讓網(wǎng)頁設(shè)計(jì)成效大打折扣。
400-7808-893 / 010-64913142
我想要個(gè)更針對(duì)我需求的方案
友情鏈接：
也許您需要專業(yè)的服務(wù)，歡迎來電咨詢
您的需求，是我們前進(jìn)最大的動(dòng)力
關(guān)于我們
北京分形科技有限公司成立于2003年，是一家以AI為核心驅(qū)動(dòng)力，提供網(wǎng)絡(luò)品牌策劃、AI互聯(lián)網(wǎng)服務(wù)、WEB3服務(wù)、AI人工智能解決方案的綜合服務(wù)商
我們一直秉承的經(jīng)營(yíng)理念：責(zé)任、熱情、品質(zhì)、包容
主要業(yè)務(wù)范圍：AI互聯(lián)網(wǎng)服務(wù)（網(wǎng)站建設(shè),網(wǎng)站群,短視頻社交平臺(tái),APP,小程序）AI人工智能行業(yè)解決方案（智慧博物館,智慧公園,智慧景區(qū),智慧社區(qū),智慧醫(yī)療,智慧校園,）IoT智能物聯(lián)產(chǎn)品（智能步道,AR太極,AI健身,AI導(dǎo)覽,AI單車,智慧樹）WEB3（區(qū)塊鏈,元宇宙,NFT數(shù)字藏品）
版權(quán)所有：北京分形科技有限公司
Copyright 2003-2023 www.kdnyva.com All Rights Reserved. 北京分形科技有限公司
京ICP備05007162號(hào)-1