Hexo优化：速度与SEO

Hexo优化：速度与SEO

顾名思义，Hexo优化，原文章为在服务器上使用宝塔单独部署Hexo后来发现很鸡肋，干脆改成hexo优化

最后更新于2025-2-23

一.为网站增加网站地图

安装hexo-generator-sitemap插件

npm install hexo-generator-sitemap --save

在config.yml中配置：

sitemap:
    path: sitemap.xml

path后面的内容可以自己改，但是一般都是根目录下的sitemap.xml

安装后在每一次的构建后都会根据实际网站链接正常地图以便提交搜索引擎。

---

---

二.永久化网站链接

可以修改config.yml中的permalink，也可以使用abbrlink插件，下面是主要关于abbrlink的使用说介绍，因为我博客链接永久化就用的abbrlink：

abbrlink 是一个Hexo插件，用于为每篇文章生成一个简短且唯一的固定链接（URL）。它的主要目的是简化URL结构，使其更短、更易读，同时避免因文章标题过长或包含特殊字符导致的URL问题。

安装插件

npm install hexo-abbrlink --save

---

1. abbrlink 的作用

• 简化URL：默认情况下，Hexo会根据文章标题生成URL。如果标题较长或包含中文，URL会显得冗长且不友好。abbrlink 可以生成一个简短的、基于算法（如CRC16或CRC32）的唯一ID。
• 固定链接：即使文章标题发生变化，abbrlink 生成的链接也不会改变，这有助于保持外部链接的有效性。

---

2. abbrlink 的配置

在我的 _config.yml 中，已经配置了 abbrlink：

permalink: posts/:abbrlink.html
abbrlink:
  alg: crc32  # 算法：crc16(default) and crc32
  rep: hex    # 进制：dec(default) and hex

• permalink: posts/:abbrlink.html：表示文章的URL格式为 posts/唯一ID.html。
• alg: crc32：指定生成ID的算法为CRC32（比CRC16生成的ID更长，但更不容易重复）。
• rep: hex：表示生成的ID以十六进制形式显示（也可以选择十进制 dec）。

---

3. abbrlink 的工作原理

• 当创建一篇新文章时，abbrlink 会根据文章的标题或文件路径，通过CRC16或CRC32算法生成一个唯一的ID。
• 例如：
  • 如果文章标题是 Hello World，生成的ID可能是 8a58b（CRC32 + 十六进制）。
  • 最终的URL可能是：https://b.wihi.top/posts/8a58b.html。

---

4. abbrlink 的优点

• 短小精悍：生成的URL更短，易于分享和记忆。
• 唯一性：即使文章标题重复，生成的ID也不会重复。
• 稳定性：即使修改文章标题，URL也不会改变，避免外部链接失效。

---

5. abbrlink 的注意事项

• ID不可读：生成的ID是随机的，无法直接反映文章内容。如果您希望URL中包含关键词，可能需要手动调整。
• 算法选择：
  • crc16：生成的ID较短，但重复概率稍高。
  • crc32：生成的ID较长，但重复概率极低。
• 进制选择：
  • hex：生成的ID包含字母和数字（如 8a58b）。
  • dec：生成的ID只包含数字（如 12345）。

---

6. 如何手动设置 abbrlink

如果希望为某篇文章手动设置 abbrlink，可以在文章的Front Matter中添加 abbrlink 字段：

title: 我的文章标题
abbrlink: 12345

这样，这篇文章的URL将固定为 posts/12345.html。

---

7. 示例

假设您有一篇文章：

• 标题：我的第一篇博客
• 生成的ID：8a58b（基于CRC32 + 十六进制）
• 最终URL：https://b.wihi.top/posts/8a58b.html

---

8. 总结

abbrlink 是一个非常实用的插件，能够简化Hexo博客的URL结构，同时保持链接的稳定性和唯一性。如果对生成的ID不满意，可以尝试调整算法（crc16 或 crc32）或进制（hex 或 dec），或者手动设置 abbrlink。

---

---

三.配置自动将链接提交收录引擎

这里使用hexo-seo-autopush插件。

特点

• 自动化：在发布新文章时，自动将链接推送到搜索引擎。
• 简化操作：无需手动运行命令，适合懒人用户。
• 依赖API：需要配置搜索引擎的API密钥。

适用场景

• 如果您希望自动化提交链接，减少手动操作。
• 如果您主要关注Google、Bing、Baidu等主流搜索引擎。

安装与配置

1. 安装插件：

   npm install hexo-seo-autopush --save

2. 在 _config.yml 中配置：

   seo_autopush:
     enable: true
     engines:
       google: true
       bing: true
       baidu: true
     api_keys:
       google: your_google_api_key
       bing: your_bing_api_key
       baidu: your_baidu_api_key

---

---

四.优化博客中的图片链接

这里使用hexo-image-link 插件

作用

• 自动添加图片域名：如果您的图片存储在CDN或外部服务器上，插件可以自动为图片链接添加完整域名，避免图片加载失败。
• 提高图片加载速度：通过优化图片链接，确保图片能够快速加载，提升用户体验。

安装插件

npm install hexo-image-link --save

配置

安装后，在 _config.yml 中添加以下配置：

hexo_image_link:
  enable: true
  domain: https://your-cdn-domain.com  # 您的CDN域名

• domain：填写配置的CDN或图片存储的域名。

示例

假设图片路径是 /images/example.png，插件会自动将其转换为 https://your-cdn-domain.com/images/example.png。

---

---

五.自动添加nofollow标签

这里采用hexo-autonofollow

作用

• 添加 nofollow 标签：nofollow 是一个HTML属性，用于告诉搜索引擎不要追踪某个链接。这可以防止外部链接分散网站的权重。
• SEO优化：避免将权重传递给低质量的外部链接，提升您网站的SEO表现。

安装插件

npm install hexo-autonofollow --save

配置

安装后，在 _config.yml 中添加以下配置：

autonofollow:
  enable: true
  exclude:
    - https://trusted-site.com  # 信任的站点，不加nofollow

示例

如果文章中有外部链接：

<a href="https://example.com">外部链接</a>

插件会自动将其转换为：

<a href="https://example.com" rel="nofollow">外部链接</a>

---

---

六.压缩资源文件优化访问速度

这里使用hexo-all-minifier：

作用

在构建时自动压缩HTML、CSS、JavaScript和图片文件，减少文件大小，提升网站加载速度。

安装

npm install hexo-all-minifier --save

配置

在 _config.yml 中添加以下配置：

all_minifier: true

---

---

七.配置文章加密

这里使用：hexo-blog-encrypt

作用

为文章添加加密功能，只有输入正确密码的用户才能查看加密内容。

安装

npm install --save hexo-blog-encrypt

配置

在 _config.yml 中添加以下配置：

encrypt:
  enable: true
  default_password: your_default_password  # 默认密码
  encrypt_tags:
    - {name: tagName, password: tagPassword}  # 为特定标签设置密码

在文章的Front Matter中设置密码：

title: 加密文章
password: 123456

---

---

八.使用更强大的Markdown解析功能

这里使用：hexo-renderer-markdown-it

作用

替换默认的 hexo-renderer-marked 渲染器，提供更强大的Markdown解析功能，支持更多扩展语法（如脚注、表格、任务列表等）。

安装

1. 卸载默认渲染器：

   npm un hexo-renderer-marked --save

2. 安装新渲染器：

   npm i hexo-renderer-markdown-it --save

配置

在 _config.yml 中添加以下配置：

markdown:
  render:
    html: true
    xhtmlOut: false
    breaks: true
    linkify: true
    typographer: true
    quotes: '“”‘’'

---

---

目前就这么多了，如果还有的话会继续更新

完结撒花！

 

鸣心/Write