rel="alternate"不会自动跳转，仅向搜索引擎声明替代资源；真正跳转需服务端302重定向或前端js执行window.location.href，且多语言页面必须双向使用绝对url和bcp 47格式hreflang值。
rel="alternate" 不会自动跳转，别指望它做重定向
加了 link[rel="alternate"] 标签，用户访问 PC 页面时并不会跳去移动版或中文页——浏览器根本不解析它的跳转意图。这个标签只对搜索引擎、阅读器或 RSS 订阅器有意义，不是给用户看的指令。
常见错误是写成这样：
<link rel="alternate" media="only screen and (max-width: 640px)" href="https://m.example.com/">
这行代码在 Chrome/Firefox/Safari 中完全被忽略。media 属性仅用于匹配设备能力，不触发任何行为。真正跳转必须靠服务端 302 或前端 JS 执行 window.location.href。
多语言页面必须双向声明 hreflang，且全部用绝对 URL
要让搜索引擎识别中英文页面互为替代版本，两页都得写 link[rel="alternate"][hreflang]，且内容严格对称：
- 英文页需声明：
<link rel="alternate" hreflang="en" href="https://example.com/en/">和<link rel="alternate" hreflang="zh" href="https://example.com/zh/"> - 中文页也得反向写一遍：
<link rel="alternate" hreflang="zh" href="https://example.com/zh/">和<link rel="alternate" hreflang="en" href="https://example.com/en/"> -
href必须是绝对 URL，/zh/这种相对路径在 CDN 或子路径部署下会失效 -
hreflang值必须是 BCP 47 格式，如zh-Hans、en-US，不能写zh-cn（小写连字符）或Chinese
rel="alternate" 用于 RSS 或主题切换时，type 和 title 很关键
当用 link[rel="alternate"] 提供 RSS 订阅源时，type 和 title 缺一不可：
<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="/feed.xml">
Firefox 地址栏才会显示 RSS 图标；没有 type，浏览器就当普通链接处理。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
用于可切换样式表（比如夜间模式）时，必须配合 JS 控制 disabled 属性：
- 主样式表：
<link rel="stylesheet" href="main.css"> - 备用样式表：
<link rel="alternate stylesheet" title="Dark" href="dark.css"> - JS 激活：
document.querySelector('link[title="Dark"]').disabled = false
注意：rel="alternate stylesheet" 和 rel="stylesheet" 是两种独立类型，不能混用。
容易被忽略的细节：位置、拼写、缓存和服务器响应头
link 标签必须放在 内，写在 里会导致部分功能失效（比如 rel="preload" 被忽略、Safari 不加载 rel="icon"）。
常见低级错误包括：
-
rel拼错成alernate或漏写 - 多语言页漏掉自身声明（每页都要包含
hreflang="x-default"或对应语言的 self-link） - CDN 缓存了旧 HTML，导致新加的
hreflang长时间不生效 - HTTP 响应头里写了
Link字段，但内容和 HTML 中的link不一致，整组被搜索引擎降权
真正决定“用户看到哪个版本”的，从来不是 link 标签本身，而是你有没有在服务端判断 User-Agent，或者在 JS 里写了那行跳转逻辑。标签只是告诉搜索引擎“它们有关联”，不是发号施令的开关。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
