網(wǎng)頁當(dāng)中經(jīng)常使用的十一種排版形式

前面的教程我們陸續(xù)介紹到一些設(shè)計原則在網(wǎng)頁當(dāng)中的運(yùn)用,今天我們來講講網(wǎng)頁設(shè)計經(jīng)常用到的排版方式。

在版式設(shè)計當(dāng)中,主要有以下幾種排版形式:重心型吼拥、中軸型、分割型(分上下分割和左右分割)线衫、傾斜型凿可、骨骼型、滿版型桶雀、曲線型矿酵、對稱型唬复、三角形、四角型和自由型全肮。這幾種形式會比較常出現(xiàn)在網(wǎng)頁設(shè)計當(dāng)中敞咧,所以我們一一來分析以下幾種排版方式。

1辜腺、重心型

重心型版式的網(wǎng)頁容易讓瀏覽者產(chǎn)生視覺焦點休建,界面效果強(qiáng)烈且突出。重心型又可以分以下三種形式评疗。

A测砂、直接以獨立而輪廓分明的形象占據(jù)版面中心。

ivanovoiskozh俄羅斯企業(yè)網(wǎng)站

B百匆、向心:視覺元素向版面中心聚攏的運(yùn)動砌些。

bdsalads食物食品網(wǎng)站

C、離心:猶如將石子投入水中加匈,產(chǎn)生一圈圈向外擴(kuò)散的弧線運(yùn)動存璃。

Twomari炸雞食品美食網(wǎng)站

2、中軸型

中軸型的網(wǎng)頁設(shè)計雕拼,是將圖形做水平或垂直方向的排列纵东,文案以上下或左右配置。水平排列的版面會給人穩(wěn)定啥寇、安靜偎球、和平與含蓄之感。垂直排列的版面給人強(qiáng)烈的動感辑甜。垂直排列的這種排版方式比較常出現(xiàn)衰絮。

INSPOT激發(fā)你的品牌 韓國設(shè)計公司網(wǎng)站

3、分割型

分割型主要可以分成上下分割和左右分割磷醋。相比較岂傲,左右分割型的網(wǎng)站會比較常見。

A子檀、上下分割

上下分割,顧名思義乃戈,就是把整個版面分為上下兩個部分褂痰。可以在上半部或下半部配置圖片症虑,另一部分則配置文案缩歪。配置有圖片的部分感性而有活力,而文案部分則理性而靜止谍憔。上下部分配置的圖片可以是一幅或多幅匪蝙。

Sojournal時尚家居企業(yè)網(wǎng)站

B主籍、左右分割

左右分割,就把整個版面分割為左右兩個部分逛球,分別在左或右配置文案千元。當(dāng)左右兩部分形成強(qiáng)弱對比時,則造成視覺心理的不平衡颤绕。這僅僅是視覺習(xí)慣上的問題幸海,也自然不如上下分割的視覺流程自然。不過奥务,倘若將分割線虛化處理物独,或用文字進(jìn)行左右重復(fù)或穿插,左右圖文則變得自然和諧氯葬。

AVEDA美容美發(fā)時尚網(wǎng)站

4挡篓、傾斜型

傾斜型的網(wǎng)站比較少見,這樣的網(wǎng)站偏個性化一些帚称,多在一些設(shè)計公司或是運(yùn)動品牌的網(wǎng)站中出現(xiàn)官研。版面的主體形象做傾斜設(shè)計,造成版面強(qiáng)烈的動感和不穩(wěn)定因素世杀,這種設(shè)計比較引人注目阀参。

2016CHUNGNAM韓國體育網(wǎng)站

5、骨骼型

骨骼型比較在傳統(tǒng)網(wǎng)站當(dāng)中比較常見瞻坝,它是一種規(guī)范的界面分割方法蛛壳。常見的骨骼有豎向通欄、雙欄所刀、三欄衙荐、四欄和橫向通欄、雙欄浮创、三欄和四欄等忧吟。一般以豎向分欄為多。說到這個斩披,就可以想到柵格系統(tǒng)溜族,實際上這兩者是差不多意思的。

骨骼型的網(wǎng)站會給人以嚴(yán)謹(jǐn)垦沉、和諧煌抒、理性的美。每一個區(qū)塊經(jīng)過相互混合后的版式厕倍,既理性寡壮、條理,又活潑而具彈性。

ZUI框架

6况既、滿版型

滿版型的網(wǎng)站近幾年也越來越多見这溅,通常是版面以圖象充滿整版,主要以圖象為訴求棒仍,視覺傳達(dá)直觀而強(qiáng)烈悲靴。文字的配置壓置在上下、左右或中部的圖象上降狠。滿版型給人以大方对竣、舒展的感覺。

水族館度假村俱樂部

7榜配、曲線型

圖片或文字在版面結(jié)構(gòu)上作曲線的編排構(gòu)成否纬,產(chǎn)生節(jié)奏和韻律。

Transfer Window

8蛋褥、對稱型

對稱的版式給人穩(wěn)定临燃、莊重理性的感覺。對稱有絕對對稱和相對對稱烙心。一般多采用相對對稱膜廊。以避免過于嚴(yán)謹(jǐn)。對稱一般以左右對稱居多淫茵。

DeLaneau(萬花筒效果爪瓜,心臟受不住的勿點),這個網(wǎng)站是絕對對稱匙瘪,比較少見铆铆,這樣的網(wǎng)站看久了會比較單調(diào)。

9丹喻、三角形

在圓形薄货、四方形、三角形等基本形態(tài)中碍论,正三角形(金字塔形)是最具安全穩(wěn)定因素的形態(tài)谅猾,而圓形和倒三角形則給人以動感和不穩(wěn)定感。

Asahi Refining黃金產(chǎn)品網(wǎng)站

10鳍悠、四角型

四角型指在版面四角以及連接四角的對角線結(jié)構(gòu)上編排的圖形税娜。這種結(jié)構(gòu)的版面,給人以嚴(yán)謹(jǐn)藏研,規(guī)范的感覺巧涧。

NOROO PAINT企業(yè)網(wǎng)站

11、自由型

自由行結(jié)構(gòu)是無規(guī)律的遥倦、隨意的編排構(gòu)成,有活潑捅彻、輕快之感累魔。

Happymaker in 高野山

以上簡單給大家分析講解了常見的幾種版式形式,每種版式設(shè)計并非以一種表現(xiàn)形態(tài)出現(xiàn)锌仅,比如四角型的網(wǎng)站可能會結(jié)合對稱性的出現(xiàn)或是中軸型堡称,所以大家在分析一個網(wǎng)站的時候不要以單一的一種視角去分析瞎抛。因為一個網(wǎng)站的設(shè)計可能同時存在好幾種版式形式。

不同的排版可以給人不同的視覺感受却紧,好的排版會給整個網(wǎng)站“錦上添花”桐臊。版式也沒有絕對的好壞,只有適合和不適合晓殊。希望今天給大家分享的內(nèi)容可以幫助到大家断凶。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市巫俺,隨后出現(xiàn)的幾起案子认烁,更是在濱河造成了極大的恐慌,老刑警劉巖介汹,帶你破解...
    沈念sama閱讀 212,718評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件却嗡,死亡現(xiàn)場離奇詭異,居然都是意外死亡嘹承,警方通過查閱死者的電腦和手機(jī)窗价,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,683評論 3 385
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來叹卷,“玉大人撼港,你說我怎么就攤上這事『滥龋” “怎么了餐胀?”我有些...
    開封第一講書人閱讀 158,207評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長瘤载。 經(jīng)常有香客問我否灾,道長,這世上最難降的妖魔是什么鸣奔? 我笑而不...
    開封第一講書人閱讀 56,755評論 1 284
  • 正文 為了忘掉前任墨技,我火速辦了婚禮,結(jié)果婚禮上挎狸,老公的妹妹穿的比我還像新娘扣汪。我一直安慰自己,他們只是感情好锨匆,可當(dāng)我...
    茶點故事閱讀 65,862評論 6 386
  • 文/花漫 我一把揭開白布崭别。 她就那樣靜靜地躺著冬筒,像睡著了一般。 火紅的嫁衣襯著肌膚如雪茅主。 梳的紋絲不亂的頭發(fā)上舞痰,一...
    開封第一講書人閱讀 50,050評論 1 291
  • 那天,我揣著相機(jī)與錄音诀姚,去河邊找鬼响牛。 笑死,一個胖子當(dāng)著我的面吹牛赫段,可吹牛的內(nèi)容都是我干的呀打。 我是一名探鬼主播,決...
    沈念sama閱讀 39,136評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼糯笙,長吁一口氣:“原來是場噩夢啊……” “哼贬丛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起炬丸,我...
    開封第一講書人閱讀 37,882評論 0 268
  • 序言:老撾萬榮一對情侶失蹤瘫寝,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后稠炬,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體焕阿,經(jīng)...
    沈念sama閱讀 44,330評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,651評論 2 327
  • 正文 我和宋清朗相戀三年首启,在試婚紗的時候發(fā)現(xiàn)自己被綠了暮屡。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,789評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡毅桃,死狀恐怖褒纲,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情钥飞,我是刑警寧澤莺掠,帶...
    沈念sama閱讀 34,477評論 4 333
  • 正文 年R本政府宣布,位于F島的核電站读宙,受9級特大地震影響彻秆,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜结闸,卻給世界環(huán)境...
    茶點故事閱讀 40,135評論 3 317
  • 文/蒙蒙 一唇兑、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧桦锄,春花似錦扎附、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,864評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽匙铡。三九已至,卻和暖如春碍粥,著一層夾襖步出監(jiān)牢的瞬間慰枕,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,099評論 1 267
  • 我被黑心中介騙來泰國打工即纲, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人博肋。 一個月前我還...
    沈念sama閱讀 46,598評論 2 362
  • 正文 我出身青樓低斋,卻偏偏與公主長得像,于是被迫代替她去往敵國和親匪凡。 傳聞我的和親對象是個殘疾皇子膊畴,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,697評論 2 351

推薦閱讀更多精彩內(nèi)容