技术文档 | Markdown中的配图

写在前面

技术文档中的配图一般分为两种：

• 流程图
• 截屏

流程图

流程图一般采用一些额外的工具来绘制，如：

• graphviz
• keynote
• sketch

流程图样例.png

说明：

如果想做出非常专业的配图，需保证

• 字形/字体：大小，粗细的变化
• 颜色：基本的配色理论就可以做出很舒服的配色
• 层次：尺寸，位置，颜色的深浅

截屏

截屏通常使用系统自带的截图工具截取所需要的产品界面就已经足够。

• 如果图片上加文字时，尽量从图片中吸取一个恰当的颜色。
• 如果截好屏的图片如果太大，最好将图片压缩一下（可以使用TinyPNG工具）再上传，这样一方面可以使网页速度加载得快些，另一方面可以降低CDN和用户流量费用。

注意：
截取的图片需要经过脱敏后方可插入文档中，一般如下情况需要脱敏：

• 涉及客户和项目的名称
• 涉及公司机密的信息
• 涉及同事的信息
• 涉及所有用文字和图片的版权信息

写在后面

常见配图的存放位置，请参见《技术文档 | 在 Markdown 中插入图片》