1、SEO（search engine optimization）概述：
中文既搜索引擎优化，指在了解搜索引擎自然排名机制的基础上，对网站进行外部的调整优化，改进网站在搜索中关键词的自然排名，获得更多的流量，吸引更多目标客户，从而达到网络营销及品牌建设的目标。
?
广告：广告（SEM-营销-销售）
百度快照：符合seo搜索规则
搜索引擎：运用计算机程序，在互联网中抓取数据，并进行组织和处理，为用户提供搜索服务。
seo的作用：1，为用户搜索有用信息；2，给企业带来意向用户
2、搜索引擎工作原理
2.1、抓取网页
2.2、收录建库预处理
2.2.1、建库包括：1、创建索引数据库；2、创建网页数据库
2.3、分析搜索内容
2.4、对结果进行排序。
2.4.1、1、根据自然规则排序；2、根据竞价规则排序；
3、搜索引擎的收录--搜索引擎有没有把我们的网站放到索引数据库
3.1、网页被搜索引擎蜘蛛爬行并保存索引，能被我们检索到时就算网页被搜录了
3.2、使用site命令查询网站收录
3.2.1、命令格式：site: +站点域名
举例：site:www.ifeng.com
?
4、搜索引擎营销策略
SEM：
优点：简单粗暴，见效快，范围广，花钱
缺点：价格昂贵，排名波动大，恶意点击
适合短期投放，如节日活动
SEO：
优点：费用低、不受恶意点击影响、排名相对稳定
缺点：见效慢、关键词数量限制，需要做seo优化、排名永远在sem后面
适合长期优化
4.1、Seo查询工具
Chinaz站长工具：http://seo.chinaz.com
?
5118站长工具：https://www.5118.com
?
4.2、搜索引擎官方平台工作工具链接提交
官方网站：Ziyuan.baidu.com
其中比较重要的内容有：站点属性、链接提交，分别见图。
站点属性：
?
链接提交
?
4.3搜索引擎官方平台工具-网站添加
常见搜索引擎：
百度站长平台：http://ziyuan.baiducom
好搜站长平台：http://zhanzhang.so.com
搜狗搜索：http://zhanzhang.sogou.com
5、关键词定义及分类
5.1、关键词：输入搜索框中的文字，也就是命令搜索引擎寻找的相关信息。在搜索营销界指一个单独的关键词-如-留学，又指一个关键词短语-如-美国留学，还值一个关键词串或搜索穿-如-北京哪家美国留学机构好？我们把这些都统称为关键词。
举例：白内障治疗、白内障手术
核心关键词：用以描述网站的核心内容，主要服务等方面的特征的词汇。核心关键词代表一个网站的主题，可以是服务，也可以时产品，或产品加服务。
5.2、长尾关键词：指与目标关键词的任何有搜索量，有人关注的关键词。长尾关键词的流量很小，但因为长尾关键词的数量非常多，所以长尾关键词的流量之和远远大于核心关键词的流量和，而且往往长尾关键词的转化率要高于核心关键词，因此长尾关键词也是非常重要的。
举例：白内障的早期症状、眼睛干涩是怎么回事？、白内障手术大概多少钱？
5.3、关键词的选取：
挑选关键词的基本步骤：
1、明确关键词，可以通过头脑风暴列出待选词。
2、查看竞争对手网站的关键词
2.1、关键词标签中都列出了什么关键词
2.2、标题中出现了什么关键词
3、查询关键词热度
4、确定自己的核心关键词
5.4、关键词挖掘工具的使用：
百度推广-关键词规划师
站长工具
?
大型网站的下拉框
百度指数
6、url优化与导航优化
url结构对于seo很重要，因此在下载网站模板使用的时候务必进行修改，建议不要采用模板默认的目录结构，可以把默认的栏目、子栏目的目录名称进行修改，这样就很大程度上保证网站url地址和其他网站的差异化。Url长度层级尽量控制在3层内。层级太深了，蜘蛛不愿意爬行。
服务端可以修改
前端创建路由时候可以修改
举例：https://www.haolvshi.com.cn/ask/100128.html
这是一个及经过seo优化的url
导航结构要清晰明了，突出重点，包含关键词
导航时评价网站专业度、可用度的重要指标，同时对搜索引擎也是一种提示作用。搜索引擎不会识别图片和flash，导航采用文本链接容易被搜索引擎抓取和识别，对关键词的排名有一定的提升。
7、TDK标签优化及技巧-标题-描述-关键词
?
权重：标题权重>描述>关键词
Title
Seo所用：突出本页面目标关键词，在本页面内部优化工作中非常重要。
Title标签注意事项，字符建议控制在80字符内，应添加本页面目标关键词，title关键词的数量不超过5个。
Description
Seo作用：对目标关键词的重要补充，对目标关键词相关搜索有排名辅助作用，description属性的注意事项，建议控制在200字符内。
Keyword
现在作用不是很大了，用来调整关键词密度
字符限制建议控制在100字符内，关键词控制在5个以内
?
7、页面关键词的布局和密度
常见F形布局
?
关键词密度：
关键词密度与关键词频率所阐述的实质上是同一个概念，用来度量关键词再网页上出现的总次数与其他文字的比例，一般用百分比表示。
相对于页面总字数而言，关键词出现的频率越高，关键词密度也就越大。
关键词优化是站内优化的一个辅助手段。
?
关键词密度的一般标准：
对于搜索引擎来说，一个页面上的关键字密度最好在2%~5%之间，太少了起不到优化的效果，太多了会被搜索引擎认为是堆砌关键词，被当作作弊进行处理。
优化网页结构一般原则：
用户在进行3次点击，可以到达网站的任何页面
搜索引擎抓取三级，抓取到网站所有的页面
网页收录容易与否取决于该网页离主页有几次点击，而不是它的物理位置。
8、内链优化与页面优化
内链的重要性
概述：
内链，就是在同一网站域名下的内容与页面之间的相互链接，，留住用户的一定是内页，如果整个网站就是金字塔，那么网站的内页就是塔底，作为网站的排名基垫，网站的内页优化很重要。
作用：
从连接上可以实现整个网站的有效链接，进而实现用户体验和搜索引擎的优化。
从文章质量上，可以有效的提高文章的用户体验度，进而提高用户粘度，有了这样的排名基石还愁什么呢。
内页关键词优化，简称：四处一词。
标题、关键词、描述、内容、锚文本（各种导航）
我们做网站无论前期还是后期多数都是依靠长尾关键词带来流量，因为目标关键词一般不那么容易做上去；
而长尾关键词做了收录后就很快能获得排名，（前提是能做到位）在内容的编辑上其实有很好的seo技巧可以让搜索引擎认定你的这篇文章限用户所搜索的这个长尾高度相关，这样就能排在比较靠前的位置随着整体网站的权重提升这个长尾排名也会越来越考前。
9、h标签
主要是用来定义标题表示强调的一种标签，有h1-h6不同的级别，用来呈现也买你内容的层级，1-6权重依次降低。
h标签使用注意事项：
为了突出目标关键词，在使用h标签时应该注意：
h1标签和h2标签，不建议同时使用；
h1和h2标签在使用的时候建议包含关键词；
h1和h2标签在使用的时候建议一个页面只使用一次；
h3、h4、h5标签SEO作用较小，但建议不要乱用
h6可以在首页友情连接处，已降低友情链接对页面目标关键词的影响。
10、strong标签
strong标签，表示强调的作用，有加强语气的意思，在浏览器中表现为加粗的显示；
作用：加强语气突出标签内文本内容；
注意事项：
页面内不要有大量的加粗文字；
页面内非关键词文本少用此标签；
一般网站标题需要用此标签；
常用来标注文章的小标题；
b标签与strong标签的区别：
相同点：都是显示为加粗的效果；
不同点：b标签知识物理性质的加粗；strong标签是语义的强调；
结论：
HTML的b加粗与strong加粗显示上没有本质的区别，用法语法也没有区别，建议大家不要可以追求此问题，就按照平时习惯使用即可；
b加粗标签是比较早的html出现使用的，而strong标签稍晚一点，至今所有浏览器都支持两者的加粗功能，建议选择strong。
11、img标签中的alt属性
seo作用：
让百度更好的识别图片信息，从而使图片有收录和排名可以用来调整关键词的密度，用来保持关键词密度在2%~5%之间。
注意事项：
alt描述要和图片内容相符，alt描述控制在100字符以内（极限）；
12、301重定向
页面永久性移走（301重定向）是一种非常重要的“自动转向”技术。
网址重定向最为可行的一种办法。当用户或搜索引擎向网站服务器发出浏览器请求，服务器返回的HTTP数据流中头信息header中的状态码的一种，表示网页永久性转移到另一个地址。
301重定向的意义：
1、网站改版完成，先将新版上线，在线上保持一段时间新旧内容共存。
2、新旧内容共存一段时间，且新版内容已开始收录后，对新旧内容设置301，将旧版对应内容指向新内容。
3、301重定向有利于网站首选域的确定，对于同一资源页面多条路径的301重定向有助于url的集中。
网站301重定向怎么设置：
做网站优化，我们基本知道url标准化需要采用301重定向。说直白点，就是通过方法将各种网络请求重新定个方向转到其他位置，也就是通常说的网页跳转。
?
13、404错误页面
14、外链
15、链轮
链轮其实就是单链与交叉链接的一个结合。比如我们建立了几个博客：新浪、百度、网易、搜狐再一个就是我们自己需要带的站也就是我们的轴心。我们首先要做的就是建设好一个轮。也就是新浪的给百度一个链接，百度给网易一个链接，网易给给搜狐，搜狐给新浪。注意这里面都是以单向链接的形式在，那么是不是已经形成了一个轮，然后我们再把每个博客都做一个单向指向我们的主站M平台，以自己的主站为中心轴。一个最简单的链轮就完成了。
16、网站静态化--服务端渲染–代码同构
页面渲染经历了：纯服务端渲染--》单页面应用（浏览器端渲染和交互）–》同构（node服务端渲染，前端交互）
现在，同构和服务端渲染基本即使同义词了。
将路由的响应与渲染的生命周期合并为一个通用的代码库，并同时支持在客户端和服务器端运行，应该就可以解决上述这些问题以及其他潜在问题。这就是同构 JavaScript 的意义所在。同构 JavaScript 应用是整合两种架构，以创建易于维护的、更好的用户体验。（JavaScript与node）
简单来说，同构 JavaScript 应用就是在浏览器客户端和 Web 应用服务器端间共享同一套 JavaScript 代码的应用。从某种意义上讲，之所以称为同构，是因为无论在客户端还是在服务器端运行，应用都具有相同的形式或形态。
客户端缺点：
构建客户端 Web 应用的最大劣势在于，首次加载需要付出高昂的代价下载一个 JavaScript 大文件。互联网中的主要传输协议是 TCP（Transmission Control Protocol，传输控制协议），该协议定义了一种被称为慢启动（slow start）的拥塞控制机制，这意味着数据是以逐渐增加数据块的方式进行发送的。
同构优点：
1、纯 JavaScript 技术栈，这意味着应用界面的代码可以由前端工程师单独维护，而无须经过后端工程师。关注点和责任更清晰地分离，这使得每个人都可以只在自己擅长的领域贡献代码，从而做到术业有专攻。
2、对于同一个渲染周期，客户端和服务器端可以使用同一套代码。这意味着不需要重复劳动，可以在降低界面开发与维护成本的同时提高团队开发速度。
3、在服务器端渲染一份初始的 HTML 代码后，用户会感觉网页的加载速度更快，这是因为用户可以在浏览器中先看见首屏渲染的内容，而无须等待应用资源的加载和数据抓取完成。在网络延迟比较严重的环境中，这种改进页面预加载的方式尤为重要。
4、同构 JavaScript 应用可以轻松地被所有的搜索引擎收录，并能优化网页加载速度和页面之间的过渡（适用于支持 History API 的浏览器，而在老版本浏览器中可以优雅地降级，不会对应用架构产生影响）。
同构缺点：
相对SPA应用，更复杂的开发，开发的代码需要兼容浏览器端和服务器端runtime；
更复杂的开构建、部署；
加重服务器负载；
何时不使用同构：
同构 JavaScript 架构可能仅仅适用于某些类型的应用。同构 JavaScript 应用需要更多架构上的考虑，实现上也存在一定的复杂度。对于 SPA 来说，如果性能要求不高或者没有 SEO 需求，同构 JavaScript 带来的麻烦似乎远大于收益。比如：M平台
SPA应用解决爬虫收录的方法：
1、在服务器中运行一个无界面的浏览器，用于在服务器中运行 SPA 并响应爬虫请求。
2、同构 JavaScript 应用
vue–nuxt
react--next
使用SSR的Vue的运行流程：
代码在部署后端，当有一个请求过来时，服务器会新建一个vue实例，渲染（render）出需要显示的页面的html，把得到的页面以字符串的形式返回给客户端。同时把相关的js文件也返回（首次请求时返回vue的runtime、webpack的runtime和app.js等文件，非首次请求返回按需加载的js文件），返回的js文件和单页面应用（SPA）返回的差不多。
浏览器接收到这些文件后，通过js文件把静态页面的字符串hydrate成可以交互的应用。个人理解，这里的hydrate的工作包括处理事件、运行生命周期钩子函数、实现视图和数据的双向绑定等。和SPA相比，SSR返回的数据就是多了个静态页面（字符串形式）。
17、本文并非100%原创，在网上查阅了各类资料，结合自己的工作经验完成。欢迎批评、交流、指正。