研究了2000篇排版,發現它們都有這些問題……
自135編輯器“投稿通道”功能上線以後,官方帳號每天都可以收到文章排版投稿,加上“第一屆微信公眾號排版大賽”的成功舉辦,截止2017年12月31日,共收到2000餘篇投稿。
為了能更好地總結出優質排版的“套路”,
最常見的標題排版問題是:① 正文與標題區分不明顯 ② 各級標題邏輯關係不明顯。
可以通過對標題的強調,如加粗、加大字型大小等,與正文作出區分;也可以通過序號的逐級關係變化,來增強排版邏輯關係。
當然,我們還可以保證如上操作的基礎之上,使用標題樣式,來增強文章的排版美感,帶動文章的閱讀,優化視覺體驗。
一、這是一級標題
字型大小16、顏色#000000、加粗、字間距2、兩端對齊
2、這是二級標題
字型大小16、顏色#404040、加粗、字間距2、兩端對齊
(3)這是三級標題
字型大小15、顏色#404040、加粗、字間距2、兩端對齊
④ 這是四級標題
字型大小14、顏色#404040、加粗、字間距2、兩端對齊
字型大小16、顏色#000000、加粗、字間距2、兩端對齊
字型大小16、顏色#404040、加粗、字間距2、兩端對齊
字型大小15、顏色#404040、加粗、字間距2、兩端對齊
④這是四級標題
字型大小14、顏色#404040、加粗、字間距2、兩端對齊
字型大小16、顏色#000000、加粗、字間距2、兩端對齊
字型大小16、顏色#404040、加粗、字間距2、兩端對齊
字型大小15、顏色#404040、加粗、字間距2、兩端對齊
字型大小14、顏色#404040、加粗、字間距2、兩端對齊
需要注意的是:① 標題字型大小 ≥ 正文字型大小;無論文章使用到幾級標題,最底級標題的字型大小大小也應大於正文字型大小大小。
最常見的正文排版問題是:① 段落文字間留白控制不佳 ② 無法表現不同文體風格。
文字間留白問題,即:字間距、行間距、段前/後距的處理問題;不同文體/文風也正是依靠它們的大小數值變化來呈現。
文體風格還可以使用一些“正文樣式”來體現,
從前的日色變得慢,車、馬、郵件都慢,一生只夠愛一人;從前的鎖也好看,鑰匙精美有樣子,你鎖了,人家就懂了。《從前慢》
——摘自木心先生詩集《雲雀叫了一整天》
正文:字型大小16、顏色#404040、字間距1、行間距2、兩端對齊、段後距15-20
注釋:字型大小14、顏色#808080、字間距1、行間距1、居左對齊
從前的日色變得慢,車、馬、郵件都慢,一生只夠愛一人;從前的鎖也好看,
——摘自木心先生詩集《雲雀叫了一整天》
正文:字型大小15、顏色#404040、字間距1.5、行間距1.75、兩端對齊、段後距10-15
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
從前的日色變得慢,車、馬、郵件都慢,一生只夠愛一人;從前的鎖也好看,鑰匙精美有樣子,你鎖了,人家就懂了。《從前慢》
——摘自木心先生詩集《雲雀叫了一整天》
正文:字型大小14、顏色#404040、字間距2、行間距1.5、兩端對齊、段後距5-10
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
《從前慢》
從前的日色變得慢
車、馬、郵件都慢
一生只夠愛一人
從前的鎖也好看
鑰匙精美有樣子
你鎖了,人家就懂了。
——摘自木心先生詩集
《雲雀叫了一整天》
正文:字型大小15、顏色#404040、字間距1.5、行間距2、居中對齊、段間距空行
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
《從前慢》
從前的日色變得慢
車、馬、郵件都慢
一生只夠愛一人
從前的鎖也好看
鑰匙精美有樣子
你鎖了,人家就懂了。
——摘自木心先生詩集
《雲雀叫了一整天》
正文:字型大小14、顏色#404040、字間距2、行間距2、居中對齊、段間距空行
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
2
進階版
正文:字型大小16、顏色#404040、字間距1、行間距2、兩端對齊、段後距15-20
注釋:字型大小14、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小15、顏色#404040、字間距1.5、行間距1.75、兩端對齊、段後距10-15
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小14、顏色#404040、字間距2、行間距1.5、兩端對齊、段後距5-10
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小15、顏色#404040、字間距1.5、行間距2、居中對齊、段間距空行
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小14、顏色#404040
注釋:字型大小12、顏色#808080
段落文字排版注意文字間距的處理。大號文字要減少字距,小號文字需要增加字距,一般是1/5字距離。大號文字用大行距,小號文字用小行距,範圍在1-2之間。
無論是使用純色樣式、圖片背景樣式,還是圖文樣式,一定要呈現文字的最優化閱讀,即閱讀重心在文字,其餘輔助。
最常見的圖片排版問題是:① 圖片不統一 ② 與文體、風格不協調
頭條封面圖尺寸寬 900* 高 500 圖元;次條封面圖尺寸寬 200* 高 200 圖元;封面圖注意與公眾號品牌、整體風格、文風等相符合。
非GIF圖上傳至公眾後臺,經推文發佈後,圖片尺寸會等比壓縮成寬度640px,想提高圖片品質,可預先處理配圖的格式或尺寸。
建議大小不超過2M,為保證閱讀的流暢性,避免圖片載入緩慢等問題,可以預先將圖片處理成500k-1000k。
建議使用橫圖(16:9 和 4:3),不建議使用豎圖;或全文配圖統一尺寸比例,儘量避免橫豎圖混用;詩歌、短句排版可以使用圓圖樣式。
文章中使用表情,建議表情尺寸控制在130-180px,表情主體內容在150px即可。
圖片的色調,要符合全文配色需求。關於圖片知識,詳情可點擊《圖片知識》《配圖知識》
■■■■■Back toSchool
關於圖片排版,可以使用單圖、多圖、圖文等樣式,既能美化文章排版,又能增加公眾號特色。好看的單圖文樣式請點擊《單圖樣式》
最常見的排版配色問題是:① 對配色沒有準確定位 ② 全文色調不統一。
文字配色以黑、25%灰、75%灰、品牌色等為主。文字強調可使用黑色加粗、品牌色加粗或者紅色加粗的方式,當然也可以使用特殊字元配合強調。
配圖的色調儘量配合文章配色,圖片的視覺效果、表達的情緒也要符合配色環境,在尋找配圖時,可以首選品牌色調圖片,次選中性色調圖片。
首選依然是品牌色調。樣式在使用過程中,一定要注意與文字、圖片之間的協調,在全文色調統一的情況下,圖文樣式可以使用同色系遞減關係進行配色。
全文的配色,除了首先考慮品牌色之外,也可以根據文體風格,使用冷色系、暖色系或是小清新、視覺衝擊較大的配色。更多配色知識,請點擊《配色知識》
end
研究了2000份排版文章,其中可圈可點之處還有很多,鑒於本篇文章篇幅已經過長,其他的內容就下次再分享給大家。
如果你經常讀小三兒的文章,你會發現,其實“排版真的不難”,但想做好,確實也不容易!除非你一直使用135編輯器。
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
《從前慢》
從前的日色變得慢
車、馬、郵件都慢
一生只夠愛一人
從前的鎖也好看
鑰匙精美有樣子
你鎖了,人家就懂了。
——摘自木心先生詩集
《雲雀叫了一整天》
正文:字型大小15、顏色#404040、字間距1.5、行間距2、居中對齊、段間距空行
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
《從前慢》
從前的日色變得慢
車、馬、郵件都慢
一生只夠愛一人
從前的鎖也好看
鑰匙精美有樣子
你鎖了,人家就懂了。
——摘自木心先生詩集
《雲雀叫了一整天》
正文:字型大小14、顏色#404040、字間距2、行間距2、居中對齊、段間距空行
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
2
進階版
正文:字型大小16、顏色#404040、字間距1、行間距2、兩端對齊、段後距15-20
注釋:字型大小14、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小15、顏色#404040、字間距1.5、行間距1.75、兩端對齊、段後距10-15
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小14、顏色#404040、字間距2、行間距1.5、兩端對齊、段後距5-10
注釋:字型大小12、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小15、顏色#404040、字間距1.5、行間距2、居中對齊、段間距空行
注釋:字型大小13、顏色#808080、字間距1、行間距1、居左對齊
正文:字型大小14、顏色#404040
注釋:字型大小12、顏色#808080
段落文字排版注意文字間距的處理。大號文字要減少字距,小號文字需要增加字距,一般是1/5字距離。大號文字用大行距,小號文字用小行距,範圍在1-2之間。
無論是使用純色樣式、圖片背景樣式,還是圖文樣式,一定要呈現文字的最優化閱讀,即閱讀重心在文字,其餘輔助。
最常見的圖片排版問題是:① 圖片不統一 ② 與文體、風格不協調
頭條封面圖尺寸寬 900* 高 500 圖元;次條封面圖尺寸寬 200* 高 200 圖元;封面圖注意與公眾號品牌、整體風格、文風等相符合。
非GIF圖上傳至公眾後臺,經推文發佈後,圖片尺寸會等比壓縮成寬度640px,想提高圖片品質,可預先處理配圖的格式或尺寸。
建議大小不超過2M,為保證閱讀的流暢性,避免圖片載入緩慢等問題,可以預先將圖片處理成500k-1000k。
建議使用橫圖(16:9 和 4:3),不建議使用豎圖;或全文配圖統一尺寸比例,儘量避免橫豎圖混用;詩歌、短句排版可以使用圓圖樣式。
文章中使用表情,建議表情尺寸控制在130-180px,表情主體內容在150px即可。
圖片的色調,要符合全文配色需求。關於圖片知識,詳情可點擊《圖片知識》《配圖知識》
■■■■■Back toSchool
關於圖片排版,可以使用單圖、多圖、圖文等樣式,既能美化文章排版,又能增加公眾號特色。好看的單圖文樣式請點擊《單圖樣式》
最常見的排版配色問題是:① 對配色沒有準確定位 ② 全文色調不統一。
文字配色以黑、25%灰、75%灰、品牌色等為主。文字強調可使用黑色加粗、品牌色加粗或者紅色加粗的方式,當然也可以使用特殊字元配合強調。
配圖的色調儘量配合文章配色,圖片的視覺效果、表達的情緒也要符合配色環境,在尋找配圖時,可以首選品牌色調圖片,次選中性色調圖片。
首選依然是品牌色調。樣式在使用過程中,一定要注意與文字、圖片之間的協調,在全文色調統一的情況下,圖文樣式可以使用同色系遞減關係進行配色。
全文的配色,除了首先考慮品牌色之外,也可以根據文體風格,使用冷色系、暖色系或是小清新、視覺衝擊較大的配色。更多配色知識,請點擊《配色知識》
end
研究了2000份排版文章,其中可圈可點之處還有很多,鑒於本篇文章篇幅已經過長,其他的內容就下次再分享給大家。
如果你經常讀小三兒的文章,你會發現,其實“排版真的不難”,但想做好,確實也不容易!除非你一直使用135編輯器。