说不定哪天就用到了之SE0篇

前言

前段时间，和朋友闲聊，他说他朋友公司新建的网站，在百度等国内搜索引擎中搜索不出来，询问我如何才能让一个网站被搜索引擎收录。我时不时的会看到搜索引擎排名优化方面的文章，但没有实际应用场景，所以刚开始还会点进去看一看，后面连点都懒得点。不过这次，我感受到了SEO的价值，所以打算花点时间，搜集一下这方面的资料,学习一下。

什么是SEO?

SEO 是 Search Engine Optimization（搜索引擎优化）的首字母缩写。通俗的说，就是搜索自然排名优化。自然排名是相对于竞价排名而言的,两者的区别很明显：

• 竞价排名是付费的，搜索同样的关键字，排名位于前列, 会打上广告字样标签(仅指百度)。

• 自然排名是免费的，搜索同样的关键字，一般排名比较靠后, 不会带有广告字样。

SEO的用途就是利用搜索引擎的排名规则提高网站在相关领域的自然搜索排名,获得一定的精准流量，对于企业的曝光，引流获客，意义重大。搜索引擎第一页只有10个展示位，而参与排名的网站数量很庞大。所以注定了绝大部分网页都冲不进第一页，所以我们对SEO优化的效果，不要抱有过高的期待。经过SEO优化之后的网站，经过一段时间后，排名能冲进搜索引擎前五页,就不错了。

如何做SEO?

• 关键词挖掘和布局
• 提升网站质量
• 收录优化
• 网页代码优化
• 定义爬虫协议和网站地图
• 永久重定向
• 内链优化
• URL优化
• 其它

关键词挖掘和布局

关键词挖掘

• 热门关键词

如何挖掘关键词，可参考此文，试了第一条，通过搜索下拉框选择关键词，感觉比较靠谱。其它方法读者可以自己尝试一下。

• 长尾关键词

是指网站上的非目标关键词但与目标关键词相关，也可以带来搜索流量的组合型关键词。长尾关键词的特点是搜索量不大, 可是这类词的数量却很多。如下图所示, 这类关键字的占比又细又长，所以形象地称之为长尾关键字。

长尾关键词的挖掘思路参考此文，文中罗列了很多实用的方法。

关键词布局

在页面什么位置放置多少关键词可以参照关键词金字塔布局关键词，在关键词密度的布局上一定要把关键词的位置分配均匀，不要出现某个位置关键词堆积现象，这样反而不利于SEO优化。

在设置关键词时，最好在标题中出现关键词而且放在前面，因为页面标题的权重比较高，网页爬虫会优先爬行。此外,真正给网站带来流量较多的还是长尾关键词。对于长尾关键词的优化主要在选取上，利用站长工具去查看自己关键词的定位排名，找出排名在5-6页之前的关键字，将流量比较高的3~4个关键词放在首页中，其它的合理均匀的分布在对应的分类栏目页中。

提升网站质量

加载速度

一般来说，3秒以内是比较正常的体验，2秒以内是较佳体验。 如果你的网站加载速度大于4秒，就要考虑进行优化了。网站性能是会影响到网站的SEO排名的，原因也很直接：

• 如果网站太卡,加载缓慢，搜索引擎就会认为该网站对用户不友好，从而下降排名；
• 做SEO的最终目的就是为了提高转化率, 网站卡顿太明显的话，肯定会造成用户流失
• 影响搜索引擎的爬取频次

提高网站加载速度的思路是：

1. 减少资源请求, 如开启缓存, 页面资源按需加载，分页加载数据，使用雪碧图, 图片懒加载
2. 减小请求资源文件体积 如压缩图片/js/css文件等页面资源文件
3. 提高并发量和响应速度 如分布式负载均衡，开启http2.0协议, 使用cdn

网站优化的文章汗牛充栋，大家可自行查找。

内容与交互

这部分只能给出思路，具体的落地方法需要网站开发者去思考。

1. 网站能给用户提供有价值的信息，主题突出，条理清晰
2. 精心创作正文内容, 不俗套，数据来源有考究，专业权威
3. 用图片,视频分解内容，使其易于浏览
4. 网站布局合理,背景和文字对比度清楚明了，色调统一且看着舒适
5. 设置想要表达的主题，营造合适的情绪或氛围

收录优化

主动向各个搜索引擎管理平台提交自己的网站，可以加快搜索引擎爬取自己网站的时间，加快收录速度。常用的搜索引擎管理平台如下：

• 百度搜索资源平台
• 搜狗搜索资源平台
• 头条搜索站长平台
• 360站长平台
• 谷歌搜索中心
• 必应-网站管理员工具

这些网站都需要注册账号之后才能使用, 注册账号的时候需要提供一些个人信息（如下图所示），还要提供一个真实的网站，因此没有实际的项目，难以进一步深入了解。

网页代码优化

页面标题(Title)

不同页面的 title 要有所不同, 重要的关键词重复出现不要超过 2 次，而且在标题中的位置要靠前

• 网站首页：品牌词 - 产品服务特色，示例:

<title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>

• 列表页面：产品和主题概述 - 品牌词，示例:

<title>司法拍卖-京东拍卖</title>

• 详情页面：具体产品或内容主题概述-品牌词，示例:

<title>鹿晴家用垃圾袋加经济厚黑色手提背心式厨房大中号物业酒店捆装塑料袋 50只装 经济款-京东</title>

页面描述（Description）

• 不超过 150 个字符，描述内容要和页面内容相关。
• 不可过分堆砌关键词，内容为对页面内容的高度概括，不同页面的 description 要有所不同

<meta name="description" content="京东JD.COM-专业的综合网上购物商城，为您提供正品低价的购物选择、优质便捷的服务体验。商品来自全球数十万品牌商家，囊括家电、手机、电脑、服装、居家、母婴、美妆、个护、食品、生鲜等丰富品类，满足各种购物需求。"/>

页面关键字（Keywords）

Keywords 为产品名、专题名、专题相关名词 ，告诉搜索引擎本页的重点。Keywords 关键词已经被各大搜索引擎降低了权重，价值没有以前那么大了，写上也无妨。

<meta name="Keywords" content="网上购物,网上商城,家电,手机,电脑,服装,居家,母婴,美妆,个护,食品,生鲜,京东"/>

使用语义化标签

语义化标签	说明
超链接	1.内部链接，要加 title 属性加以说明 2.外部链接，要加 rel="external nofollow" 属性，告诉蜘蛛无需追踪，传递权重
列表	在罗列多个并列内容的时候，要使用列表标签，ul表示无序列表，ol表示有序列表, li 表示列表项
图片	img 要加上 alt 属性加以说明
表格	标题使用 caption 标签
强调内容	strong显示为粗体,em显示为斜体，strong的强调程度要比em更高
视觉上突出显示文本	<mark></mark>使用场景-搜索时的高亮文案
时间	<time datetime="2022-06-01 12:00">2022-06-01</time>
定义联系信息	<address></address>
定义一段独立的内容,与说明配合使用	<figure><figcaption>表单/图表等标题说明</figcaption></figure>
换行	tr标签只用于文本内容的换行
标题	h1~h6标签,h1一个页面通常只有一个, h2模块标题,h3段落标题,h4,h5,h6用于更小内容级别的标题
role属性	role的作用是描述一个非标准的html tag的实际作用。比如用div做button，那么设置div的 role="button"，爬虫工具就可以认出这实际上是个button

使用语义化结构标签

语义化结构标签	用法说明
section	对页面中的内容进行分块，一个 section 元素通常由标题以及内容组成
article	比 section 具有更明确的语义，代表一个独立的、完整的相关内容块，可以包含一个或多个 section
aside	独立于内容的一部分，可以被单独的拆分出来而不会使整体受影响，常用于定义页面侧边栏
main	用来呈现文档或应用的主体部分，一个页面只能有一个 main 标签
header	article、section、aside、nav 标签都可以拥有自己的 header 和 footer 标签
footer	整个页面或一部分内容的页脚

另外还有两个与SEO相关的点,需要注意:

1. 如果文字过长，需要显示省略号，要用css实现，保证搜索引擎可以抓取到完整的文字。
2. 减少iframe使用。搜索引擎不会抓取iframe的内容；

定义爬虫协议与网站地图

爬虫协议

robots.txt又叫做robots协议，是国际互联网界通行的道德规范(不能什么信息都可以爬)。放在网站的根目录下，是用来告诉搜索引擎如何抓取你的网站页面，网站上的哪些页面可以抓取，哪些页面不能抓取。可以屏蔽网站中一些敏感数据，如证书密钥，认证凭据，后台资源；可以屏蔽站点一些未开发完的页面，避免影响SEO；可以设置网站地图链接，引导蜘蛛爬取页面。

robots.txt支持配置的规则如下：

语法	含义
User-agent: *	这里的*代表的所有的搜索引擎种类，*是一个通配符
Disallow: /admin/	禁止爬寻admin目录下面的目录
Disallow: /ABC/	禁止爬寻ABC目录下面的目录
Disallow: /cgi-bin/*.htm	禁止访问/cgi-bin/目录下的所有以".htm"为后缀的URL(包含子目录)。
Disallow: /?	禁止访问网站中所有包含问号 (?) 的网址
Disallow: /.jpg$	禁止抓取网页所有的.jpg格式的图片
Disallow:/ab/adc.html	禁止爬取ab文件夹下面的adc.html文件。
Allow: /cgi-bin/	允许爬寻cgi-bin目录下面的目录
Allow: /tmp	允许爬寻tmp的整个目录
Allow: .htm$	允许访问以".htm"为后缀的URL。
Allow: .gif$	允许抓取网页和gif格式图片
Sitemap: 网站地图路径	告诉爬虫这个页面是网站地图

理解规则之后,可以用robots自动生成工具，生成robots.txt文件。 因为这个文件是放在网站根目录下的,所以一般我们可以用网站域名+'/robots.txt'的方式,就能访问到对应网站的爬虫规则文件。掘金的robots.txt文件内容如下,可以看到设置禁止抓取的目录主要是后端目录。

再看看天猫的设置, 禁止一切搜索引擎抓取本网站的内容。

网站地图Sitemap

网站地图用于把一个网站所有（或大多数）网址集中在一个标准的地图文件中。网站地图文件有多种格式，可以是XML文件（sitemap.xml）、HTML文件(sitemap.html)、TXT文件(sitemap.txt)或RSS文件(rss.xml)，目前最流行的的网站地图格式是使用sitemap.xml格式，它被主流搜索引擎（比如：百度、Google、Bing等）所使用。当网站有新网页时，把新页面的URL地址更新到网站地图,有利于搜索引擎的即时抓取。

网上有很多自动生成网站地图的工具，比如说使用这个工具，就可以快速生成网站地图。

输入掘金网址，生成的sitemap.xml文件内容如下，可以看到不同页面的权重是不一样的。

meta标签中的robots项

通常情况下,robots的值为:

<meta name="robots" content="index,follow" />

robots的取值如下:

robots取值	含义
all	文件将被检索，且页面上的链接可以被查询；
none	文件将不被检索，且页面上的链接不可以被查询；
index	文件将被检索；
follow	页面上的链接可以被查询，告诉蜘蛛可以被追踪，传递权重；
noindex	文件将不被检索；
nofollow	页面上的链接不可以被查询，告诉蜘蛛无需追踪，不传递权重。一般用于外部链接

要理解 meta-robots的含义，要了解几个概念。

抓取和索引

搜索引擎的抓取和索引是两个不同的环节。

• 抓取: 搜索引擎爬虫抓取某个网页的内容。可以认为爬虫在浏览器打开一个网页，浏览具体的内容。
• 索引: 爬虫将内容抓取完成后，搜索引擎认为此网页内容有保存价值，就会保存在数据库中。 可以认为爬虫觉得此网页的内容还不错，于是加入了收藏夹。

上面的表格中文件将被检索，就是告诉爬虫,网页内容可以被搜索引擎收录到自己的数据库中。页面上的链接不可以被查询，是说如果网页中引入了链接，不要在搜索结果中显示网页中引入的链接。

网站权重

网站权重代表一个网站在搜索引擎结果中的影响力，权重越高，页面排名就越靠前。网站的权重计算，主要是通过国内两大站长工具进行虚拟评估，根据站点从搜索结果获取的预估流量，给予一定的评级，它是一个虚拟指标，通常分为1-10级，级别越大权重越高。上表中所说的传递权重, 就是要不要把当前页面的权重，传递给页面中引入的外部链接页面，一般只有将权重大的页面的权重传递给权重小的页面，才有意义。通常是把不知名网站放在知名网站的友情链接中，一般都要给对方付费。下面是两个查询网页权重的网站：

• 爱站网-网站百度权重查询
• 站长之家-百度权重查询

我带着好奇心，在爱网站查询了一下掘金和CSDN在百度搜索中的权重, 发现CSDN网站的权重更高

随便搜了一下一个技术话题"less和sass的区别"，发现搜索结果第一页只能看到CSDN的搜索结果，看不到掘金的，不靠谱的百度，汗颜！

meta的robots项很多搜索引擎是不支持的，只有少数搜索引擎能够识别并按给定的值抓取。因此还是推荐用robots.txt文件来限制抓取。

永久重定向

出现下面几种情况必须配置301永久重定向：

• 网站替换域名后，需要通过301永久重定向旧域名到新域名，弥补流量损失;
• 如果网站中一些页面被移除，这些页面有一定的流量和权重，需要用301重定向到合适的页面避免流量流失；
• 因为网站改版或其它原因造成页面路径发生变化，需要通过301重定向来避免出现死链接；
• 如果有多个域名需要指向相同的站点，需要使用301永久重定向；

在nginx配置上面几种情景永久重定向的方法是(其它情景可模仿修改)：

server {

　　# 网站改域名, 将juetong.com重定向到juejin.com
　　if ($host ~ '^juetong.com'){
      return 301 https://www.juejin.com/$request_uri;
    }
	
    # http重定向到https
    if ( $scheme = http ){
      return 301 https://$server_name$request_uri;
    } 

    
   # 将路径abc修改成了def
   location ^~ /abc {
     rewrite ^/abc(.*)$ /def/$1 permanent;
   }
}

内链优化

SEO内链可以增加提高页面蜘蛛抓取效率，增加网站的收录数量，还能提升网站权重及关键词排名以及提高客户体验度。

• 内链构建-内容关联

在文章的内容中添加锚点，或者在文章底部加上内链，保证链接内容的关联性。如网站导航，面包屑，侧边栏，文章分类等都体现了网站的内链。在网站的内容页面添加查看详情，给文章底部添加上一篇、下一篇文章的定向链接等。让页面之间产生关联，不能出现孤岛页面。

• 内链构建-面包屑

给站点添加面包屑,面包屑的作用是告诉用户自己目前处于网站什么位置，同时也可以让用户返回自己想去的地方。

• 内链构建-图片链接

搜索引擎蜘蛛倾向于识别相对简单的文本链接。所以建议给给产品图片添加文字链接，如下所示：

<a href="http://www.demo.com">
   <img src="http://www.demo.com/img/logo.jpg" alt="xxx" border="0" width="220" height="100">
</a> 

• 内链构建-列表页

列表页在产品列表和文章列表中很常见，分页的时候标记下面出现的1-2-3-4页，方便蜘蛛抓取。

URL优化

• URL长度短比长好，短 URL更利于传播和复制。
• URL参数建议不超过 3 个
• URL目录层次建议不超过 4 层目录
• URL要具有可读性，描述清晰而不是乱写一气
• URL建议包含关键词,有利于SEO
• URL字母全部小写，防止因为大小写导致 404
• URL使用短横线而不是下划线

搜索引擎会把短横线当作空格处理，而下划线会被忽略。seo-tools.html 会被拆成 seo、tools 两个关键词，而 seo_tools.html 会被拆成 seotools，而它们实际上不是一个单词

• URL规范化

举个例子 demo.com,www.demo.com,https://www.demo.com/index.html这几个实际上都返回同一个页面, 而搜索引擎却把它们当成不同的地址，重复收集，导致权重分散。要对网站做如下设置，便可告知爬虫，本网站的规范网址。

<head>
  <link rel="canonical" href="href="https://demo.com"/>
</head>

其它

• 网站开启https

是否启用超文本传输安全协议(https)，是搜索引擎排名的一项衡量指标。 在域名相同情况下，https站点比http站点，能获得更好的排名。网站开启https协议的方法参考这篇文章。

• 服务端渲染(SSR)

多数爬虫不会读取JS动态生成的内容，这就是SPA框架为什么要做服务器渲染(SSR)或预渲染的原因。在服务端拿到动态数据，填充到html页面，然后返回给浏览器，网页爬虫就能获得静态的网页内容。Vite+Vue3实现SSR的方法请参考此文，React实现SSR的方法请参考此文。

• 为网站添加404页面

如果网站没有设置404页面，用户输入错误的页面地址时，会出现死链接，蜘蛛爬行这类网址时，不利于搜索引擎收录。而且影响用户体验，造成用户关闭网站。所以网站的404页面不能省掉。

• 伪静态页面

在SEO优化中，静态页面new_1234.html要比动态页面new.asp?id=1234更容易收录，为了迎合爬虫抓取网页上的相关内容, 一般实现手段是在 nginx/apache 等服务器配置rewrite重写规则，将动态url转变为静态url。

nginx配置方法:

location /new_ {   
   rewrite "^/new_([0-9]{4}).html$" /new.asp?id=$1 last;  
}

apache配置方法是在项目下创建一个.htaccess文件，写入如下内容:

RewriteEngine on
ReWriteRule ^/new_([0-9]{4}).html$  /new.asp?id=$1 last [L]

• 站外软文推广

在别的创造平台网站，写软文给自己的网站打广告。比如说今日头条, 微信公众号，百家号，知乎，小红书等平台。

• 友情链接交换

和别的网站合作，相互推广。你可以看到，许多公司的官方网站，下方都有这样的友情链接。

最后

你在网上会看到很多从不同维度阐述SEO的文章, 看得人眼花缭乱，看完许多文章之后，仅停留在理解了概念的层面，真正能付诸于实践的，少之又少。本文列举的一些点，只要你不是个前端小白, 看完之后是知道如何将理论落地到实际项目中，这样的文章比纯讲理论的文章更有价值。如果你正在寻找SEO方面实操性较强的文章，希望本文能够帮到你。