🏗️ 第 02 层

建站层

Site Build & Technical SEO

技术地基，把站搭对（0 → 1）

📖 约 7 分钟 🕑 更新于 2026-06-18

建站层（Site Build & Technical SEO）解决一个问题：让搜索引擎能顺利地找到、抓取、理解并收录你的页面。它位于关键词研究之后、内容生产之前——你研究得再准、内容写得再好，如果爬虫读不到、URL 一团乱、页面慢到三秒还白屏，排名都无从谈起。好消息是：这一层是会写代码的人最有优势的战场。绝大多数「技术 SEO 问题」本质上就是配置文件、HTTP 头、HTML 标签和性能优化——你熟悉的东西。下面是这一层的速览大纲。

域名与主机（Domain & Hosting）

  • 是什么：域名是站点身份（Domain），主机/服务器决定页面响应速度与可用性（Hosting）。
  • 为什么重要：响应慢、频繁宕机会直接拉低抓取效率与用户体验；HTTPS 是基本排名信号。
  • 怎么做：
    • 选短、好记、与主题相关的域名；新域名没有「域名年龄」红利，但也没历史包袱。
    • 全站强制 HTTPS，并把 http:// 与无 www/有 www 统一 301 重定向到唯一版本，避免被当成多个站点。
    • 优先用带 CDN 和靠近目标用户机房的主机；首字节时间（TTFB, Time To First Byte）越低越好。

🧑‍💻 开发者视角：用 curl -I https://你的域名 看返回头。确认状态码是 200、有 strict-transport-security，且没有意外的 x-robots-tag: noindex。

网站架构（Site Architecture）

  • URL 结构：用语义化、小写、连字符分词的路径，如 example.com/seo/technical-seo，避免 ?id=123&cat=7 这类参数堆叠。
  • 层级（Hierarchy）：重要页面尽量在首页 3 次点击以内可达；层级越浅，权重传递与抓取越顺。
  • 内链与主题集群（Internal Links & Topic Cluster）：用一个「支柱页（Pillar Page）」统领某主题，再由若干「集群页（Cluster Pages）」围绕它互链，向搜索引擎表达主题权威性。
  • 怎么做：保持导航与面包屑（Breadcrumb）结构清晰，内链锚文本（Anchor Text）用描述性关键词，而非「点这里」。

💡 提示：把站点想象成一棵树。首页是树根，分类是树枝，文章是树叶——爬虫顺着内链「爬树」，断链就是断枝。

技术 SEO 清单

这是本层的核心。逐项对照：

项目作用关键点
robots.txt告诉爬虫哪些路径可抓放在站点根目录；别用它来「隐藏」页面，它不阻止收录
sitemap.xml列出希望被收录的 URL提交到 Google Search Console；只放可索引页
canonical指定重复内容的「正主」用 <link rel="canonical" href="..."> 指向首选 URL
hreflang多语言/多地区版本对应用 <link rel="alternate" hreflang="zh-CN" href="...">，需双向引用
结构化数据（Schema）让搜索引擎理解内容类型用 JSON-LD，可拿富媒体摘要（Rich Results）
  • 移动优先索引（Mobile-First Indexing）：Google 主要用手机版页面来索引和排名，确保移动端内容、结构化数据与桌面端一致。
  • 核心网页指标（Core Web Vitals）：LCP（最大内容绘制 ≤ 2.5s）、INP（交互到下次绘制 ≤ 200ms）、CLS（累积布局偏移 ≤ 0.1）。
  • 抓取预算与重复内容（Crawl Budget & Duplicate Content）：用 canonical、参数处理和合理的内链，避免爬虫把额度浪费在无意义的重复 URL 上。

robots.txt 最小示例（注意 sitemap 用绝对地址）：

User-agent: *
Allow: /
Disallow: /admin/
Sitemap: https://example.com/sitemap.xml

一段文章的结构化数据（JSON-LD）骨架：

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "技术 SEO 入门",
  "author": { "@type": "Person", "name": "你的名字" },
  "datePublished": "2026-06-18"
}
</script>

🧑‍💻 开发者视角：别手写这些文件出错。直接用本站的 robots/sitemap 生成器 和 Schema 生成器 生成，再用 Google 富媒体测试工具校验。

建站工具选型（CMS / Framework）

不同工具对 SEO 的「默认友好度」差别很大：

  • WordPress：生态成熟，Yoast/Rank Math 等插件把 meta、sitemap、Schema 都包了；缺点是性能要靠缓存与优化插件兜底。
  • Webflow：可视化建站，SEO 字段（title、canonical、hreflang）开箱可配，适合不想碰服务器的人；自定义逻辑受限。
  • Next.js：React 框架，支持 SSR/SSG，控制力最强；但要自己用 next/head、generateMetadata、动态 sitemap 路由把 SEO「补齐」，否则 CSR 默认对爬虫不友好。
  • Astro：以内容站为目标，默认输出静态 HTML、零多余 JS，天然契合 Core Web Vitals 与抓取，对博客/文档/SEO 站尤其顺手（本站即用 Astro）。

⚠️ 注意：纯客户端渲染（CSR）的单页应用，首屏 HTML 可能是空壳。优先选静态生成（SSG）或服务端渲染（SSR），让爬虫拿到完整内容。

📌 本层施工中

完整教程（含各项配置的逐步实操与代码示例）正在编写中，敬请期待。先用下面这份速查清单把地基打牢：

  • 全站强制 HTTPS，并把所有域名变体 301 到唯一首选 URL
  • 生成并提交 robots.txt 与 sitemap.xml（可用本站生成器）
  • 给关键页面加 canonical，给重复/分页内容理清归属
  • 用 JSON-LD 给文章、面包屑、组织信息加结构化数据
  • 跑一次 Lighthouse，确认 LCP / INP / CLS 三项达标