更高效地做图文笔记/教程

前言

在一段尝试之后，我感觉在自己的网站上记笔记有着传统笔记不可比拟的优势。例如，我可以方便的截图，也能更快的把想要记的东西输入进去。还有，前者有着高度的便携性——我可以在坐公交或者空闲的时间看一看。但是后者，我不可能随身揣着一笔记本。就算在不能携带手机的情况下（现在除了学生几乎没有这种场景吧），也可以打印出来。此外，还有很多的优势就暂且不说。

当然，图文最浪费时间的还是在图上。因为要截图、压缩、上传、嵌入到文章中。我自己做完后面这三个步骤，就得花二三十秒，很是麻烦。

这篇文章，会推荐几个我认为很方便的工具/软件；也会大概提供一个思路，如何一键式压缩上传图片。

截图工具

如果你还在用 QQ 自带的截图工具的话，那建议你还是赶紧换换。它的优势在于：你有什么东西想跟你朋友分享，可以立即截图。但它不适合做笔记/教程用的图片。

我推荐的一款截图工具，叫做“Snipaste”。你可以随意的更改字体大小、随意的更改笔刷粗细，而不是固定的几个选项。如果某些图片上有的知识点不需要截图，但需要记录；或者做教程的时候，需要看着图片写步骤，你可以将它“贴在屏幕上”，类似于这样：

至于更多的操作，官方文档已经写得很清楚了。你可以去官方网站下载，并且自己按照文档体验一番。

压缩图片

我比较喜欢截一张不压缩的原图，但是这样体积又太大了。好在有一个叫做“TinyPNG”的网站，它压缩的图片体积能小很多，但是图片肉眼看起来不会有太大差别。比如，上一张图它有 3.8M 大小，但压缩后只有 64.1KB，几乎缩小了 98%。它有一个小要求：每次最多上传 20 张图片，每张不超过 5M。

不过 TinyPNG 真的是业界良心，它提供了 API 供我们使用，而且不限制图片大小及张数。你只要打开网站，点击上面的“Developer API”，按要求输入用户名和邮箱，即可获得“API Key”。如果你没记住也不要紧，只要登陆后点击右上角你的用户名，选择“Account page”，第一个引入眼帘的就是“API Key”。

GIF 录制/压缩

有时候，一张 GIF 更能让自己/别人理解的更透彻。这里我推荐的是一款叫做 ScreenToGif 的软件。我建议下载第一个 Msi 安装版，记得把 FFmpeg 勾选上，也就六十来 M 大小，但是导出的时候选择它，质量会好很多。使用很简单，自己摸索一两分钟就会用了，便不再赘述。

当然，GIF 肯定要比普通的图片要大，所以还得压缩。这里我推荐使用 docsmall 提供的 GIF 压缩服务。制作并压缩后，效果类似这样（用 FFmpeg 导出，原 GIF 大概 22M）：

（是小天使，我死了！）

图片上传

图片做好了，总得上传吧！但用 WordPress 自带的“媒体”效率好像过于低了点，所以还是推荐用图床——最好还是有 API 的。不管你是自己搭还是用别人的，API 会为你省去将近一半的时间。

用 Python 更方便的压缩图片

众所周知，官方文档还是很重要的。我是用 Python 写，所以就参考“PYTHON”部分了。

我的逻辑是这样的：把需要压缩的文件夹和压缩后存放图片的文件夹输入进去，等截到新的图后，按一个键自动压缩。这样就省去很多时间。当然，这只是我个人的习惯，如果喜欢覆盖原图直接覆盖即可~
Python 苦手者，写的好看不好看就不要追究了，能跑就行

写了两个函数，放在 functions.py 中：

import tinify
import os
import requests

def compress(img_path_list, output_path, api_key):
    '''传入图片路径和输出路径，压缩图片并存储。

    Args:
        img_path: list, 需要压缩的图片的列表。
        output_path: str, 压缩后图片存放路径。
        api_key: str, 申请到的 TinyPNG 的 API Key。
    
    Return:
        返回一个布尔值，来表示是否成功压缩。像是这样：
        True
    '''
    tinify.key = api_key

    total_num = len(img_path_list)
    compress_num = 1
    for img_path in img_path_list:
        print("compressing({}/{}): {}".format(compress_num, total_num, img_path))
        source = tinify.from_file(img_path)
        source.to_file(output_path+os.path.basename(img_path))
        compress_num += 1
        print("Done")
    return True

def auto_compress(img_path, output_path, api_key):
    '''有新的图片加入后，按下任意键自动压缩图片。
        
    Args:
        img_path: list, 需要压缩的图片的列表。
        output_path: str, 压缩后图片存放路径。
        api_key: str, 申请到的 TinyPNG 的 API Key。

    Return:
        没有返回值。
    '''
    old_img_list = []

    for root, dirs, files in os.walk(img_path):
        for name in files:
            old_img_list.append(os.path.join(root, name))

    print("Now you can add new image(s) to the path which you input.")

    while True:
        status = input("Press any key to compress, or n for exit: ")
        img_path_list = []
        for root, dirs, files in os.walk(img_path):
            for name in files:
                img_path_list.append(os.path.join(root, name))
        if status == 'n':
            break
        else:
            compress_list = [img for img in img_path_list if img not in old_img_list]
            print(compress_list)
            if compress(compress_list, output_path, api_key) == True:
                print("--------------- All new images have been compressed ---------------")
                for compressed_img in compress_list:
                    old_img_list.append(compressed_img)

再写了一个 main.py：

import functions

# 这里填入你申请到的 API
key = ""

# 路径可用"/"隔开，最后需用"/"结尾
# img_path 是未经压缩的图片路径
img_path = ""
# img_path 是压缩过的图片路径
output_path = ""

functions.auto_compress(img_path, output_path, key)

之后的流程：运行 main.py -> 截图 -> 按下任意键 -> 压缩成功。这样就省了一部分时间。

自动上传到图床

上一步只是自动压缩，如果压缩后能自动上传到图床，并返回一个链接或者一个写好的“<img>”标签，岂不美哉？

然而我照着我用的图床的 API 文档撸了二十分钟，也没传上去。可能是我姿势不对？这里只是提供一个思路，如果成功后再放代码。