內容簡介
排版重要性
圖文排版實戰
1. 排版重要性
內容是很重要的，排版我個人認為是給內容加分的。
當然了，如果能做到內容好，排版也好，那就「真真是極好的」。
排版前
排版前1
排版前2
字間距沒有設置，是默認的。行間距沒有設置，是默認的 1 。感覺文字和段落太緊湊，看起來比較累。
排版後
排版後1
排版後2
排版後3
排版後，字間距和行間距都有增加，使得看起來沒有那麼緊密，比較輕鬆。
頁邊距也有所增加，使得整篇文章不會那麼緊貼屏幕左右兩邊。閱讀更舒適。
我覺得這樣的標題也不錯：
大標題
代碼高亮，縮進（我截的圖沒有體現出來，如果是多行代碼則更容易體現）。
編號：如果是中文，用了小黑方塊。而不是像以前統一都用小黑點。
註釋用灰色背景。
主題色是灰色，是比較不費眼睛的顏色。
英文和中文之間空一格，數字和中文之間空一格，數字和英文直接空一格，但 數字/英文 與中文標點之間不空格。
把雙引號 “” 改成「」或『』。
現在排版的資源很多，我推薦幾個比較主流的：
排版，用好這幾款絕對夠了。
我自己一般用 135 和秀米。
代碼排版軟件
沒有排版的代碼段
有高亮和縮進的代碼段
代碼排版插件
Markdown Here 插件：http://markdown-here.com/
目前有 Chrome，Firefox，Safari 的瀏覽器對應插件，也有 Thurnderbird 這個郵件客戶端的插件。。
代碼排版軟件
MarkEditor ：http://markeditor.com/app/markeditor
免費版和收費版兩種。一般其實免費版夠用了，但是你也可以用收費版。
不過有一些須知的點，還是有必要了解的，以防踩雷區：
圖文標題
文章標題分主標題和摘要兩部分，摘要也可稱為副標題。
推送給用戶
轉發在朋友圈
發送至好友或群裡。
不同場景，標題的呈現略有不同，最好分別預覽下再發布。
封面圖
單圖文封面圖尺寸 900 x 500。如果是多圖文，那麼首圖封面圖尺寸 900 x 500，次圖一律 200 x 200。次圖的風格最好保持一致。如下圖 ：
排版中圖片重要部位儘量居中，因為圖文消息在發送時會截取中間區域。不要用動圖。
作者與簽名
圖片描述
12 號字，顏色 a5a5a5，居中。
字號
建議大家正文中的字體最好使用 16 號字，最小不要小於 14 號，最大不要超過 18 號。手機屏幕有限，字體太大太小看起來都會不舒服。多分段，太長的段落會泯滅讀者繼續讀下去的動力。一段文字千萬不要超過手機一屏的長度。
註釋，用 16 號或 14 號字。
段落標題，用 18 號字。
字體
可以根據實際需要選擇，但是任何時間都不應該忽視辨識度，花哨的字體、斜體、濫用粗體是大忌。
用線條和符號，引導視線，領著讀者的眼睛，看你想讓它看的地方。
各種三角符號是個好東西。直角引號比較古典，用「」和『』代替 “ ”，尤其在標題中。
空格
英文和中文之間空一格，數字和中文之間空一格，數字和英文直接空一格，但 數字/英文 與中文標點之間不空格。
配色
色彩是非常關鍵的因素。
一般來說，正文不要用黑色，因為在移動端看比較刺眼。灰色的視覺友好度高。
在正文配色方面，一般使用 595959（十六進制 RGB），a5a5a5 也是比較不錯的，相對 595959 淡一些，但是文章裡可以這兩種顏色配合使用。
段落標題顏色 595959，可以用漢字，也可以用數字。段落標題用橙色 f79646 也不錯。
正文顏色用 3f3f3f 也可以，595959 有人反映偏淡，正文中的重點內容，可以加粗。
註釋顏色 a5a5a5，記得把註釋部分，加入引用框。
彩色不是不可以用，但是沒有深厚的功力，難以駕馭，一般用彩色來突出重點內容，推薦暗紅 c00000、深藍 0070c0、橙色 f79646。
背景色要慎重使用，尤忌大紅大紫，如果一定要加背景色，最好用淺色系。
文中重點部分可以加“底色”來強調。
編號
小黑點適合英文
小方塊更適合中文
空心小圓圈適合註釋內容
列出的條目，或者並列關係的句子，可以用有序或者無序列表區分開，或者用表格。文章中的人名、地名、書名或特殊名詞，可以加下劃線。
對齊
正文一般情況下左對齊，除非文字特別少，比如詩歌、廣告文案等可以 18 號字正文居中。右對齊用的少，特殊情況下可以試著用。
4. 圖文排版實戰
介紹了這麼多，我們來實戰一下好了。我們使用秀米來做演示，其他的平臺操作類似。
首先進入秀米的官網，點擊登錄，如果沒有賬戶，則註冊一個用戶賬號，或者可以綁定一些主流媒體號來登錄：
我是選擇用郵箱註冊，然後郵箱登錄進去後，點擊右上角「賬號設置」，
登錄進秀米首頁，我們會看到：
「秀製作」我們就不演示了，就展示一下「圖文排版」吧。
點擊「圖文排版」，進入圖文彙總頁面：
可以看到我已經制作過一些圖文了，因此它有存檔。
點擊「添加新的 2.0 圖文」，會進入正式圖文製作頁面：
可以看到從左到右有好多元素。那麼如何快速掌握這些工具的使用呢？貼心的秀米為我們製作了詳細圖文教程。
重新回到剛才那個圖文彙總頁面，可以找到一個「點此觀看圖文排版新手引導」：
點擊之後，會進入一個頁面「秀米圖文 2.0 新手引導」，
閱讀一下這個頁面，在最下面，會看到「點擊此處繼續進入基礎練習」：
點擊它，會進入「秀米圖文 2.0 基本操作」，
學完這頁。到最下面會看到「點擊此處繼續進入進階練習」：
點擊它，會進入「秀米圖文 2.0 進階操作」。
不過，我們還是來實際操作一下：
首先，我們像上面演示的一樣，新建一個圖文排版（點擊「添加新的 2.0 圖文」）：
然後，配置一下「全文屬性」（那個星形圖標）：
點擊星形圖標後，會出現全文屬性的配置選項：
首先，配置「主題」，可以看到系統給了我們一些默認顏色，如果你需要其他顏色，可以點擊右下角的加號，
可以看到我把 rgb （r 是 red 的首字母，表示紅色；g 是 green 的首字母，表示綠色；b 是 blue 的首字母，表示藍色。因此這三個就是三元色）的三個值都設置為 89，因為我們之前說過正文的配色常用 595959，但是 59 是十六進制的值，把它轉換成十進制就是 89 （5 * 16 + 9 = 89）。
接著，你就可以用調色板裡剛添加的這個顏色去設置文字或模板的配色了。
我們繼續配置全文屬性，點擊「間距」，把幾個間距設置如下：
可以看到，我設置的幾個間距分別是：
行間距：1.7 倍
字間距：1.5 像素
頁邊距：10 像素
當然了，這幾個值你可以自己調整，不一定要和我一樣。
然後，我們在「快速插入正文或粘帖文案到此」這個框中，
然後我們再對這段文字進行排版。
首先點中這段文字或者選中你要排版的一部分文字。可以看到，我們剛才已經提前設置了全文屬性，因此這整篇文字都是遵循 「行間距 1.7 倍，字間距 1.5 像素，頁邊距 10 像素， 字體顏色 rgb (89, 89, 89) 」。
如果你要對其中的個別文字設置屬性，可以選中文字，然後進行配置：
你可以對這個標題進行配色，比如我選擇淡藍色作為它的顏色：
修改標題顏色後，我們再修改標題文字，把我們的「排版重要性」這個標題粘帖到標題文字欄中，標題文字顏色也可以修改，加粗。現在我們全文的樣式：
點擊上方的一欄圖標的最右邊那個向下箭頭的圖標，在下拉菜單中選擇「選中全部內容」：
會看到又彈出一個窗口，如下：
然後你可以預覽一下，是不是你想要的格式。
學會了嗎？趕緊去試試吧！
微信公眾號 ：「 ProgrammerLeague 」程序員聯盟。我是謝恩銘，在巴黎奮鬥的軟件工程師。
熱愛生活，喜歡游泳，略懂烹飪。
人生格言：“向著標杆直跑”
閱讀更多 程序員聯盟 的文章
