圖片源自網(wǎng)絡(luò)，如有侵權(quán)請(qǐng)至后臺(tái)聯(lián)系小編

本篇文章由135編輯器親授，全方位解讀排版技巧，內(nèi)容由淺入深，以講義結(jié)合案例的方式，為大家呈現(xiàn)一場(chǎng)有料有趣的排版教程。

內(nèi)容文字圖片較多，建議先收藏，在WIFI環(huán)境下閱讀，土豪請(qǐng)隨意~

“審美”到底是怎么回事？

先來(lái)看這樣一組對(duì)比照，網(wǎng)上超火的妝前妝后照，你喜歡哪一個(gè)？相信答案應(yīng)該是一致的。人們對(duì)于美和丑的認(rèn)識(shí)是這樣，美，可能比較難描述到底哪里美，但是丑卻能一眼指出。

化了妝的妹子就好像是排了版的文章，給人一眼看去非常舒服的感覺(jué)。如果說(shuō)標(biāo)題能引導(dǎo)讀者點(diǎn)開(kāi)文章，好的排版就留住讀者繼續(xù)閱讀，從而才會(huì)達(dá)到內(nèi)容想要的效果，保持優(yōu)美的排版也會(huì)增加用戶粘度。

排版的目的？

使內(nèi)容更容易、更有條理地被讀者接收，更容易傳達(dá)作者意圖。

什么樣的排版能夠輔助閱讀？

總結(jié)起來(lái)大概是這幾點(diǎn)：容易理解、可以掃讀、整潔有序、段落清晰和重點(diǎn)突出。

給讀者帶去愉悅、舒適的視覺(jué)享受，帶來(lái)視覺(jué)體驗(yàn)的美感。

排版基本技巧-字體

● 選擇合適的字體

● 同一篇文章的字體種類

● 同一種字體的不同處理方式

①選擇合適的字體

不同類型的文章風(fēng)格需要不同的字體表達(dá)，比如古詩(shī)詞，用手寫體或者楷體，微軟雅黑或者黑體就不搭配的。

▼

YES

NO

VS

②同一篇文章的字體種類

字體種類不宜過(guò)多，一般不超過(guò)三種。如需要變換，盡量采用同一字族，如葉根友鋼筆行書、毛筆特色、刀鋒等。

③同一種字體的不同處理方式

一般采用加粗、顏色、大小、斜體（一般是英文）。

為何中文不能用斜體，斜體其實(shí)是西方一些文字的手寫體，中文是方塊字，斜體是變形的，中文的手寫體一般是書法體。

補(bǔ)充說(shuō)明：

字體顏色選擇事，建議正文字色75%灰、注釋字色50%灰、這兩種顏色視覺(jué)友好度高，純黑有些刺眼，灰色溫和些，黑灰白三色，是最安全也最有逼格的顏色。

當(dāng)然，標(biāo)題顏色可適當(dāng)區(qū)分開(kāi)。

排版基本技巧-字號(hào) 

字號(hào)過(guò)大或過(guò)小都影響閱讀，太小需要放大鏡，太大比較適合老年群體。

選擇合適的字號(hào)：

●標(biāo)題：16px、18px、20px；

●正文：14px、16px

●注釋：12px、14px

一般來(lái)說(shuō)，標(biāo)題，正文，注釋應(yīng)有層級(jí)大小區(qū)分。

舉個(gè)栗子：

排版基本技巧-字距和行距

字距一般都是固有的，如果你覺(jué)得要調(diào)整，不要過(guò)大或過(guò)小。太密眼睛不舒適、太稀成豎文本了。一般是1/5字距離，大號(hào)文字要減少字距，小號(hào)文字需要增加字距。

字間距從左至右：太密、合適、太疏        

什么是行距？就是正文中每行文字之間的距離。行間距控制好可以讓大腦更輕松識(shí)別文字內(nèi)容——這也符合我們的閱讀習(xí)慣。

經(jīng)過(guò)很多的測(cè)試，目前最常見(jiàn)的是行間距選擇的數(shù)值是1.5和1.75，而1顯得太擁擠，如果文字很少則可以設(shè)置為2倍。

行距=1

行距=1.75

VS

注意：文本字體越小，兩行的行間距應(yīng)該越大，確保字與行呼吸的空間。

所以，排版不是要填滿所有的空間，而是要把握好字間距和行距的關(guān)系，有的放矢，信息內(nèi)容表達(dá)更清晰。

排版基本技巧-行寬

行寬是指一行文字的寬度。行寬對(duì)閱讀的記憶是有影響的，我們的視線移動(dòng)呈 “Z” 字形，合適的行寬可以有效避免大腦對(duì)多余信息的處理。

比如咪蒙的每篇文章都有設(shè)置左右留白，行寬值小，簡(jiǎn)單易讀，形成獨(dú)特的小清新風(fēng)格。

排版基本技巧-首行縮進(jìn)和段間距

區(qū)分段落與段落之間，可以采用首行縮進(jìn)和段間距兩種方式。

手機(jī)閱讀不同于紙媒，段落的開(kāi)始一般不需要首行縮進(jìn)，段落之間通過(guò)空行調(diào)大段間距。

排版基本技巧-常用對(duì)齊方式

符合閱讀習(xí)慣、親切自然，使閱讀更輕松

新穎、有格調(diào)、時(shí)尚有現(xiàn)代感。

視線集中、整體感強(qiáng)、莊重優(yōu)雅

新穎、趣味、別具一格

排版基本技巧-標(biāo)點(diǎn)符號(hào)

示例：IOS 是個(gè)不錯(cuò)的操作系統(tǒng)

示例：已經(jīng)到了 11 月了。

示例：我剛買了臺(tái) iPhone 7

除了標(biāo)點(diǎn)符號(hào)外，我們用線條和圖書符號(hào)引導(dǎo)閱讀。如圖：用線條和符號(hào)領(lǐng)著讀者的眼睛，看你想讓他看的地方。

例如:閱讀原文樣式

戳原文，更有料！

排版基本技巧-圖片

大家不知道有沒(méi)有這樣的體會(huì)，有時(shí)候網(wǎng)絡(luò)不好，打開(kāi)一篇文章，半天圖片都顯示不出來(lái)，那就是你的圖片太大了。

封面圖片尺寸大小：寬900px 高500px , 顯示效果最好。

圖片大?。?靜態(tài)圖100k , 動(dòng)態(tài)圖500k

圖片格式：GIF格式更清晰

壓縮圖片網(wǎng)站：推薦騰訊「智圖」

現(xiàn)135編輯器擁有圖片庫(kù)，內(nèi)有大量免費(fèi)高清圖片

縮放、裁剪、旋轉(zhuǎn)、翻轉(zhuǎn)、銳化、圖片濾鏡、多圖拼貼

人像處理（美白、磨皮…）加圓角、加邊框、加陰影

135編輯器直接鏈接了美圖秀秀，可以進(jìn)行上述操作。

上圖下文、下圖上文、左圖右文、右圖左文、圖文疊加、圖文環(huán)繞多行、多列圖文穿插排列。

細(xì)節(jié)處理-清除格式

微信的編輯后臺(tái)是一個(gè)網(wǎng)頁(yè)編輯器，就是如果直接拷貝粘貼的話，會(huì)帶著原來(lái)的格式過(guò)來(lái)。

無(wú)論你的原文是放在Word文檔，還是網(wǎng)站上，文本里的每一個(gè)字都指定了大小、粗細(xì)、顏色、字體。你如果不看代碼，是不知道的。但是，一旦你直接拷貝粘貼過(guò)來(lái)，會(huì)帶著原有的所有格式過(guò)來(lái)。而那些格式，很可能根本不適合手機(jī)，也不適合微信。

記事本可以避免這種情況，把內(nèi)容粘貼進(jìn)記事本，等再次拷貝出來(lái)的時(shí)候，一切原始的格式都會(huì)消失。

135編輯器會(huì)為你的文章重新指定合適微信閱讀的格式。

細(xì)節(jié)處理-排版簡(jiǎn)潔，忌花哨

大家可以看到這兩種排版，其實(shí)做得也是很用心的，這些花花綠綠的設(shè)置做起來(lái)也是很麻煩的。

但是相信大多年輕人應(yīng)該是不喜歡這樣的版式的，因?yàn)闆](méi)有輔助閱讀的作用，相反太多的點(diǎn)綴還影響了閱讀。

這里給到大家的建議是：排版整體顏色不超過(guò)三種，沒(méi)有特定的要求，就不要用很復(fù)雜很花的邊框，不要用奇怪顏色的字體。

全篇顏色最好是同色系，但是深淺度不同。

最有用的方法是，把重點(diǎn)用彩色（暗紅c00000、深藍(lán)0070c0、橙色f79646）加粗。

一個(gè)三四種字體，七八種顏色的頁(yè)面，那是丐幫的制服。而一個(gè)簡(jiǎn)潔、緊湊、漂亮的頁(yè)面，如同一個(gè)人洗臉?biāo)⒀罎{洗衣服一樣，是對(duì)觀者的尊重。

細(xì)節(jié)處理-突出重點(diǎn)

之前提到視線是Z字形移動(dòng)的，但是我們可以人為改變視線的順序，比如加粗，下劃線，黑體，符號(hào)突出，顏色等。

也可以通過(guò)圖標(biāo)和特殊符號(hào)來(lái)突出重點(diǎn)，我給大家列出了135編輯器里一部分符號(hào)的樣式，可根據(jù)文章的風(fēng)格和時(shí)下的熱點(diǎn)選擇合適的圖標(biāo)。

再者，對(duì)于每段的小標(biāo)題，我們也可以用標(biāo)題樣式來(lái)突出，這樣會(huì)讓文章的層次更加鮮明。

細(xì)節(jié)處理-配色流程

第一步：整體定調(diào)

給整篇圖文確定一個(gè)大概的色彩基調(diào)，做這一步可以有效防止在接下來(lái)的配色步驟中出現(xiàn)色彩混亂的情況。

第二步:確定主色

主色決定著整體色彩趨向，是一個(gè)整體的色彩基調(diào)。在所有出現(xiàn)的色彩中占比往往不低于75%。

第三步：確定輔助色

輔助色主要起到輔助主色的作用。輔助色可以使色彩更加豐富完美。輔助色的占比往往在20%左右。

第四步：確定點(diǎn)綴色

點(diǎn)綴色，有時(shí)候也稱作點(diǎn)睛色，取畫龍點(diǎn)睛之意。往往具有引導(dǎo)閱讀，裝飾畫面，營(yíng)造具有特色的畫面風(fēng)格的作用。整體占比常常在5%左右。

個(gè)人觀點(diǎn)是：你可以不明白到底怎么去判斷一篇圖文里面什么顏色是主色、什么顏色是輔助色。但你一定要懂得利用點(diǎn)綴色。圖文的本質(zhì)終究還是閱讀。白底黑字永遠(yuǎn)是最好的閱讀搭配。所以學(xué)會(huì)用點(diǎn)綴色?？酥频氖褂蒙?。5%是一個(gè)很小的數(shù)字。