Markdown 贴图指南

一篇好的文章,少不了图文并茂,因此,我们需要为我们的文章绘制图片,好的图片会让我们的文章内容更加丰满,更加讨喜。

在这篇文章中,我们将从「选图」、「做图」、「存图」三个方面来讨论,如何处理我们的内容。

关于选图

在写文章的时候,我们并不会自己做所有的图,也会用到一些外部的图,这些外部的图,就需要我们去使用一些网络上的图片。

在使用网络的图片的时候,我们需要注意的主要是版权问题,如果不注意版权问题,你后续有可能会因此吃亏。

这里我为你推荐一些可以免费商用的无版权图库,你在选外部图片的时候,可以直接在这些网站中找:

Pexels:https://www.pexels.com StockSnap:https://stocksnap.io UnSplash:https://unsplash.com Pixabay:https://pixabay.com

关于做图

除了一些网图,绝大多数的时候,我们都需要自己作图,这时,我们就需要掌握一些基本的规则,通过这些基本规则,来让我们的图片变得规范、整洁。

做图的基本原则

接下来,我为你介绍一些简单的规则,帮助你做好图片

1. 减少用色

我们所绘制的图片,大多是流程说明,因此,我们所绘制的图片其实并没有我们想象中的那么复杂,图片也是尽可能简单为好。不要在图片中使用大量的颜色,更好的是使用一个颜色的不同深度的颜色,从而可以突出不同用颜色的主次。

如果你不懂得配色,那么最简单的方法是使用 Material Design 已经配好的色卡, 使用其中的颜色就可以了,比如蓝色的色卡就是这样的。

其他颜色的你也可以在 https://material.io/design/color/the-color-system.html#tools-for-picking-colors 找到,从中选择你喜欢的颜色来使用就可以了。

通过组合不同的色彩,会让你的图片的颜色更加鲜艳,内容更加饱满,但是也要注意不要搞太多的颜色,以免影响内容本身的表达

2. 使用合理的字体

由于我们所写的内容大多是科技内容,因此,我建议你使用无衬线字体。

无衬线字体相比于衬线字体,更具备科技感。同时,考虑到字体的版权问题,我强烈向你推荐 Noto Sans CJK SC 字体。这个字体是免费商用的,你可以在 https://github.com/googlefonts/noto-cjk 下载到。

此外,在我们的图片中也会出现一些英文,我推荐你使用我们常用的代码字体,比如 Source Code Pro、Fira Code、 Ubuntu Mono、Inconsolata等,这些字体都是无衬线字体,能够很好的和 Noto Sans CJK SC 搭配使用。

3.不要使用纯白色的背景

纯白色的背景冲击力太强,你可以选用一些较淡的蓝色或灰色,都可以弱化背景的冲击,使得我们的文章更加柔和,读的时候更加轻松。

你可以使用 #eff1f3#CFD8DC#E0E0E0等颜色来作为你的背景色

4. 统一化你的图片中出现的组件

由于我们所制作的图片高度一致,因此,我们需要将我们所用到的组件尽可能的保持一致。相同的组件保持相同的大小、颜色、阴影,从而确保你的组件整体的一致性,这样你的图片会显得整齐,读者的看图体验会更好。

做图的基本工具

就作图而言,你用什么工具都并不重要,重要的是你能否很好的去遵循上述的原则,将你的图片做的干净、整洁。不过,如果你现在还没有好的绘图工具的话,我推荐你使用 Powerpoint (Keynote)来绘制你的图片。

这两个工具操作简单,同时提供了一些方便的格式调整工具,还可以方便的导出高清的图片,因此我推荐你使用这两个工具来绘图。

演示:动手做一个图片

光说不练假把式,接下来,我将用 Keynote 来教你如何绘制一个图片。

首先,打开 Keynote ,选择,新建一个“宽幅”的白色背景模板。一直使用同一款模板,会保证我们的图片在导出的时候,始终是相同大小。选择宽幅则会让我们的图片不至于占用太多的画幅。

进入界面后, 我们来编辑一下母版,设置背景色和水印

选择我们要使用的模板,并点击背景,选择颜色填充,设置我们要用的颜色,就可以修改页面的颜色了。

然后在右下角添加一下我们自己的水印,并配置一下样式,然后点击完成。

回到默认页面,新建一个空白页面

并在这个页面上绘制一些我们常用的组件,作为我们的组件库。

然后新建一个空白页面来绘图,同时,从组件库复制内容到新的页面来进行绘图。

绘制完成后,将其导出为图片即可。

此时,你就可以得到一个简单,但不影响文章整体感官的图片。

如果你是要做多张图片,这样的模式可以确保你产出的图片保持在同一个水平。同时,这个前面的模板准备的工作可以保留下来,多次使用,降低每次绘图的时间成本。

关于手绘

有些时候,我们会自己在纸币上绘制一些东西来说明我们想要说明白的东西,这个时候,我们就需要借助一些工具来将我们所绘制的东西拷贝到我们的电脑上。拍照么?太 Low 了,而且会出现很多不必要的元素。

这里我为你介绍我所使用的工具, Readdle 所推出的 Scanner Pro(你也可以使用扫描全能王、印象笔记的扫描宝软件,三者的功效大体相同),这里我使用印象笔记推出的扫描宝(它既有 Android 也有 iOS)来做演示。

首先,将你所绘制的内容放在一个有较大反差的平面上,然后拿起手机,打开软件,俯视对准你所绘制的内容。

软件会自动识别文件的边缘,并对扫描到的文件进行锐化处理,确保文字的清晰,最终可以得到这样的一张的图片。

对图片进行简单的裁剪的处理后,我们就可以得到自己想要的东西了。

借助扫描工具,可以让我们用手绘来产生我们需要的图片而不需要购买专门的扫描仪。

关于存图

本地存储 or 网络存储

根据你写作的工具不同,你针对的存储方式有所不同,一般来说,我们使用 Word 进行写作的时候,我们的图片就直接嵌入在 Word 中,不过如果你使用的是 Markdown 编辑器,一般情况下,我们需要将图片存放网络上方便我们使用 Markdown 的语法引用。

具体使用什么样的存储方式根据你的写作工具来定义即可。比如说,我使用 Ulyssess 写作,图片就会存放在 Ulyssess 中。

自建图床 or 外链图床

既然图片需要存放在网络上,就涉及到一个问题,你的图片是自建一个图床,还是用别人提供的外链图床。

对于绝大多数人来说,可能选择的都是外链图床,但是我建议你,使用自建图床,使用自建图床可以避免外链图床突然收紧链接规则,从而导致你的图片无法访问,从而你需要做多次工作。

好在目前有一些工具,可以帮助我们更加方便的自建图床。

iPic

我用的笔记本是 MacBook Pro,我用的图床工具是 iPic 。

iPic 通过简单的配置,就可以实现快捷键将图片上传到自建的图床(阿里云 OSS、又拍云、七牛云等)。

具体的配置细节,我就不在这篇文章中讲解,大家可以前往其官网查看:https://toolinbox.net/iPic/

Pic Go

macOS 用户可以使用 iPic,Windows 和 Linux 用户也无需担心,你们也有类似的工具,在 Github 上开源了一个项目:Picgo,你可以使用 PicGo 实现类似的功能。

具体的使用说明,你可以查看其项目主页:https://github.com/Molunerfinn/PicGo

关于贴图

在完成了

总结

在这篇文章中,我们从 「选图」、「做图」、「存图」 三个方面讨论了关于文章的配图;学习了如何找可以免费商用的图片,如何绘制自己的平台,如何将图片传到云端。

提问

除了 PicGo 和 iPic ,你是否知道还有什么工具可以帮助我们更好的传图片呢?

results matching ""

    No results matching ""