辛苦搭建的网站为什么搜不到，原因找到了...
扫测资讯 2025-04-04 12:00 90 0大厂技术 高级前端 Node进阶
点击上方 程序员成长指北，关注公众号
回复1，加入高级Node交流群前言
以前开发独立站，涉及过一些SEO的内容，为了避免后面会遗忘，感觉有必要记录下相关经验，也算是一次总结吧！
SEO概念
SEO 是 Search Engine Optimizatio（搜索引擎优化） 的首字母缩写，利用搜索引擎的规则对网站进行内部及外部的调整优化，提高网页或网站在搜索引擎中关键词的自然排名, 以求得获得更多的展现量和吸引免费的点击流量，从而达到互联网营销及品牌建设的目标。
SEO的方式
1. Title标签
对页面点击率有直接影响，因为这是用户对网站页面的第一印象，而且也是爬虫重点的爬取对象，填写的文字要对网页内容有准确而简洁的描述，能够吸引用户点击，而且长度要适中。
2. Meta标签
meta标签共有两个属性，分别是http-equiv属性和name属性，不同的属性又有不同的参数值，另外还有主要作用于社交平台的OG标签。
(1) name属性
-
Meta Keywords：
Meta Keywords是排名的重要组成部分，因为早期的搜索引擎机器人使用该值对网站进行分类，但在后来逐渐被放弃了。
（1） Google 在2009年正式宣布 [1] ，keyword标签不再是排名的一部分。
（2） 在百度站长论坛上官方曾表示这个标签目前对SEO的影响可以忽略不计。
<meta name ="keywords" content="这是keywords的内容">-
description： 告诉搜索引擎你的网站主要内容
<meta name ="description" content="这是description的内容">-
robots： 告诉搜索机器人哪些页面需要索引，哪些页面不需要索引
<meta name ="robots" content="none">-
author： 标注网页的作者
<meta name="author" content="广白,掘金">(2)http-equiv属性
-
Expires： 可以用于设定网页的到期时间，一旦网页过期，必须到服务器上重新传输
<!-- 必须使用GMT的时间格式 -->
<meta http-equiv="expires" content="Fri, 12 Jan 2001 18:18:18 GMT">-
Pragma： 禁止浏览器从本地计算机的缓存中访问页面内容
<!-- -->
<meta http-equiv="Pragma" content="no-cache">-
Refresh： 自动刷新并指向新页面
<!-- 其中的2是指停留2秒钟后自动刷新到URL网址 -->
<meta http-equiv="Refresh" content="2；URL=http://www.juejin.com">-
Set-Cookie： 如果网页过期，那么存盘的cookie将被删除
<!-- 必须使用GMT的时间格式 -->
<meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday, 10-Nov-2023 18:18:18 GMT；path=/">-
Window-target： 强制页面在当前窗口以独立页面显
<!-- 用来防止别人在框架里调用自己的页面 -->
<meta http-equiv="Window-target" content="_top">-
content-Type： 设定页面使用的字符集
<!-- 设定页面使用的字符集 -->
<meta http-equiv="content-Type" content="text/html; charset=gb2312">(3) OG标签
它是 Facebook 在 2010 年 F8 开发者大会公布的一种网页元信息（Meta Information）标记协议，属于 Meta Tag （Meta 标签）的范畴，是一种为社交分享而生的 Meta 标签。为了让信息内容加速流动和准确呈现，Facebook 早年极力推动这个协议，到目前几乎主流的社交媒体网站都支持 OG 协议。包括 Twitter、Pinterest、LinkedIn 和 Google+ 都可以识别 OG 协议。虽然 Twitter 也有自家的 Twitter Cards 协议，但是 Twitter 只要发现网页上没有使用自家的协议，就会用 OG 协议代替。 国内的百度、360 搜索、微博、微信、人人网等也支持该协议。
-
使用方法 ：
<html prefix="og: https://ogp.me/ns#">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock" />
<meta property="og:type" content="video.movie" />
<meta property="og:url" content="https://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="https://ia.media-imdb.com/images/rock.jpg" />
...
</head>
...
</html>-
作用：
OG在社交媒体上具有丰富的内容展示，比如分享一个网址链接在社交平台后，这个链接会显示缩略图、标题和描述等，增加访客点进来的概率， 左图加了OG标签，右图没有 。
