seo搜索引擎优化技巧(常见的几个SPA框架SPA的优点和SEO的冲突前面)

　　seo搜索引擎优化技巧(常见的几个SPA框架SPA的优点和SEO的冲突前面)

　　在知乎网页中，有些部分几乎不会改变，比如导航栏，当我们点击一​​个问题进入时

　　

　　错误的答案

　　它的导航栏仍然不会改变，但是在传统Web网站中，当进入一个新页面时，会向服务器请求一个完整的页面，而在SPA中，当切换到一个新页面时，只有页面的变化部分需要重写。几种常见SPA框架SPA的优点

　　基本上具有前后端分离的优点，也有如下一些优点

　　SPA的缺点

　　根据这些不足，我们先介绍下SEO和SSR这两个话题，先说说SEO。

　　搜索引擎优化概述

　　我之前对SEO了解不多，直到最近才对SEO有了一些基本的了解。 SEO（Search Engine Optimization），中文通译：搜索引擎优化。 SEO 是一个调整 网站 以改进 网站 的过程，通过了解搜索引擎的工作原理（如何抓取 网站 页面、如何索引以及如何根据特定关键字对搜索结果进行排名） ， 等等。）。网站某些关键词s 在搜索引擎结果中的排名。

　　常用技术

　　搜索引擎优化中的技术大致可以分为两类：白帽技术和黑帽技术，

　　SEO 涉及很多细节。以下是来自维基百科的一些白帽技术的介绍：

　　排除非开发细节，我们大概可以提取以下信息：

　　虽然技术上不是元标记，但此标记通常与“描述”一起使用。这个标签的内容通常在搜索结果中显示为标题（当然在用户的浏览器中）

　　

复制代码

　　

复制代码

　　Google 的文档没有提到元关键字的使用。 Quora 还讨论了谷歌是否仍在使用元关键字。大部分答案是谷歌不再使用它，但百度等其他一些搜索引擎仍在使用元关键字。

　　SPA与SEO的冲突

　　我们前面提到的SPA对SEO不好，因为目前一些搜索引擎比如Google、Bing等，虽然它们的爬虫已经支持JS的执行，甚至通过AJAX获取数据，但是对于异步数据是不够的（可能搜索引擎提供者认为没必要），Vue SSR里是这么说的

　　如果您的应用程序最初显示加载菊花图，然后通过 Ajax 获取内容，则爬虫在获取页面内容之前不会等待异步完成。

　　如前所述，在SPA应用中，数据通常是通过AJAX获取的，很难保证我们的页面可以被搜索引擎收录找到。还有一些搜索引擎不支持执行JS和通过AJAX获取数据，更不用说SEO了。

　　对于一些网站来说，SEO是非常重要的，比如Quora、stackoverflow、知乎和豆瓣等，主要关注内容输出，那么如何正常使用SPA而不影响SEO呢？鲁迅说：

　　技术问题总是靠技术解决的

　　此时，SSR就在现场

　　SSR 概览

　　SSR是Server-Side Rendering（服务器端渲染）的缩写。在普通的SPA中，一般会先将frame和网站页面代码发送给浏览器，然后在浏览器中生成并操作DOM（这也是第一次访问SPA网站同下带宽和网络延迟，主要原因是它比传统的后端生成HTML并发送到浏览器要慢），但实际上也可以将SPA应用程序打包在服务器上，HTML渲染在服务器并发送到浏览器。此类 HTML 页面尚不具备交互能力，因此还需要配合 SPA 框架将其“混合”成浏览器上的交互应用程序。因此，只要能合理使用SSR技术，不仅能在一定程度上解决首屏慢的问题，还能获得更好的SEO。

　　SSR 的优点 SSR 的缺点 SSR 通用框架

　　我不熟悉 React 和 Next，所以我不会评论。我的博客使用 Nuxt 进行服务器端渲染。不得不说，Nuxt的使用真的很漂亮，有一定的约束（无规则无方），又不失可扩展性，官网的文档也很不错。

　　总结

　　前后端分离，减少前后端耦合，提高开发效率；

　　SPA是前后端分离的前端解决方案；

　　SEO 对许多人来说非常重要网站而普通的 SPA 对 SEO 不利；

　　SSR的出现在一定程度上解决了SPA中首屏慢的问题，大大降低了普通SPA对SEO的不利影响。

　　参考搜索引擎优化 - 维基百科指南 | Vue.js 服务端渲染指南

　　本作品采用知识共享署名-非商业性使用-禁止衍生4.0 国际许可协议进行许可。转载请注明： 作者staneyffer，首发于我的博客，原文链接：/post/4