文字排版設(shè)計(jì)的重要性相信也不用多說了，一個(gè)版面的編排，可以從中看出一個(gè)人的設(shè)計(jì)功底，從行業(yè)上看，網(wǎng)頁、畫冊、電商還是UI等，都離不開版式，一手好版真的可以說特別重要。排版簡單理解就是，在規(guī)定大小畫面中，有視覺層次的把信息進(jìn)行展現(xiàn)，主要包括文字排版和圖片排版等。

一、畫面切割，由大而小

常見的分割有，左右、上下，而我則喜歡不規(guī)則分割（大體看是不規(guī)則，其中還是有著某種規(guī)則），我的習(xí)慣是先把畫面分割好，然后去填充對應(yīng)內(nèi)容，這樣就非?？焖倭耍瑢?shí)際上和海報(bào)合成之前的靈感草圖是一樣一樣的，下面我就拿幾張海報(bào)舉個(gè)栗子。

因?yàn)樯蠄D是海報(bào)，我都是以純圖片為背景的，就是在已有的空間上去分割出文案的位置，可能表達(dá)的不是很透徹，下面我以網(wǎng)頁來舉例子。

那么最先開始的就是大版面分割了，頁面做出來是新穎特別呢還是穩(wěn)定常規(guī)？基本就有感覺了，具體版面怎么分割，完全看個(gè)人，只要比例協(xié)調(diào)，版塊與版塊之間銜接舒適就ok。

上圖左邊頁面結(jié)構(gòu)，看起來就會(huì)顯得穩(wěn)定常規(guī)一些，而右邊則新穎一些，當(dāng)然分割不止是大版面，由大而小，大版面分完了就需要從店招開始依次往下進(jìn)行小版面的分割，最后去填充內(nèi)容，具體填充手法就看個(gè)人設(shè)計(jì)功底了，下面實(shí)際舉例，左邊為我創(chuàng)作之前的版面分割，大到頁面布局，小到某個(gè)地方的排版，都是事先分割好的。

也有這種情況，就是按照事先切割好的版塊設(shè)計(jì)途中，有了更好的想法，就會(huì)稍作改動(dòng)，但是大體基本是沒有什么變化的（有時(shí)候?yàn)榱诵薷囊粋€(gè)版塊排版，結(jié)果把下面的排版都給改了去迎合這一個(gè)排版，都是淚）！

二、了解版式中的點(diǎn)、線、面 

那么什么是點(diǎn)、線、面呢？

簡單來講，單個(gè)元素、文字或者圖形都可以是點(diǎn)，多個(gè)點(diǎn)相連就形成線，多個(gè)點(diǎn)、線在同一個(gè)平面內(nèi)相交形成面。

點(diǎn)

單個(gè)或者極小范圍內(nèi)的圖形元素，稱之為點(diǎn)，點(diǎn)在版式中常用于，點(diǎn) 綴、裝飾、平衡頁面輕重。

線

線是點(diǎn)運(yùn)動(dòng)的軌跡，多個(gè)點(diǎn)的鏈接則形成了線，線常用于強(qiáng)調(diào)突出、鏈接、分割

面

擴(kuò)大的點(diǎn)，或者多個(gè)點(diǎn)線則形成了面，常用于背景、區(qū)域劃分

下面舉個(gè)栗子，大家可以找找圖里的點(diǎn)線面分別是哪里，有什么作用。

應(yīng)該不難看出，單個(gè)的虛化漸變都是點(diǎn)，單個(gè)的字母  數(shù)字也是點(diǎn)，點(diǎn)在這里起到的是裝飾點(diǎn)綴作用，中間的大面積漸變是線的體現(xiàn)，下面一排文案相連也是線的體現(xiàn)，線在這里起到的是鏈接視覺作用，最后這張圖里多個(gè)點(diǎn)、線的存在就形成了面。

三、信息表達(dá)分主次

層級(jí)混亂是導(dǎo)致畫面失衡的重要因素，客戶看圖會(huì)看得云里霧里，這就注定了是一張失敗的圖，什么是層級(jí)，就是在一個(gè)畫面里，一眼能看出來主次，信息層級(jí)的清楚區(qū)分會(huì)給人舒適的瀏覽體驗(yàn)，仔細(xì)觀看優(yōu)秀設(shè)計(jì)師的作品，你會(huì)發(fā)現(xiàn)，好的作品會(huì)在瀏覽舒適的同時(shí)， 引導(dǎo)著你的視覺瀏覽順序，我們來看看案例。

我們來簡單看看問題，首先是上圖，產(chǎn)品和文字之間的距離沒有拉開，信息層級(jí)區(qū)分不夠明顯，沒有明顯的視覺瀏覽順序以及舒適的體驗(yàn)，設(shè)計(jì)本身就是一個(gè)細(xì)節(jié)見證品質(zhì)產(chǎn)物，如果一個(gè)頁面里多個(gè)地方出現(xiàn)這種無層級(jí)的信息，則問題就大了。

那么信息分層的方法有哪些呢？

方法1：改變透明度，弱化其他信息的透明度來突出你想要突出的信息

方法2.拉開信息間距，把主題放在視覺焦點(diǎn)的位置展示，一般為中心，或者視覺瀏覽順序，即左右，或者上下

方法3：改變字體粗細(xì)，通過調(diào)整字體粗細(xì)來進(jìn)行弱化和突出

方法4：顏色，通過色彩來區(qū)分主次，黑白灰我稱為無色調(diào)，不算顏色。

方法5：大小，通過改變字體或者圖片大小來進(jìn)行弱化和突出

如果結(jié)合多種方法，那么信息層級(jí)的區(qū)分就會(huì)非常明顯了，下圖用到了居中，顏色，大小，透明度。

四、頁面平衡

也是很重要的一點(diǎn)，平衡這個(gè)詞的概念非常廣泛，各種平衡，自然、物理、藝術(shù)、心理、色彩、空間等等都包含平衡，而在設(shè)計(jì)中，平衡也是不可缺少的一個(gè)構(gòu)成要素，畫面不平衡就會(huì)導(dǎo)致看起來不穩(wěn)定，在設(shè)計(jì)中，更多的是體現(xiàn)色彩與體積的平衡。

那么頁面為什么需要平衡？

我個(gè)人理解為，構(gòu)成版面的所有元素，不論是文字還是圖片，都是有份量的，比如面積大小、顏色深淺、我們在排版的時(shí)候要做到各種元素在畫面中的占比達(dá)到和諧，畫面才會(huì)平衡，那我們來看看常用的平衡有哪些。

1. 色塊體積占比平衡

   
   

上圖中，非常明顯的平衡就是上下兩個(gè)色塊的面積占比基本一致，給人一種平衡感，色塊平衡多用于平衡頁面重心，讓畫面看起來更加穩(wěn)定，但是上圖因?yàn)閳D片反著的，所以才會(huì)給人一種另類的感覺。

2.位置空間的平衡

上圖就是空間平衡，沒有用整個(gè)圖片素材填滿整張圖，而是文字部分和圖片各占據(jù)一半，形成平衡。

在來看個(gè)栗子

上圖兩張基本一致，上圖就是移動(dòng)了一下文案和裝飾英文的位置，以及加了根條線，卻給人不一樣的感覺，可以想想為什么。

5.對齊

關(guān)于對齊真的是非?；A(chǔ)的一項(xiàng)內(nèi)容，也是非常重要的內(nèi)容，放在最后來講也是希望在提醒大家一遍，畫面里的信息一定是遵循著某種規(guī)則而擺放，絕對不是隨意擺放，有位大哥說過，隨意擺放經(jīng)不起時(shí)間推敲，有規(guī)則擺放則可能流芳百世 ~ 下面我們來看看對齊的例子。

你都看到哪些地方對齊了？這樣產(chǎn)出的頁面，是否更具說服感呢，元素切勿隨意擺放，讓每一個(gè)元素位置都滿足為什么。

總結(jié)：

版式包括了很多設(shè)計(jì)理念，文字排版、圖片選擇、點(diǎn)線面認(rèn)知、視覺沖擊感等多項(xiàng)知識(shí)點(diǎn)。充分理解，對每一個(gè)認(rèn)知面都有一個(gè)一個(gè)詳細(xì)的構(gòu)思，做到文字排版與圖片的相互融合，更有視覺沖擊力。