title标签须动态生成且每页唯一，长度50–60字符、核心关键词前置；meta description需含主词、≤155字符、无特殊符号；canonical必须用绝对url且指向有效页面；viewport、charset、lang三标签缺一不可。
title标签怎么写才不被搜索引擎降权
硬编码全站共用 <title>首页</title> 是最直接的降权信号。搜索引擎会认为你所有页面内容雷同，只索引首页甚至拒收其他页。
必须动态生成，且满足三个硬性条件：
-
<title></title>长度严格控制在 50–60 字符（含空格），超长会被截断为「无线蓝牙耳机|降噪旗舰|XX品牌…」 - 核心关键词前置，比如商品页写
<title>V60手冲咖啡教程｜水温粉水比实操指南｜前端茶馆</title>，而不是<title>前端茶馆｜V60手冲咖啡教程</title> - 每个页面唯一，CMS 或 SSR 框架里禁止写死，要用变量注入，如 Next.js 的
getStaticProps中传入title，模板里写<title>{{ title }}</title>
meta description 写了等于没写？常见失效原因
<meta name="description"> 不参与排名，但决定用户点不点你。写得不好，再靠前的排名也白搭。
真正失效的写法有这几种：
- 留空或复制正文前两句——爬虫可能直接忽略，搜索结果摘要变成随机截取
- 超过 155 字符，显示为「手冲咖啡入门指南：掌握水温、粉水比与注水节奏，3 步冲出干净明亮的风味…」，关键信息被省略
- 开头没嵌主词，比如写成「欢迎来到我们的咖啡教程网站！」，Google 可能不用它当摘要
- 用了中文引号「」、emoji 或 » 符号，部分爬虫解析失败，退而使用默认摘要
正确写法示例：<meta name="description" content="详解 V60 手冲咖啡三步法：水温控制、粉水比设定与分段注水节奏，附实测风味对比表。">
canonical 标签设错，等于主动放弃权重
URL 参数差异（/article?id=123 vs /article/123）、HTTP/HTTPS 混用、www 与非 www 版本并存，都会触发重复内容判定。不设或设错 <link rel="canonical">，轻则收录混乱，重则主页面被降权。
关键陷阱在 href 值：
- 必须是**绝对 URL**，
href="/article/123"是错的，href="https://example.com/article/123"才对 - 不能指向 404 页面，也不能指向跳转中的中间页（如 302 跳转地址）
- SSR/SSG 环境下必须动态输出，Next.js 用户别在 _app.tsx 里写死，要在页面级 getStaticProps / getServerSideProps 中根据当前路径生成
viewport、charset、lang 这三个基础标签漏一个就掉移动排名
它们不显眼，但缺一不可：
-
<meta charset="utf-8">缺失会导致中文乱码，爬虫可能误判为低质页面 -
<meta name="viewport" content="width=device-width, initial-scale=1">缺失，移动端页面缩放异常，Google 移动优先索引直接扣分 -
不写或写错（如lang="cn"），多语言站点无法被正确识别，影响 hreflang 联动和区域展示
注意：<meta name="robots"> 和结构化数据 <script type="application/ld+json"></script> 属于进阶项，先确保这三项写对再说。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
