前端SEO处理

TDK设置

title

基础描述
- 内容分隔符一般有-,_和空格
  - _对百度比较友好
  - -对谷歌比较友好
  - 空格英文站点可以使用，中文较少使用
- 内容长度上，一般pc端大概30个中文，移动端大概20个，超过则会截断为省略号
参考格式
- 首页：网站名称或者网站名称_提供服务介绍or产品介绍
- 频道页：频道名称_网站名称
- 文章页：文章title_频道名称_网站名称
示例代码
```
SEO优化实战 - 腾讯Web前端
```

description

基础描述
- 不影响网页权重值，只用做搜索结果摘要的一个选择目标
- 长度pc端大概为78个中文，移动端为50个，超过则会截断为省略号
示例代码

keywords

基础描述
- 因为以前被seo人员过度使用，所以现在对这个进行优化对搜索引擎是没用的。
示例代码

网站内容

结构布局

控制首页链接数，控制在100个以内
扁平化网站结构，三层目录结构
- 从首页跳转，最多两次跳转就能够到达任意页面
应用面包屑导航

页面编码

标签使用

设置alt说明
设置title链接描述

用H1~H5标签做内容标题

用，突出强调，表达重要内容

使用
时，用
定义表格标题

使用html5语义化标签（header, footer, section, aside, nav, article）

尽少使用</code></p> </li> <li> <p>不乱用<code><br></code></p> </li> </ul> </li> <li> <p>编码注意</p> <ul> <li> <p>每个页面都设置唯一h1标题</p> </li> <li> <p>重要内容不要用JS输出</p> </li> <li> <p>重要的HTML内容代码放在最前面</p> </li> <li> <p>谨慎使用<code>display：none</code>，爬虫会过滤掉这一部分</p> </li> <li> <p>对不需要跟踪爬行的链接，<code><a></code>标签设置<code>nofollow</code></p> </li> <li> <p>精简代码，切记用过于复杂的代码</p> </li> </ul> </li> </ul> <h3 id="robots">robots</h3> <h4 id="robots文件">robots文件</h4> <ul> <li> <p>robots.txt放在站点根目录</p> </li> <li> <p>搜索引擎蜘蛛访问网站时，会第一个访问robots.txt文件</p> </li> <li> <p>用于指导搜索引擎蜘蛛，禁止抓取网站某些内容或只允许抓取哪些内容</p> </li> </ul> <h4 id="robots规则">robots规则</h4> <ul> <li> <p><code>#</code>表示注释</p> </li> <li> <p>User-agent 表示以下规则适用哪个蜘蛛，*表示所有</p> </li> <li> <p>Disallow 表示禁止抓取的文件或目录，必须每个一行，分开写</p> </li> <li> <p>Allow 表示允许抓取的文件或目录，必须每个一行，分开写</p> </li> <li> <p>Sitemap 表示站点XML地图，注意S大写</p> </li> </ul> <h4 id="示例代码">示例代码</h4> <pre><code>// 禁止所有搜索引擎蜘蛛抓取任何内容 User-agent: * Disallow: / </code></pre> <pre><code>// 允许所有搜索引擎蜘蛛抓取任何内容 User-agent: * Disallow: </code></pre> <h4 id="参考案例">参考案例</h4> <p></p> <h3 id="参考">参考</h3> <ul> <li>https://imweb.io/topic/5682938b57d7a6c47914fc00</li> <li>https://www.xc123.net/art/detail/11</li> </ul> </div>  <div class="p-2"></div> <div class="arcinfo my-3 fs-7 text-center"> <a href='/t/etagid573-0.html' class='tagbtn' target='_blank'>web前端</a> </div> <div class="p-2"></div> </div> <div class="p-2"></div>  <div class="lbox p-4 shadow-sm rounded-3"> <div class="boxtitle"><h2 class="fs-4">相关</h2></div> <hr> <div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-557320.html">web前端面试题</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-518453.html">web前端和后端的区别在哪？</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-436043.html">【Web前端】【开源分享】H5登陆界面 - 2021年12月30日</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-394646.html">Web前端学习第六天——————HTML、CSS篇.021鼠标划入效果hover</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-394518.html">Web前端学习第五天——————HTML篇.018盒模型</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-365290.html">WEB前端基础之SCC(字体颜色背景-盒子模型)</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-335833.html">创优视觉科技广州分公司谈为何学习Web前端？</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-333513.html">web前端的学习02</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-333343.html">web前端的学习03</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-256141.html">Web前端开发</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-193074.html">web前端中css的基本用法，详解以及示例</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div><div class="row g-0 py-2 border-bottom align-items-center"> <div class="col-7 col-lg-11 border-lg-end"> <h3 class="fs-6 mb-0 mb-lg-2"><a href="/a/1-149156.html">Web前端面试敲重点知识，14个TypeScript核心基础面试题和答案</a></h3> <div class="ltag fs-8 d-none d-lg-block"> </div> </div> </div>   </div>  </div> <div class="col-lg-3 col-12 p-0 ps-lg-2">     <div class="lbox p-4 shadow-sm rounded-3"> <div class="boxtitle pb-2"><h2 class="fs-4"><a href="#">标签</a></h2></div> <div class="clearfix"></div> <ul class="m-0 p-0 fs-7 r-tag"> </ul> <div class="clearfix"></div> </div>  </div> </div> </div> </main> <div class="p-2"></div> <footer> <div class="container-fluid p-0 bg-black"> <div class="container p-0 fs-8"> <p class="text-center m-0 py-2 text-white-50">一品网 <a class="text-white-50" href="https://beian.miit.gov.cn/" target="_blank">冀ICP备14022925号-6</a></p> </div> </div> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6e3dd49b5f14d985cc4c6bdb9248f52b"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </footer> <script src="/skin/bootstrap.bundle.js"></script> </body> </html>