我的公眾號文章排版編輯方案 2.0 - V2EX

語言: CN / TW / HK

當你選擇閱讀這篇文章時,我們應該達成了一個共識:微信公眾號官方後臺編輯器 特別爛、特別難用

四個月前,我分享了編輯公眾號的方法( 1.0 ),和本文內容差不多,都是基於 Markdown ,今天不同的是編輯之後的樣式,以及字號的大小等有所調整,變得更加美觀,易於閱讀。

因為閱讀一篇排版精美的文章,是眼睛的一種享受。獨立部落格 庭說 有一篇文章《 微信公眾號排版心得 》,作者提到古人對於寫作有兩個基本要求:

  • 有物
  • 有序

有物,即 文章要有內容 ;有序,即 文章要有條理 。我可以理解為內容上和排版上都要有條理,內容、結構清晰有條理,自然而然可以對文章排版結構進行合理劃分。

如果想了解精美的排版是怎樣的,我建議可以去看看這幾個公眾號的文章: 槽邊往事中國新聞週刊三聯文化週刊

我們在用 Word 進行編輯文字時,裡面需要設定的格式很多,包括頁面大小、行間距、段間距、字間距,字型、字號、顏色……在微信公眾號排版上大致可以參考這些。我從版面、文字、樣式三方面分享。

乾淨的版面

簡單來說,拒絕 花裡胡哨 ,我不喜歡用秀米、135 等編輯器的原因之一就是過於花哨,對於以文字寫作為主的公眾號作者來說不適合。此外,介面元素太多,容易干擾寫作,它給我的印象是更適合營銷宣傳類公眾號使用。

  • 行間距在 1.7-1.75 之間為宜
  • 字間距在 1-2 之間為宜
  • 兩邊縮排設定預設為 8

關於文章的配圖,我一直覺得非必要情況下,一張頭圖即可,它只是文章的點綴,排版做好了,沒有圖片搭配,閱讀也是一種享受。如果要插入圖片,我的建議: 圖片上下空行 。本文加上封面,共 3 張圖,足夠。

我們習慣了在紙媒上看每段文字首行縮排兩格,這個習慣我也一直在堅持,無論是考試寫作文還是平常寫日記。但是在電子閱讀上, 首行縮排更顯多餘,沒有必要

另外,我想說一個我討厭的點。見過許多公眾號文章,不知道 ta 是在寫詩還是寫文,常常一句話一行,一篇文章下來,只見整整齊齊的一列,像是疊好的俄羅斯方塊。儘管這樣能使人閱讀更加輕鬆,儘管現在的人沒多少耐心讀長文,但我總覺得很不舒服。

合適的文字

對於文字,我們需要考慮的方面有字型、字號、英文大小寫、中英混寫等。

中文和英文都有各自適宜的字型,在公眾號上中文基本上是宋體,但不同的字型只有在 iOS 裝置上才看得出。

同時,標題和正文的字號大小應該不一樣,方便讀者區分。中文裡沒有斜體這一樣式,儘量不要使用。中英文同時出現時, 中英文之間需要增加空格 ,例如上面提到的 iOS 。專有名詞要使用正確的大小寫,這個我也經常出錯,例如 GitHubYouTube

總結一下:

  • 正文字號 14
  • 標題字號 15 或 16
  • 中英文之間增加空格
  • 專有名詞注意大小寫

還有更加細緻的內容可以參考 GitHub 中的一篇文件《 中文文案排版指北 》。

統一的樣式

請快速瀏覽本文,可以發現我的標題(一級標題和三級標題)、加粗,以及用 反引號 包起來的內容,都是統一的顏色。

上面我提到,如果僅用字號大小來區分正文與標題,可行但不太明顯,如果給不同層級的標題新增不同的樣式,這樣即容易區分,又顯得有層次感。

另外,我建議,一旦確定使用某種樣式,後續的所有文章都應採用這種樣式,以形成自己的風格,增加讀者的印象。我之前的樣式風格和現在不一樣,因為當時不同層級的標題區分不明顯,我自己看著也不合適。

總結一下:

  • 樣式做到統一且固定
  • 形成“自成一派”的風格

微信 Markdown 編輯器

Markdown 是我認為最合適的排版工具,然而微信公眾號後臺編輯器不支援該語法,不慌,有方法。

Markdown 是一種輕量級標記語言,它允許人們使用易讀易寫的純文字格式編寫文件。相關語法本文不做介紹,可自行前往 菜鳥教程 網站檢視學習。

你所閱讀的這篇文章就是在 Markdown 編輯器中完成的。

一款高度簡潔的微信 Markdown 編輯器,支援 Markdown 語法、色盤取色、多圖上傳、一鍵下載文件、自定義 CSS 樣式、一鍵重置等特性。

自動即時渲染為微信圖文,這個功能在上圖中可以看到,左側是 Markdown 文件,右側則是渲染後的微信圖文。

當編輯好一篇文章時,只需點選右上角的複製,再去公眾號後臺編輯器貼上即可,不用增添刪改,直接釋出。

我也不是專門寫一篇文章為這個編輯器打廣告,只是在摸索中找到了合適且喜歡的編輯樣式,於是拿來自用並做分享。

不用花太多心思想著如何將一篇微信圖文寫得多麼漂亮、華麗, Less is more ,就我個人理解來說,大道至簡,更少但是更好,因為你把重要的東西做好了,那個重要的東西就是內容。讓讀者享受你的文章,讀懂你的內容,這就是 more

http://doocs.github.io/md/

最後,可以點選原文檢視最終排版效果。

http://mp.weixin.qq.com/s/_v1QluFXNjrElEplqGWHZw