第15章 Docusaurus 搜索引擎优化（SEO）指南

Version: 2.x搜索引擎优化（SEO） Docusaurus 提供了多种方式支持搜索引擎优化。 全站元数据 通过站点配置为整个网站提供全局 meta 属性。这些元数据会以键值对的形式渲染在 HTML 的 中，其中属性名和值分别对应键和值。 docusaurus.config.js module.exports = { themeConfig: { metadata: [{name: 'keywords', content: 'cooking, blog'}], // 在生成的 HTML 中会呈现为 }, }; Docusaurus 默认会添加一些元数据。例如，如果你配置了 i18n，系统会自动生成 hreflang 备用链接。 如需了解更多 meta 标签类型，请访问 MDN 文档。 单页元数据 与全局元数据类似，Docusaurus 也允许为单个页面添加 meta 信息。请按照指南配置 标签。简而言之： my-markdown-page.md # A cooking guide Some content... Docusaurus 会自动为每个 Markdown 页面添加 description、title、canonical URL 链接以及其他有用的元数据。这些都可以通过 front matter 进行配置： --- title: 用于搜索引擎的标题；可以与实际标题不同 description: 本页面的简短描述 image: 社交媒体卡片中显示的缩略图 keywords: [描述, 主要, 主题, 的, 关键词] --- 在创建 React 页面时，在 Layout 中添加这些字段也能改善 SEO。 提示：对于 description 和 keywords 等字段，建议优先使用 front matter。Docusaurus 会自动将其同时应用于 description 和 og:description；而使用 标签时需要手动声明两个元数据标签。 对于 JSX 页面，可以使用 Docusaurus 的 组件。 my-react-page.jsx import React from 'react'; import Layout from '@theme/Layout'; import Head from '@docusaurus/Head'; export default function page() { return ( {/* ... */} ); } 小提示：为了方便起见，默认主题的 组件支持通过 props 传入 title 和 description。 静态 HTML 生成 Docusaurus 是一个静态网站生成器——它会为每个 URL 路由预先生成 HTML 文件，方便搜索引擎更容易地抓取你的内容。 图片 meta 描述 图片的 alt 标签用于告诉搜索引擎这张图片的内容，并在图片无法正常显示时派上用场，比如使用屏幕阅读器时，或图片加载失败时。Markdown 原生支持 alt 标签。 你还可以为图片添加 title——它对 SEO 影响不大，但会在鼠标悬停时以提示框形式显示，通常用来提供说明信息。 
http://localhost:3000 丰富的搜索信息 Docusaurus 博客开箱即用地支持富搜索结果，以获得最佳的搜索引擎展示效果。这些信息会根据你在博客或全局配置中的 meta 信息自动生成。要享受富搜索信息的优势，请填写文章的发布日期、作者、图片等信息。点击这里了解更多 meta 信息的细节。 Robots 文件 robots.txt 文件用于规范搜索引擎的行为，指定哪些内容可以被抓取、哪些不可以。你可以把它作为静态资源提供。下面这个例子允许所有请求访问所有子页面： static/robots.txtUser-agent: *
Disallow:

关于 robots 文件的更多信息，请参考 Google 官方文档。

警告 · 重要：robots.txt 文件并不能阻止 HTML 页面被索引。若要阻止整个 Docusaurus 网站被索引，请使用 noIndex 站点配置。部分托管服务商可能还支持配置 X-Robots-Tag: noindex HTTP 响应头（GitHub Pages 不支持此功能）。若要阻止单个页面被索引，请使用 作为页面元数据。关于 robots 元标签的详细说明，请查阅相关文档。

站点地图文件

Docusaurus 提供 @docusaurus/plugin-sitemap 插件，该插件已默认包含在 preset-classic 预设中。执行生产构建后，它会自动生成 sitemap.xml 文件，路径为 https://example.com/[baseUrl]/sitemap.xml。该站点地图元数据有助于搜索引擎爬虫更准确地抓取网站内容。

提示：sitemap 插件会自动过滤包含 noindex robots 元指令的页面。例如，/examples/noIndex 未包含在 Docusaurus 的 sitemap.xml 文件中，因为其页面元数据中包含以下代码：

可读性链接

Docusaurus 默认使用文件名生成链接，但你可以通过设置 slugs 随时更改，具体细节请参考本教程。

结构化内容

搜索引擎依赖 HTML 标记（如

、 等）来理解网页结构。Docusaurus 渲染页面时，会使用语义化标记（如