推送制作与排版

推送是校园宣传里最常用、也最容易做丑的形式。丑的原因通常不是“审美不行”，而是没人告诉过你：字号该多大、段落该多长、什么时候该用图、什么时候该收手。

一、工具分工：四个工具各管一段

先把工具用对，能省掉一半返工：

工具	管什么	什么时候用它
秀米	图文排版、SVG 效果、导出到公众号	默认选择。功能最全，模板最多，能直接绑定公众号导出
可画	位图：海报、长图、封面、无缝图	需要“整块图片”时用。做好导出 PNG，再整张放进推送
PS 一类位图软件	抠图、修图、合成	按需学，不要系统学。遇到具体需求再查具体操作
公众号后台	发布与最后的细节微调	只做发布。正文排版不要在这里改，改一处会带乱一串

二、秀米：为什么“表格”是排版的基本单位

秀米的排版逻辑和 Word 完全不同，理解这一点，很多“怎么都对不齐”的问题会自己消失。

秀米里的一切排版都基于表格（组件）。一个组件的行为有三条：

宽度手动调整——你设多少就是多少；
高度自适应——内容多了它会变高，你不需要（也常常不能）直接设死高度；
位置手动调整——可以左右移动、可以重叠。

由此推出两条实用结论：

删掉上面一块，下面的内容会自动往上补。 所以调整顺序不用复制粘贴，删了重排更快。
调整高度靠“内容”，不靠“拉框”：常用的做法是在文本框里前插空行或后插空行，或者用组件定位（外边距/内边距）把它顶下去。

六个可以调的东西

进入布局模式后（右上角），你实际能控制的只有这六个：

元素	作用	常见误用
宽度	决定一行能放多少字	设得过宽 → 手机上两侧被裁
高度	由内容撑开，靠空行/定位调整	想把高度“拉”到某个数值
定位	左右偏移、上下错位	靠定位做复杂布局，换个机型就散
缩放	整体放大缩小	用它代替改字号
边距（内/外）	控制留白，两侧边距由内外边距共同决定	两边都设很大，正文被挤成一条
次序	重叠图案的上下层	图压住了字，找不到谁在上面

三、从套模板到自由修改：三层

新手最容易卡在“模板好看但不合我的内容”。按这三层递进，会顺手很多：

层级	你能改什么	难度
改模板	只换文字和图片	最省事，但想改结构就会崩
套组件	把模板拆开，用里面的组件重新拼	中等：排版方式和位置可调
改组件	直接调字号、间距、SVG 参数	最好改，也最自由

三条实践建议：

找“视觉风格和预期效果一致”的模板，而不是找“最花哨的”。风格对一个，你只需要改内容；风格不对，你怎么调都别扭。
善用收藏。 遇到一个顺手的标题组件、一个好看的分割线，收藏起来，下次直接调。
大胆修改。 模板是起点不是终点，尤其是视觉风格（配色、字体、整体气质）不好改，排版方式（位置、SVG 参数）可以改——先判断你面对的是哪一种。

四、文字排版：一套可以直接照抄的规范

基本原则只有一句：符合大众阅读习惯、简洁易读、格式统一。

字号

用途	字号	说明
主标题	> 24	一眼看到的那个
章节标题	16–24	和小标题配合
正文	15–16	低于 15 在手机上会很费眼
结尾落款	12–14
图注	12

颜色

正文用偏灰的黑色，不要纯黑（纯黑在手机上偏硬）。
重点内容可以单独用一种颜色标出来——只允许一种。
图注和落款用灰色 #B2B2B2。

字体

用默认字体就好。 手机端能显示的自定义字体非常有限，你选的字体在读者那里大概率不生效。
无衬线体比衬线体更易读（手机上这个差别很明显）。

常用格式（照抄即可）

项目	建议值
行间距	2.0
字间距	0–1
两侧边距	内 + 外 = 15–25
段落间距	0（靠空行分段，不靠段间距）
对齐	正文左对齐或两端对齐，全篇一致，无首行缩进；不要居中

留白的规矩

小标题：与上文空两行，与下文空一行。
段与段：空一行。
上下文与配图之间：空一行。
段落长度：不要超过手机一屏字数的一半。超过了就拆段。

强调

小标题：增大字号。
重点：加粗 + 变色（一种主色调）。
中文排版少用下划线和斜体——下划线像链接，斜体在中文里几乎不起区分作用。

五、SVG：动效值得做吗

SVG 是可缩放矢量图形，一种描述二维图形的语言。在微信推文里，它可以实现交互与动态效果（点击展开、滑动、渐变），这些是普通图片做不到的。

两条实现路径：

路线	优点	代价
用编辑器里的 SVG 模板/组件	封装的包，简单易上手	灵活性有限，效果受限
直接编辑源代码	能实现复杂效果	极为繁琐，改一次要很久

实践建议：

先看有没有现成的。 去 e2.cool 这类站找你想要的效果，多数常见交互都有封装好的代码。
SVG 要多试。 只有真的做过几个，你才知道哪些组件能用、哪些组合会互相打架。
为效果而效果是不值得的。 一条通知类推送加三个动效，只会让人找不到信息。

六、长图：最稳的兜底方案

当排版需求超出了图文编辑器能表达的范围（复杂版式、整块的设计感、非要严丝合缝的图形），别硬在编辑器里拼：

在可画里把这一整块做成一整张图（PNG 导出）；
把图放进推送。

好处是格式绝对一致——你在哪里看都一样，不依赖机型和编辑器解析。代价是没有动态效果，且手机端文字被“烧”进图片里，无法被搜索、无法被复制、也无法被屏幕阅读器读出。

七、深色模式

微信有深色模式，它会自动反色部分元素。三个高频崩法：

透明背景的 PNG：浅色底图上会变成一坨黑边或糊掉；
深色文字配浅色底：反色后对比度消失；
纯白/纯黑的分割线：反色后突兀。

检查方法：手机预览时切一次深色模式，重点看图注、分割线、按钮和图里的文字。

八、出稿前自检

九、常见坑

免责声明：本站是学生自发整理的经验分享，不代表清华大学官方立场。涉及培养方案、选课规则、绩点计算、保研政策等一切制度性内容，请以教务、院系和学校官方通知为准。

发现内容有误、过期，或想补充一篇经验帖？欢迎到GitHub Issues提出，或直接编辑对应页面提交 PR。

维护者入口：站内后台—— GitHub 登录后可改文字 / 传图 / 嵌视频，保存会自动开 PR，合并后上线。