我们是如何修复损坏的博客预览的
我在 X 上发布了我们博客的链接。预览图看起来不对劲。它显示的不是技术文章的图片，而是一个销售横幅。
我检查了我们最近的七篇文章。它们都显示着同一个销售横幅。我们的工程深度解析文章看起来就像广告。这损害了我们的公信力。
问题很简单。我们的代码中有一个回退规则。如果文章没有特色图片，它就会使用默认的销售横幅。由于我们没有为 42 篇文章设置特色图片，导致每篇文章都使用了同一张图片。
我们有两个选择：
- 方案 A：手动创建 42 张图片。这非常耗时，并且每发布一篇新文章都会增加额外的工作量。
- 方案 B：构建一个动态图像生成器。它可以为每篇文章自动创建定制图片。
我们选择了方案 B。我们使用 PHP GD 构建了一个小型引擎。
以下是它的工作原理：
- 引擎根据需求创建 1200x630 的 PNG 图片。
- 它使用深色背景和文章标题。
- 它从数据库中提取标题。
- 在首次渲染后，它会将图片保存到磁盘。
- 随后的每一次请求都会直接提供缓存文件。这使得它的速度非常快。
在构建过程中，我们解决了两个具体问题：
语言支持：仅使用像 Inter 这样的拉丁字体会导致日语文本显示为方块。我们增加了一个检查机制，在遇到日语标题时切换为 Noto Sans JP。
视觉基调：像 Vercel 或 PlanetScale 这样的专业技术博客都使用简洁的深色卡片。我们模仿了这种风格，以建立读者的信任。
给你的核心经验：
- 检查你的社交媒体预览。使用工具检查你的 og:image 标签是否正常工作。
- 避免为每篇文章手动制作插图。这无法规模化。
- 使用简单的技术栈。PHP GD 加上磁盘缓存既轻量又高效。
- 考虑到多语言需求。务必包含一个支持完整字符集的字体。
你的博客图片代表了你的品牌。不要让默认的回退机制毁掉你的第一印象。