加载更多与分页混搭架构 "Load More" with Crawl-Friendly Pagination
一句话定义
在前端为用户提供点击"Load More（加载更多）"或下拉无缝加载的现代丝滑体验，同时在 HTML 代码底层为搜索引擎爬虫保留标准 <a href="?page=2"> 分页链接路径的双全设计。
打个比方 Analogy
给逛街的顾客修了一条不用抬腿的平缓自动步道（一路滑到底），同时在步道下方给推货车的管理员（爬虫）留好了每一层清晰标号的楼梯台阶。
岗位实战怎么做 In Practice
为什么纯 JS 的"点击加载更多"会让深层商品全部丢收录？因为 Googlebot 绝对不会去模拟点击你的 JS 按钮！如果一个分类有 200 个商品，默认只显示前 24 个，剩下 176 个商品如果在源码里没有 <a href=".../collections/shoes?page=2"> 链接引路，爬虫就看不到它们。
案例与避坑 Pitfalls
分页 Canonical 的世纪大错：千万不要把 ?page=2, ?page=3 的 Canonical 标签写成了指向第 1 页 /collections/shoes！每一个分页都必须使用自引用 Canonical（第 2 页指向第 2 页自己）。如果嫌第 2 页以后的标题跟第 1 页重复，只需在分页 Title 里加上 - Page 2 即可。