个人静态站 SEO 与性能优化全指南：让内容被搜到、打开快

很多人以为「SEO 是大厂的游戏」，个人站随便写写就行。但恰恰相反：个人站没有平台流量加持，每一个技术细节都在决定你的文章能否被搜到、被打开、被读完。本文不讲玄学，只讲能落地的文件与标签，全部基于本站真实实践。

一、收录三件套：robots / sitemap / 规范化

1. robots.txt

给爬虫指路，明确哪些可以抓、哪些必须跳过。

User-agent: *
Allow: /
Disallow: /assets/
Disallow: /*?v=
Sitemap: https://YOUR_DOMAIN/sitemap.xml

2. sitemap.xml

告诉搜索引擎你的完整站点地图，尤其利于新站快速收录。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url><loc>https://YOUR_DOMAIN/index.html</loc><priority>1.0</priority></url>
  <url><loc>https://YOUR_DOMAIN/blog/nginx-high-performance.html</loc><lastmod>2026-08-29</lastmod></url>
</urlset>

3. canonical：声明唯一权威版本

同一个页面如果有多个入口（带参数、大小写、尾部斜杠），用 canonical 声明谁才是「正主」，避免权重被稀释。

<link rel="canonical" href="https://YOUR_DOMAIN/blog/nginx-high-performance.html">

二、每个页面都该有的 head 标签

<title>文章标题 — 站点名</title>
<meta name="description" content="一句话概括，含核心关键词，50~160 字">

<!-- Open Graph：社交分享卡片 -->
<meta property="og:title" content="...">
<meta property="og:description" content="...">
<meta property="og:type" content="article">
<meta property="og:url" content="...">

<!-- 移动端必备 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#070b14">

description 直接决定搜索结果摘要，认真写；og: 系列让文章转发到微信/微博时呈现好看卡片，是免费的传播入口。

三、结构化数据：让搜索结果显示得更「高级」

用 JSON-LD 给搜索引擎「讲清楚」页面类型。博客文章用 Article 类型：

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "文章标题",
  "datePublished": "2026-08-29",
  "author": { "@type": "Person", "name": "TechPulse" },
  "description": "文章描述"
}
</script>

面包屑导航（BreadcrumbList）结构也值得加——它让搜索结果里出现「首页 › 博客 › 本文」的层级，点击率明显更高。

四、Core Web Vitals：三个数字决定体验分

4. 静态站最容易踩的两个坑

• 外链字体/脚本：Google Fonts、CDN 图标库在国内既慢又可能被墙。字体用系统字体栈，资源全部本地化。
• 无尺寸的图片：<img> 不给 width/height，图片加载瞬间布局跳动，CLS 直接爆表。QR 码、缩略图务必写死宽高。

五、内链与内容：被搜到之后，靠它留下用户

• 每篇文章末尾放「相关阅读」，把同一主题串成网状（利于爬虫抓取全站）。
• 标题层级只用 h1 → h2 → h3，一个页面只有一个 h1。
• URL 用语义化 slug（如 blog/nginx-high-performance.html），比 ?id=123 友好得多。