線框在頁(yè)面中有什么作用呢， 邊框的視覺(jué)沖擊強(qiáng)。當(dāng)你在視覺(jué)頁(yè)面中看到被邊框框住的內(nèi)容， 會(huì)習(xí)慣性地吸引關(guān)注其中的圖像或是信息。如果邊框顏色和背景形成強(qiáng)烈對(duì)比的情況下， 更容易引起用戶的注意，其帶來(lái)的視覺(jué)效果更為強(qiáng)烈。
下面廣州網(wǎng)頁(yè)設(shè)計(jì)小編跟大家分享下， 線在網(wǎng)頁(yè)設(shè)計(jì)中的展現(xiàn)形式及使用作用。
框在主體后面
下面這張視覺(jué)圖， 線框是壓在主體人物的后面slogan和線框是在一個(gè)水平層級(jí)， 因?yàn)榫�框和背景顏色很接近，線框本身不突出， 很好的聚集了視覺(jué)焦點(diǎn)在框內(nèi)， 很好的襯托了主體任務(wù)和slogan。如果不加線框的話， 因?yàn)楸尘吧罴?xì)節(jié)很多，主體和slogan很容易被沖散， 視覺(jué)圖2 ，橘黃色框突出標(biāo)題， 并不強(qiáng)調(diào)圖片。
框在主體前面
下面這張視覺(jué)圖， 線框是壓在主體人物的前面， 主體和線框與背景的顏色非常接近， 這樣的對(duì)比slogan，線框壓在主體上面， 與slogan形成3個(gè)層次。形式感上有很強(qiáng)的沖擊力。左下的視覺(jué)2，也是礦在主體上方，但是這張視覺(jué)的框構(gòu)成的并不是線，而是由字母和形狀的點(diǎn)構(gòu)成框。右下的視覺(jué)3 ，如果之前的框放在主體上，是會(huì)弱化主體， 但是這張反倒是突出主體的眼睛部分，焦點(diǎn)會(huì)聚集在眼睛上， 然后再是文字。
框圖主體穿插
下面的這2賬視覺(jué)， 線框是與主體穿插， 部分在線框上方， 部分在線框下方， 文字也做一樣的處理， 這種方式更能使得線框不在生硬，線框和主體有很好的互動(dòng)，更使得整體畫面有立體感和空間感。
框面結(jié)合
下面這3張視覺(jué)圖，線框與面的結(jié)合， 讓線框整體的層級(jí)比主體還要突出，更能強(qiáng)調(diào)slogan，這樣的排版使得視覺(jué)中心一下就落在上面，視覺(jué)沖擊力強(qiáng)。
任何形都是有線包圍而成的， 線是一個(gè)二維生物里的產(chǎn)物。你可以把線看成一個(gè)點(diǎn)的運(yùn)動(dòng)軌跡， 線是一條運(yùn)行軌跡， 他是從點(diǎn)的基礎(chǔ)上發(fā)展而來(lái)的， 線在畫面的作用就是 裝飾文字，引導(dǎo)文字，整理文字，平衡畫面。
線的分割
下面這張參考banner圖， 主標(biāo)題與副標(biāo)題直接的過(guò)度，用了細(xì)長(zhǎng)的橫線， 在主標(biāo)題和副標(biāo)題之間，不僅起到了很好的分割效果，而且整體排版當(dāng)中很有節(jié)奏感和對(duì)比。參考banner圖2 則是加了兩條橫線， 很好的區(qū)分了上下的英文，雖然英文占較大比重， 但是字較多已形成整體， 兩條線一分格使中文的slogan并不會(huì)弱。
線的引導(dǎo)，
下面這張參考1 ，長(zhǎng)橫線很好的引導(dǎo)了右邊的內(nèi)容， 讓用戶在看完標(biāo)題之后， 順其自然的將焦點(diǎn)引導(dǎo)到內(nèi)容區(qū)， 又使得排版的形式獨(dú)特；參考2，這條橫線，完成了標(biāo)題和內(nèi)容的區(qū)分， 而且可以很好的引導(dǎo)用戶實(shí)現(xiàn)， 突出主體，創(chuàng)造視覺(jué)焦點(diǎn)。
線的強(qiáng)調(diào)，
下面這邊參考圖， 文字下的綠色韓浩的解決了白色的空洞，增加色綠點(diǎn)綴，還起到了強(qiáng)調(diào)文字的作用， 加上鏈接的功能， 可以更好的提高網(wǎng)站轉(zhuǎn)化率。
在網(wǎng)頁(yè)設(shè)計(jì)中， 框和線元素是輔助我們的整體發(fā)面， 讓畫面更加錯(cuò)落有致，創(chuàng)造視覺(jué)焦點(diǎn)。
,