2017年最值得關注的幾個網頁設計趨勢

        新年新氣象，事物都在不停的變化，不斷的更新換代。網頁設計也是一樣，設計思維也在朝著新的趨勢發展。雖然我們無法確定2017年網頁設計有怎樣的變化，但是我們可以通過2016年整個設計圈的演進，來窺見未來可能會越來越火的網頁設計趨勢。

       不bu過guo，因yin為wei視shi角jiao和he領ling域yu的de差cha異yi化hua，設she計ji師shi們men對dui於yu設she計ji趨qu勢shi的de看kan法fa各ge不bu相xiang同tong，不bu過guo總zong體ti上shang並bing沒mei有you衝chong突tu
，從cong近jin期qi的de幾ji篇pian設she計ji趨qu勢shi文wen章zhang中zhong就jiu能neng看kan出chu來lai。UI設計趨勢的轉變
，很大程度上會受到用戶交互習慣、設計語言和數碼設備的影響，《趨勢丨8個你需要知道的2017年UI設計流行趨勢》這篇文章能讓你更加明白這個道理
；而電商行業則更多是從行業發展和從業經驗的角度來分享2017年電商設計的變化趨勢：《電商|入行5年，我寫文百篇後總結了這8條趨勢分析》;至於相對寬泛的用戶體驗設計，所探討的話題也相對更加抽象
，但是依然很重要，有興趣可以看看這篇重譯之後的《2017年即將流行的9大UX設計趨勢》
，相信你能有所收獲。

        當然，今天我們所要聊的是在網頁設計領域在2017年當中可能會出現的設計趨勢，也許並不完全精準
，但是相信設計師在接下來的一年中，越來越多的看到這些設計手法。

        1、越來越多的襯線體

        除開我們所熟知的Helvetica，占(zhan)據(ju)我(wo)們(men)屏(ping)幕(mu)首(shou)頁(ye)的(de)各(ge)種(zhong)非(fei)襯(chen)線(xian)體(ti)字(zi)體(ti)還(hai)有(you)很(hen)多(duo)。在(zai)過(guo)去(qu)幾(ji)年(nian)中(zhong)
，高(gao)清(qing)大(da)圖(tu)的(de)流(liu)行(xing)和(he)跨(kua)平(ping)台(tai)設(she)計(ji)大(da)行(xing)其(qi)道(dao)
，這(zhe)兩(liang)種(zhong)客(ke)觀(guan)需(xu)求(qiu)之(zhi)下(xia)讓(rang)設(she)計(ji)師(shi)慣(guan)於(yu)將(jiang)加(jia)粗(cu)、易讀的非襯線體和大圖結合起來使用。
       但是隨著高清屏幕的流行與普及，非襯線字體一家獨大的局麵將會發生改變。
       xijiefengfu

，chongmanzhuangshixingdefeichenxiantizitizaixianrujindepingmushang，yijingbucunzaishibiedudewentile
，keduxingqianglehenduo。zairujingaoxiangsumidudepingmushang，yongyoubutongmeixuetezhengdefeichenxiantizitidequanbutese
，dounengwanzhengdichengxianchulai。

       2
、深色係配色

       在過去的一年當中，大量的網站采用了白色和淺色的背景，采用深色背景設計的網站相對較少。
       keshikanduoleyeniwei。youyibufenwangzhanyijingkaishidaozhuanzhenggepeise，kaishizaizijiadewangzhanshangtansuoshensexipeisedemeixue。zaipeiseshangcaiyongshenseweizhudesheji

，zuixuyaozhuyidejiushiqizhongsecaideduibiduheneirongdekeduxing
，zhiyaobawohaoqizhongdeguanjie，nenggouhenhaodexiyinfangkedezhuyili。
       隨(sui)著(zhe)深(shen)色(se)係(xi)配(pei)色(se)而(er)來(lai)的(de)，還(hai)有(you)越(yue)來(lai)越(yue)多(duo)的(de)單(dan)色(se)配(pei)色(se)方(fang)案(an)，更(geng)極(ji)端(duan)一(yi)些(xie)的(de)，幹(gan)脆(cui)就(jiu)隻(zhi)在(zai)純(chun)色(se)的(de)深(shen)色(se)背(bei)景(jing)上(shang)搭(da)配(pei)照(zhao)片(pian)。這(zhe)樣(yang)的(de)配(pei)色(se)手(shou)法(fa)乍(zha)一(yi)看(kan)很(hen)單(dan)調(tiao)
，但(dan)是(shi)深(shen)色(se)背(bei)景(jing)下(xia)，流(liu)行(xing)色(se)會(hui)顯(xian)得(de)更(geng)加(jia)突(tu)出(chu)
，也(ye)更(geng)容(rong)易(yi)鼓(gu)勵(li)訪(fang)客(ke)與(yu)網(wang)站(zhan)進(jin)行(xing)互(hu)動(dong)。

       3、中性、自然的配色方案

        如果你一直關心流行色或者優設的話，你肯定會知道潘通最新發布的2017 年流行色——草木綠，這一自然氣息濃鬱的色彩被大家稱為“新中性色”。
        在未來的一年當中，將會出現越來越多充滿自然特色的配色方案，而其中許多配色方案會選擇使用草木綠來搭配。

        4、幾何元素

        從(cong)矩(ju)形(xing)到(dao)三(san)角(jiao)形(xing)
，從(cong)方(fang)形(xing)到(dao)圓(yuan)形(xing)，幾(ji)何(he)圖(tu)形(xing)已(yi)經(jing)越(yue)來(lai)越(yue)多(duo)地(di)出(chu)現(xian)在(zai)網(wang)頁(ye)設(she)計(ji)當(dang)中(zhong)。好(hao)的(de)設(she)計(ji)不(bu)會(hui)讓(rang)這(zhe)些(xie)幾(ji)何(he)圖(tu)形(xing)在(zai)整(zheng)體(ti)中(zhong)過(guo)於(yu)突(tu)兀(wu)，而(er)是(shi)盡(jin)量(liang)融(rong)入(ru)

，為(wei)用(yong)戶(hu)提(ti)供(gong)視(shi)覺(jiao)引(yin)導(dao)，強(qiang)化(hua)交(jiao)互(hu)體(ti)驗(yan)，提(ti)供(gong)行(xing)動(dong)召(zhao)喚(huan)，或(huo)者(zhe)讓(rang)整(zheng)個(ge)視(shi)覺(jiao)更(geng)加(jia)有(you)趣(qu)。
        網頁中幾何元素的設計要如何設計好呢?技(ji)巧(qiao)在(zai)於(yu)，盡(jin)量(liang)采(cai)用(yong)簡(jian)單(dan)的(de)設(she)計(ji)。例(li)如(ru)，你(ni)喜(xi)歡(huan)環(huan)狀(zhuang)的(de)元(yuan)素(su)，那(na)麼(me)你(ni)可(ke)以(yi)將(jiang)它(ta)作(zuo)為(wei)一(yi)個(ge)固(gu)定(ding)的(de)元(yuan)素(su)，在(zai)整(zheng)個(ge)設(she)計(ji)中(zhong)使(shi)用(yong)，它(ta)可(ke)以(yi)承(cheng)載(zai)圖(tu)標(biao)，也(ye)可(ke)以(yi)用(yong)作(zuo)團(tuan)隊(dui)成(cheng)員(yuan)頭(tou)像(xiang)外(wai)框(kuang)。
        幾(ji)何(he)元(yuan)素(su)的(de)另(ling)外(wai)一(yi)種(zhong)用(yong)法(fa)
，是(shi)將(jiang)多(duo)種(zhong)圖(tu)形(xing)做(zuo)成(cheng)拚(pin)貼(tie)式(shi)的(de)背(bei)景(jing)裝(zhuang)飾(shi)元(yuan)素(su)。幾(ji)何(he)元(yuan)素(su)尺(chi)寸(cun)較(jiao)小(xiao)的(de)時(shi)候(hou)，可(ke)以(yi)使(shi)用(yong)明(ming)亮(liang)的(de)色(se)彩(cai)
，讓(rang)整(zheng)個(ge)設(she)計(ji)顯(xian)得(de)更(geng)加(jia)繽(bin)紛(fen)有(you)趣(qu)。如(ru)果(guo)幾(ji)何(he)圖(tu)形(xing)尺(chi)寸(cun)較(jiao)大(da)，就(jiu)不(bu)能(neng)這(zhe)麼(me)用(yong)了(le)，而(er)是(shi)要(yao)通(tong)過(guo)著(zhe)色(se)讓(rang)他(ta)能(neng)和(he)其(qi)他(ta)元(yuan)素(su)構(gou)成(cheng)對(dui)比(bi)
，又(you)不(bu)能(neng)太(tai)過(guo)於(yu)突(tu)兀(wu)，比(bi)如(ru)Hive Boxx 這個頁麵的設計。

         5、超大字體

        有一些設計師已經開始這樣做設計了，不過隨後你會在網頁設計中看到更多的超大字體的設計。字體尺寸拉大之後，搭配多樣的樣式、飛濺的色彩，這些尺寸超大的文字如今已經變得越來越重要了。
        超(chao)大(da)字(zi)體(ti)流(liu)行(xing)背(bei)後(hou)的(de)邏(luo)輯(ji)是(shi)頁(ye)麵(mian)需(xu)要(yao)通(tong)過(guo)它(ta)們(men)抓(zhua)住(zhu)用(yong)戶(hu)的(de)注(zhu)意(yi)力(li)

，每(mei)個(ge)設(she)計(ji)師(shi)都(dou)需(xu)要(yao)讓(rang)特(te)定(ding)的(de)部(bu)分(fen)在(zai)整(zheng)個(ge)設(she)計(ji)中(zhong)脫(tuo)穎(ying)而(er)出(chu)。擁(yong)擠(ji)的(de)瀏(liu)覽(lan)器(qi)頁(ye)麵(mian)中(zhong)，要(yao)怎(zen)樣(yang)才(cai)能(neng)抓(zhua)住(zhu)用(yong)戶(hu)的(de)注(zhu)意(yi)力(li)呢(ne)?肯定是強視覺化的內容，這樣一來
，超大字體的流行就解釋得通了。

        6
、虛擬現實

        虛擬現實是目前最火熱的趨勢
，並且它已經入侵到了網頁設計領域了。
        許多設計師已經開始在他們自己的網頁中嚐試設計類似虛擬現實的效果。從遊戲到360度視頻，設計師試圖讓用戶無需VR眼鏡而擁有環繞的真實視野。雖然技術上和VR幾乎完全不沾邊，但是它同樣是追求真實的體驗。
        目前，這種設計還沒有完善的規則，許多類VR的網頁設計還是需要設計師動腦子想辦法來實現，非常考驗設計技巧。

        7、新的導航模式

        如(ru)果(guo)你(ni)一(yi)直(zhi)在(zai)關(guan)注(zhu)新(xin)的(de)設(she)計(ji)趨(qu)勢(shi)，你(ni)會(hui)發(fa)現(xian)設(she)計(ji)師(shi)一(yi)直(zhi)在(zai)嚐(chang)試(shi)尋(xun)求(qiu)不(bu)同(tong)的(de)導(dao)航(hang)模(mo)式(shi)。當(dang)然(ran)，截(jie)至(zhi)目(mu)前(qian)
，絕(jue)大(da)多(duo)數(shu)的(de)頁(ye)麵(mian)依(yi)然(ran)還(hai)是(shi)將(jiang)導(dao)航(hang)掛(gua)著(zhe)頁(ye)麵(mian)的(de)頂(ding)部(bu)。
        隨著不同的尺寸比例屏幕、不同的設備的出現，新的導航模式擁有了存在的可能性。首先流行開來的是屏幕側邊導航設計和隱藏式的導航設計。
        這種看似微小的變化，讓網站的瀏覽方式和體驗出現了翻天覆地的變化：它們讓頁麵變得更加時尚
，可以兼容不同的屏幕需求，甚至讓整個網頁布局都能進行全新的設計了。
        隱(yin)藏(zang)式(shi)菜(cai)單(dan)設(she)計(ji)並(bing)不(bu)是(shi)讓(rang)導(dao)航(hang)完(wan)全(quan)隱(yin)藏(zang)
，而(er)是(shi)讓(rang)整(zheng)個(ge)屏(ping)幕(mu)都(dou)成(cheng)了(le)呼(hu)出(chu)菜(cai)單(dan)的(de)控(kong)件(jian)
，這(zhe)樣(yang)的(de)設(she)計(ji)已(yi)經(jing)被(bei)很(hen)多(duo)用(yong)戶(hu)所(suo)理(li)解(jie)並(bing)熟(shu)知(zhi)
，它(ta)在(zai)移(yi)動(dong)端(duan)上(shang)的(de)應(ying)用(yong)已(yi)經(jing)相(xiang)當(dang)的(de)廣(guang)泛(fan)。