单页站真的对SEO友好吗？一个老站长的实战复盘
去年有个客户，非要把一个好好的多页站改成单页。我说行吧，你出钱你说了算。结果三个月后流量跌了40%，他来找我，一脸懵。我说我当初怎么跟你说的——唉，不提了。单页站（SPA）这东西，看着酷，交互爽，但在SEO面前就像个穿西装打领带的哑巴，谷歌想跟你聊两句，它干瞪眼。单页站最大的问题不是技术，是认知偏差。很多人以为只要页面内容能渲染出来，SEO就没事了。错。大错特错。谷歌的爬虫再聪明，它也有个‘预算’，它不会无限等你那个笨重的JS执行完。有时候它只爬个空壳子就走了，然后你的排名就开始跳水。
https://obgeo.oss-cn-beijing.aliyuncs.com/pvc-articles/6f537d3e-7d3a-4422-9610-c3570cd7d10b.jpg
谷歌爬虫抓取单页站JavaScript渲染延迟示意图
SPA的坑，我踩了三年
https://obgeo.oss-cn-beijing.aliyuncs.com/pvc-articles/5c2fc395-83ad-4bbe-910d-b02e208d3399.jpg
SPA的坑，我踩了三年
2019年我接了一个项目，用Vue搭了个单页站，那时候年轻气盛，觉得前后端分离才是未来。结果呢？谷歌虽然宣布能执行JS了，但实际抓取和索引慢得让人抓狂。一个页面提交了sitemap，两周后才被索引，而且快照里还是Loading动画。我当时就拍桌子了——这怎么玩？
后来我发现，问题出在异步数据加载上。爬虫访问你的URL，服务器返回一个空HTML，然后JS去请求API拿数据，再渲染到页面上。谷歌有时等一等，有时根本不等。就像你约了个朋友，他老说“马上到”，结果你等了半小时，他还没出门。你说气不气？
而且，单页站的URL结构通常很别扭。什么 /#/page，或者靠pushState模拟出来的路径。理论上谷歌能处理，但实测中经常出现索引混乱。一个内容被本应只有一个URL，结果谷歌给你整出三个版本，权重分散得一塌糊涂。所以别信官方文档，要信自己测出来的数据。
预渲染、SSR、还是动态渲染？
踩坑多了，就得找解决方案。现在主流就三条路：预渲染（Prerendering）、服务端渲染（SSR）、动态渲染（Dynamic Rendering）。说实话，没有银弹，得看你的项目情况和预算。
预渲染——适合内容不经常变的站。比如你这个月就更新一次，那用prerender-spa-plugin配合headless Chrome，把每个页面静态生成一份HTML，扔给爬虫看。优点是部署简单，缺点是你一旦要改内容，就得重新构建，而且页面一多，构建时间能让你怀疑人生。有一次我给一个三千页的单页站跑预渲染，整整跑了四个小时！四个小时啊！中间还无预兆断了一次，我可真是谢谢了。
SSR——用Next.js或Nuxt.js这类框架，每个请求都在服务端渲染出完整HTML。SEO效果最好，因为爬虫拿到的就是立即可读的内容。但成本也高：你得有个Node服务器，还得考虑缓存、负载均衡。而且，开发复杂度蹭蹭往上涨，哪个组件能跑在服务端，哪个只能在客户端，你心里得有本账。有个同事把window对象写在组件里，SSR直接报错，整站瘫痪，那场面……不说了。
动态渲染——是一种折中。你架一个中间层（比如Puppeteer或Rendertron），检测到爬虫请求时，就给它渲染好的静态版本，普通用户还是走正常的SPA。这种方案Google官方曾推荐过，但需要额外的服务器资源，而且有被判定为cloaking的风险。我试过，配置有点烦，但确实能快速解决索引问题。
https://obgeo.oss-cn-beijing.aliyuncs.com/pvc-articles/abb3eb66-ffae-4b17-bff8-1d643c5e8a31.jpg
单页站三种SEO解决方案架构对比图
我的建议？能不用单页站，就别用。如果非要用，尽量选SSR。除非你的网站根本不靠SEO吃饭，那你随意，关我啥事。
一个单页站逆袭的案例
https://obgeo.oss-cn-beijing.aliyuncs.com/pvc-articles/a16018a2-fecd-4c1e-b550-1571daf42839.jpg
一个单页站逆袭的案例
吐槽归吐槽，单页站也不是没有逆袭的时候。2021年我做了一个工具类网站，完全单页，连路由都没几个。本来只是想做个轻量应用，后来觉得可以接点广告，就开始搞SEO。当时心一横，上了全套SSR，结合静态生成，再把关键的meta标签、结构化数据做到极致。结果你猜怎么着？半年后，核心关键词全进谷歌前十。
我复盘了一下，除了SSR，还做了这几件事：
第一，链接结构扁平化。虽然只有几个页面，但每个重要页面都有从首页直接链接，而且用的是正经的a标签，不是onclick事件。别小看这一点，很多单页站链接靠JS动态绑定，谷歌不买账。
第二，拆分代码，加快首屏渲染。我把首屏需要的JS单独打包，其他懒加载。谷歌现在用Core Web Vitals作为排名因素，LCP（最大内容绘制）时间太长，排名直接受影响。我的LCP从4秒优化到1.2秒，排名明显上升。速度，就是正义。
第三，结构化数据要准要全。单页站因为没有传统页面切换，结构化数据容易被忽略。我在每个逻辑页面都用JSON-LD注入了对应的结构化数据，比如FAQ、Article，甚至还做了BreadcrumbList。谷歌搜索结果里的富文本卡片立刻就出来了，点击率猛增。
那个站现在每天UV两万多，广告收入够我买几台新Mac。但我要说，这不是单页站的胜利，而是在单页架构上强行补了SEO的课。要是当初直接用多页，可能早半年就起来了。
所以，单页站不是不能做，你得想清楚代价。要么你就别指望搜索流量，要么你就花钱花时间把SEO的坑填平。最怕那种心存侥幸的，“应该没问题吧”……每次听到这话我都想给过去一嘴巴子。
最后给句掏心窝子的话：做SEO，永远不要让技术炫技凌驾于内容可见性之上。搜索引擎的爬虫不是你女朋友，没耐心等你变魔术。 逻辑严谨，条理分明，一看就是经过认真思考和整理的内容。 每一条都很实用，已经记下来了，以后遇到类似问题就能用上。 经验很宝贵，尤其是亲身实践过的总结，比网上随便找的靠谱多了。 讲得很透彻，把复杂的问题简单化，理解起来轻松了很多。 很多细节都考虑到了，看得出来是真正懂行的人在认真分享。 楼主的经历很有参考价值，给了我很多新的思考方向，非常感谢。 说得很有道理，很多观点都说到点子上了，希望以后能多看到这类帖子。 看完楼主的分享感觉很有收获，感谢这么用心的整理，学到很多新知识。 虽然有些地方不太懂，但整体看完还是收获很多，慢慢消化一下。 讨论氛围很好，大家都在理性交流，这样的论坛环境太舒服了。 这样用心的帖子不多见，必须顶上去让更多人看到优质内容。 已经推荐给朋友来看了，好东西就应该一起分享一起学习。 非常同意楼主的看法，现实中确实是这样，很多人都忽略了这一点。 内容全面又细致，几乎把相关问题都覆盖到了，非常用心。
页:
[1]