大家好，我是大侠Luffy。

很久没写东西了，最近有了一点分享欲，虽然没啥人看文章了，不过记录本身就值得，同频的朋友不需要太多。

最近花了点时间给素材SoSo网站优化了一下SEO内容，在这里给大家分享一下思路。

素材soso的主要功能是提供素材搜索，只有一个主功能页面，单靠一个页面的话，是很难覆盖比较多的搜索关键词的，也不利于提升网站权重。

对于一个新站来说，增加内容页是实施SEO的一个关键。

自己写文章，这可能是首先最容易想到的一个土办法，高质量的原创文是搜索引擎想要的，但是这样的方法缺点也很明显：实施成本高。

直接用AI来写，或者采集一些别人的文章来伪原创这样的方式行不行呢？搜索引擎可能不会喜欢这样的内容，风险很高。

更重要的是，你还得让用户点击进来的页面应该是匹配到他的需求的，这样才可能会转化成真实用户，否则也没用。

基于以上的考虑，我最终想到的方案包括：

1. 增加一个博客文章模块，用来展示原创文章
2. 利用素材库的内容来做成素材合集

构建博客模块

由于网站的内容只是用于SEO的目的，所以博客系统越简单越好，尽量把开发成本降到最低。

在博客系统中，编辑器是最复杂的一个模块，我这里想了一个比较巧妙的办法，把写文章和渲染文章完全分离，避免了网站内再做一个编辑器的苦恼。

具体如下：

用 Visual Studio Code作为文章编辑器，使用 markdown 输出文章，配合内置Markdown Image插件，无痛上传和插入图片。

至于展示端就比较简单了，使用一个 markdown 转 html 的相关库，然后配合一个好看一些的 markdown css 库来展示文章。

以素材soso为例，采用的是SSR渲染方案，基于vue + vite + ssr构建，静态页面SEO更友好。

markdown 转 html 的库使用的是markdown it + front-matter，所以我们的markdown文章格式是这样子的：

---
title: seo 标题
description: seo的description信息
author: 文章作者
date: 文章创建日期
cover: 封面
---

markdown 格式的文章详情

渲染代码超简单：

/**
 * 加载文章内容
 */
export function loadArticle(file_name){

    let md_file = resolve(`blog/${file_name}.md`)

    const md_content = fs.readFileSync(md_file, 'utf-8')
    const artitle = fm(md_content)
    return {
        'title': artitle.attributes.title,
        'description': artitle.attributes.description,
        'date': artitle.attributes.date,
        'author': artitle.attributes.author,
        'cover': artitle.attributes.cover,
        'body': md.render(artitle.body)
    }
}

文章内容页面搞定后，还需要一个分页的列表页面，来承载所有的文章，这样才能更好让搜索引擎发现。

我的思路是在每次服务启动的时候，自动遍历markdown文章文件所在的目录，自动生成一个json文件，获取列表数据就直接读取这个文件到内存，文章数量不会太多，这样就完全够了，代码能少写点就少写些...

/**
 * 获取文章列表
 */
export function getArticleList(page, limit){
  const dirPath = resolve('blog');
  const list_json = fs.readFileSync(path.join(dirPath, 'list.json'), 'utf-8')
  const list = JSON.parse(list_json)
  const total = list.length
  const start = (page - 1) * limit
  const total_page = Math.ceil(total / limit)

  if(start >=  total){
    return {
        list: [],
        pageSize: limit,
        total,
        pageCount: total_page,
        currentPage: page
      }
  }

  const end = start + limit
  const result = list.slice(start, end)

  return {
    list: result,
    pageSize: limit,
    total,
    pageCount: total_page,
    currentPage: page
  }
}

生成文章文章列表的json文件：

const blog_list_file = 'list.json'

const __dirname = process.cwd()
const resolve = (p) => path.resolve(__dirname, p)

/**
 * 生成文章列表数据: 按日期前30条
 */
export function generateArticleListJson(){

  const dirPath = resolve('blog');
  const files = fs.readdirSync(dirPath).filter(file => path.extname(file) === '.md' && path.basename(file) !== '404.md');
  
  const list = []
  for(const md_file of files){
     const md_content = fs.readFileSync(path.join(dirPath, md_file), 'utf-8')
     const artitle = fm(md_content)
     list.push({
        'link': `/blog/${md_file.substring(0, md_file.lastIndexOf('.'))}`,
        'title': artitle.attributes.title,
        'description': artitle.attributes.description,
        'author': artitle.attributes.author,
        'date': artitle.attributes.date,
        'cover': artitle.attributes.cover,
     })
  }

  const result_list = list.sort((a, b) => b.date.getTime() - a.date.getTime()).slice(0, 30)

  fs.writeFileSync(path.join(dirPath, blog_list_file) ,JSON.stringify(result_list))
}

嗯，大概就是这样子，博客模块就完成了，可以轻松给网站添加博客文章了。

增加素材合集页

素材合集页的思路是基于网站本身可以利用的内容，来组合生成页面，这样内容产出的成本可以非常低，甚至可以让程序自动化去产出大量的内容，而且和使用搜索过来的人群匹配度高。

下面我给大家展示一下我的具体做法吧。

先来看看合集页最终效果：

不难看出，其中的主要元素有：

1. 像是“节日灯笼”，“户外健身”这样的标签关键词
2. 一句相关描述信息
3. 和标签相关的图片或视频图片

不难想到，标签和描述信息是AI擅长的事情，而标签匹配的相关图片，这正是素材soso擅长的事情：文字匹配图片。

于是，自动化产出素材合集页思路就有了。

首先，通过chatgpt或者deepseek来产出元标签和描述，例如：

帮我列举100个关于“节日”的图片素材种类的tag关键词和介绍描述信息（用于SEO目的），结果以json格式返回，格式为：[{"tag": "标签名", "description": "描述信息"}]

输出：

[
  {"tag": "春节", "description": "展示中国农历新年的庆祝活动，如舞狮、鞭炮、团圆饭等传统元素"},
  {"tag": "圣诞节", "description": "充满节日氛围的圣诞树、圣诞老人、礼物与家庭聚会场景"},
  {"tag": "万圣节", "description": "南瓜灯、化妆舞会、鬼怪服装和糖果主题的万圣节庆祝画面"},
  {"tag": "中秋节", "description": "描绘赏月、吃月饼和家庭团圆等中秋节文化习俗"}
....

拿到这个标签元数据后，调用素材soso内部的接口根据标签和描述信息，去获取相关的20张图片，作为合集页的图片，取其中第一张作为封面即可。

把这些数据录入数据表中即可，每个标签就是一个合集内容页，只需要数分钟，就可以制作几百个内容页面了，性价比非常高！

效果展示：

链接名

一个结构清晰的链接对于SEO也是有好处的，这里也给大家参考一下：

博客文章内容页面，后面的标题名其实就是博文markdown文件的文件名：

/blog/two_ways_add_pictures_in_article

素材合集链接：资源类型/标签名

/photos/节日灯笼

sitemap

对现代搜索引擎来说，sitemap 是否有必要，我也存疑。但还是顺手加上吧，也就是多几行代码的事情，而且有了之后，可以主动提交给搜索引擎。

我这里使用的是sitemap这个库，具体怎么做就不展开了，不复杂，可以自行研究一下。

收录结果

做完以上动作后，过了几天，Google 和 Bing 已经陆续收录相关页面了：

不过百度连主站链接都没有，主动提交过好几次，没啥反应，嗯还得是百度～ 反正，我是不会向交钱的！

接下来就交给时间了～

对于独立开发者来说，把产品做好就很不容易了，还要想办法获取流量。在条件有限的情况下，我们必须让事情尽可能简单和自动化，减少成本和精力的投入。

以上关于SEO的一些个人小动作，不一定做的对，但可能会给你提供一些思路。