Astro SEO：如何让 Astro 网站在 Google 获得排名并被 AI 引用

快速测验

SEO 适合您吗？该如何开始？

第 1 题，共 4 题25%

人们会在 Google 上搜索您卖的东西吗？

会，我觉得会不会，这是新东西或非常小众我不知道

Astro SEO 就是把这份干净的 HTML 变成能获得排名的页面。Google 的JavaScript SEO 基础指南说明，JavaScript 网站会经历三个阶段（抓取、渲染、编入索引），并指出服务器端渲染或预渲染仍然是很好的做法，因为并非所有爬虫都能运行 JavaScript。Astro 默认就站在这个起点上。本指南逐项讲解其余设置，每一个行为都对照 Astro 官方文档核实过。顺带一提，你正在阅读的 sorank.com 网站就运行在 Astro 上。

Astro 对 SEO 友好吗？

从技术层面看，是的。Astro 在构建时把组件渲染成 HTML，并去掉 React、Vue 等框架通常会发送到浏览器的 JavaScript。这样就避开了我们在 JavaScript SEO 指南中描述的典型问题：空的 HTML 外壳、渲染后才出现的内容、不是真正锚点标签的链接。它也避开了单页应用的路由陷阱，因为 Astro 的每个路由都是一个真实的 URL，拥有自己的 HTML 文件。

Astro 不做的事情同样重要。它没有内置 SEO 插件，没有自动生成的 meta 描述，没有自动的 canonical 标签，也没有结构化数据。下表区分了你免费获得的部分和需要自己搭建的部分。

静态渲染还是服务器渲染：哪种模式更利于 SEO？

Astro 关于按需渲染的文档写得很清楚：默认情况下，页面、路由和 API 端点都会在构建时预渲染为静态页面。就 SEO 而言，静态输出是最稳妥的默认选择：每个 URL 都是一个现成的 HTML 文件，由 CDN 分发，速度快，对每位访客和每个爬虫都完全一致。

按需渲染（服务器端）需要为你的托管平台安装适配器（例如 Node、Netlify、Vercel 或 Cloudflare）。之后可以用 export const prerender = false 让单个路由退出预渲染，或者用 output: 'server' 切换整个项目，再把静态页面逐个开启回来。两种模式都输出完整的 HTML，所以 Google 看到的内容相同。差别在别处：

• 速度：静态文件立即返回；服务器渲染的页面取决于服务器响应时间，这会影响 Largest Contentful Paint。
• 时效：服务器渲染适合持续变化的页面（库存、价格、搜索结果），这类页面每次重新构建整个网站太慢。
• 工具：部分集成（例如站点地图）看不到服务器端的动态路由（见下文）。

实用原则：营销页面、博客文章和文档保持静态，只对需要实时数据的路由使用按需渲染。Astro 文档给出的建议相同：在大多数页面都需要按需渲染之前，保留默认的静态模式。

如何在 Astro 中设置 meta 标签和 canonical URL？

创建一个 SEO 组件（通常叫 BaseHead 或 Seo），并在每个布局的 head 中引入。它接收标题、描述、可选图片和可选的 noindex 标记，然后输出：

1. title 标签，每页唯一，主关键词靠前；
2. meta 描述，为每页手写（它就是你在搜索结果中的摘要）；
3. canonical 标签，由 Astro.url.pathname 和配置中的 site 值拼成绝对 URL；
4. Open Graph 和社交标签（标题、描述、图片、URL），用于链接预览；
5. 当页面不应被编入索引时，输出 robots meta 标签。

先在 astro.config.mjs 中设置 site 选项：canonical、站点地图和社交标签都依赖它。然后选定一种 trailingSlash 策略（'always' 或 'never'）并坚持执行，避免 /blog/post 和 /blog/post/ 作为同一页面的两个版本互相竞争。canonical 中应去掉查询参数，防止跟踪参数产生重复页面。

如何用 Astro 生成站点地图和 robots.txt？

使用@astrojs/sitemap 文档页介绍的官方集成。运行 npx astro add sitemap 即可安装并写入配置。它要求设置 site 选项，构建时会生成一个 sitemap-index.xml 文件，指向编号文件（sitemap-0.xml，大型网站还会有更多）。每个文件默认最多 45,000 条，由 entryLimit 选项控制。如果你对这种格式还不熟悉，可以看看我们关于 XML 站点地图的术语解释，了解 Google 如何使用它。

有三项设置对 SEO 很重要：

• filter：一个接收每个页面 URL 的函数；对感谢页、站内搜索、草稿以及带 noindex 的页面返回 false，让站点地图只列出可编入索引的 URL。
• i18n：把语言目录映射到语言代码，并为每条记录添加 hreflang 替代链接。
• customPages：添加集成无法自行发现的 URL。

至于 robots.txt，大多数网站在 public 目录放一个静态文件就够了。如果测试环境和生产环境的内容不同，可以改用端点生成（src/pages/robots.txt.ts）。无论哪种方式，都要加一行指向 sitemap-index.xml 的 Sitemap，并在上线前用 robots.txt 检查工具测试结果。同样的端点方法也能生成 llms.txt 文件；我们的llms.txt 文件安装指南详细介绍了它的内容。

如何在 Astro 中处理 hreflang 和多语言网站？

Astro 内置的 i18n 路由负责 URL 部分。在配置中声明 defaultLocale 和 locales 列表，并决定默认语言是否也加前缀（prefixDefaultLocale）。getRelativeLocaleUrl 等辅助函数用于生成本地化链接，Astro.currentLocale 则告诉每个页面当前语言。

路由指南没有涉及 head 中的 hreflang 标签，所以要计划在 SEO 组件中自己编写：每个页面为每个语言版本输出一个 alternate 链接，再加一个 x-default，全部使用绝对 URL，而且每个版本都必须列出所有其他版本（双向链接）。用与路由相同的语言列表生成这些标签，可以避免最常见的错误：替代链接指向不存在的页面。想在几个 URL 上检查逻辑，可以用我们的 hreflang 生成器输出某个页面的完整标签组。随后再开启站点地图的 i18n 选项，作为第二个信号。

图片和岛屿架构如何影响速度与 Core Web Vitals？

速度是 Astro 优势最大的地方，这一点会体现在 Core Web Vitals 上。Astro 图片指南介绍了 astro:assets 中的 Image 组件：它会优化本地图片、转换格式、添加延迟加载和异步解码，并且自动推断图片尺寸以避免 Cumulative Layout Shift。该组件强制要求 alt 属性，这正是图片 SEO 的一条基本规则。Picture 组件更进一步，可提供 AVIF 或 WebP 并带有回退格式。

还有两个习惯值得养成。需要优化的图片放在 src 中（public 中的文件会原样输出，不做处理）。页面顶部的主图不要延迟加载，应立即加载，以免拖慢 Largest Contentful Paint。

岛屿架构让 JavaScript 始终可控。组件在你添加客户端指令之前都是静态 HTML：client:load 立即激活，client:idle 在浏览器空闲时激活，client:visible 只在进入可视区域时激活。只对必须即时响应的部分（菜单、购物车）使用 client:load，是保护 Interaction to Next Paint 最简单的方法。服务器岛屿（server:defer）则在缓存页面之后加载个性化区块，不会拖慢主要内容。

如何为 Astro 网站添加结构化数据？

Astro 没有专门的 schema 功能，这反而让你完全掌控。为每种页面类型（Article、Product、Organization、BreadcrumbList、FAQPage）构建一个 JavaScript 对象，输出到类型为 application/ld+json 的 script 标签中，配合 set:html 指令和 JSON.stringify，避免 JSON 被转义。数据来源应与可见页面相同的 frontmatter 或集合数据，这样标记始终与用户看到的内容一致，这也是 Google 关于 schema 标记的准则要求。

要为新的页面类型起草 JSON，可以用我们免费的 schema 生成器得到一个有效的起始代码块，再改成模板。每次修改模板后，用 Google 的富媒体搜索结果测试检查一批构建好的页面。

迁移到 Astro 时如何处理重定向？

从 WordPress 或 Next.js 迁移是 Astro 网站风险最高的时刻。保留所有带来流量或外链的 URL，其余页面逐一用永久重定向指向最接近的对应页面，具体做法见我们的 SEO 重定向指南。

Astro 配置接受一个 redirects 对象，把旧路径映射到新路径。使用适配器时，它们会成为真正的 HTTP 重定向。在纯静态构建中，Astro 会改为生成带 meta refresh 的 HTML 页面，Google 会跟随，但视其为比服务器端 301 更弱的信号。静态网站应在托管平台的格式中声明重定向（Netlify 或 Cloudflare Pages 用 _redirects 文件，Vercel 用 vercel.json 文件），让爬虫收到真正的 301。

Astro 如何同时帮助 SEO 和 GEO？

想被 ChatGPT、Perplexity 或 Gemini 引用，首先要可读。许多 AI 爬虫只获取原始 HTML，不执行 JavaScript，因此像 Astro 默认这样在第一次响应中就交付全部文字的网站，消除了客户端渲染网站仍然存在的障碍。清晰的小标题、开门见山的段落、结构化数据和 llms.txt 文件，会让每个页面更容易被引用。

上线之后，要靠数据而不是猜测。Sorank 的 GEO 与 SEO 仪表盘汇总你的 Search Console 数据和来自 AI 助手的访问，帮你确认新网站是否保住了排名。

技术质量只有配合可排名的内容才会产生回报。Sorank 的 AI 博客文章生成器撰写并发布针对 Google 和 AI 助手优化的文章，并可通过 webhook 连接 Astro 项目这类定制网站。

Astro 默认提供快速、可抓取的 HTML；排名仍取决于你额外添加的 head 标签、站点地图、hreflang、结构化数据和重定向。先搭好共享 SEO 组件和站点地图，上线前再对照上面的表格逐项检查。