#站内 SEO 基本功：TDK、H1-H3 结构、图片 Alt、后端渲染与 Canonical

这是我在《出海 AI 工具站进阶》系列里写的第 7 篇。前几篇解决了”做什么、值不值得做”，从这一篇开始解决”怎么做出来”。先把页面基本功打牢——搜索引擎看不懂的页面，再好也白搭。

先给你结论： 一个 SEO 友好的页面 = 写好的 TDK + 清晰的 H1/H2/H3 结构 + 带 Alt 的大图 + 纯后端渲染 + 唯一的 Canonical URL。不管工具页还是内容页，这五件事都是标配。

#先想清楚：用户搜这个词，到底想要什么

做站内优化之前，先回到需求本身：用户在搜索引擎里搜这个关键词，到底是想找什么？ 内容？工具？服务？商品？还是别的？

分析清楚用户的真实需求，才知道这个关键词到底该做一个什么页面来承接流量——是给内容，还是给工具。这是站内优化的起点。

Title（网页标题）是搜索引擎判断网页主要内容最重要的参考之一。很多时候我们说的 SEO 优化，其实就是如何写好网页标题。

而且标题会直接出现在搜索结果里，写好它还能吸引用户点击。

网页标题直接出现在谷歌搜索结果中

很多大站（比如豆瓣）标题很简单，就是”电影名 + 站名”，那是因为它已经权重够高了。如果我们做的是新站，就应该分析用户对每一个主题到底关心什么，把用户可能会关心、且有搜索流量的词都拼进标题里。

新站标题可以拼上用户关心的词：主演、评分、票房

豆瓣把没写进标题的内容放进了 Description

写完 TDK，看看它在实际搜索引擎里的样子（百度、谷歌大同小异）。

TDK 在搜索引擎中的展示效果

一个 HTML 网页，除了写好的 Title 和 Description，最重要的就是让整个网页结构清晰，有明显的 H1、H2、H3。

一个网页只能有一个 H1。Title 是给搜索引擎看的，H1 是给用户看的，但搜索引擎同样会参考 H1 来做内容评判，最终给不给你排名、排第几，很多时候就是 H1 和 Title 决定的。

一页一个 H1，既给用户看也供搜索引擎参考

H2、H3 是一个完整语义化 HTML 必不可少的部分，一页可以有多个 H2 和 H3。

H2 H3 构成清晰的层级结构

img 标签要有 alt 属性，图片用大图

一个典型网页结构长这样：h1 → h2 → p → h3 → p → h3 → p → h2 → p → h3。不管你是工具页面还是内容页面，都需要有 TDK 和 H1 H2 H3 P IMG。

有一点一定要注意：以上所有内容都要直接在 HTML 代码里体现出来，而不能是前端渲染。

也就是说，打开网页右键查看源代码，要能看到这些内容。这样搜索引擎爬虫抓取网页时，也能抓到。

虽然搜索引擎的确有时候能解析前端 JS 触发渲染，但这需要更多算力资源，凭什么给我们的新网站用？所以新网站，老老实实后端渲染。

每个网页有可能会有多个 URL 能打开，但我们需要在 head 里通过 canonical 让搜索引擎知道当前网页正确且唯一的 URL。

举例，微信 App 在苹果 App Store 的页面，虽然我们可以通过多个 URL 打开它（有的带参数、有的带后缀），但不管用哪个 URL 打开，苹果官方用 canonical 指定的规范且唯一 URL 都是同一个。

有些网站同时支持 www 和裸域名、http 和 https，也需要用 canonical 告诉搜索引擎官方指定的规范 URL。否则在搜索引擎看来就有多个网址打开重复内容，这既会分散权重，严重时会导致不收录。

同一个页面多个 URL 打开，canonical 统一指认规范地址
前端渲染也一样会让搜索引擎认为多个网页内容重复。