公衆號寫作排版指南v2.0（適配Dark Mode）
上一篇文章：公衆號寫作排版指南v1.0
微信的 iOS 版已經適配了 Dark Mode，Android 的深色模式也正在內測中，夜間使用微信的體驗將大大提升。
公衆號文章是由用戶自定義圖片，文字顏色，排版等等，很難做到完全適配。這使得當瀏覽公衆號文章時，效果大打折扣。
這時候可以按照一些規範，調整排版，使得文章在 Dark Mode 下依然賞心悅目。🌕🌑
文字顏色
首先說說微信公衆號文章深色模式的整體適配方案，頁面通過對顏色值進行一定的反轉計算，得到了 Dark Mode 下匹配的顏色值。例如正常模式下色號爲「#232323」的黑，在深色模式下顯示的爲 「#c3c3c3」的白；「#333333」的黑，會轉換爲「#b3b3b3」的白；彩色顏色值則不進行轉換。
參考 @阿里巴巴國際UED 以及 @ebooksplan 對於深色模式適配的文章，總結了如下的文字配色方案：
這是微信在「白色模式」和 「深色模式」不同顏色文字渲染效果，可作爲參考，主題色可自由選擇。
圖片
微信公衆號支持插入 JPEG、JPG、PNG、GIF 等格式的圖片，考慮到視覺上的統一，儘可能的選擇沒有底色的圖片。
目前 PNG 格式的圖片是最佳的選擇，底色透明，而且佔用空間小，加載速度會更快一些。
例如下面的微信圖標，在「深色模式」和「白色模式」下都能夠優雅的展示。
排版
排版的工具在上一篇文章有提到，這裏再說說細節。
本文排本所使用的一些參數如下：
- 字間距：1px
- 行間距：1.8em
- 端間距：3em
- 文字大小：16px
- 字體：Optima-Regular
- 兩端留白：10px
最後，有了以上的規範，你看到的「深色模式」和「淺色模式」下的就變成了下面的這個樣子👇
OK，以上就是本次文章的內容，希望你閱讀愉快，Good Night！
完
文章首發於公衆號「嗜碼」，未經許可，禁止轉載