mean.js 全栈 javascript 应用程序上的搜索引擎优化仍然是一个主要问题,应该如何处理?

Posted

技术标签:

【中文标题】mean.js 全栈 javascript 应用程序上的搜索引擎优化仍然是一个主要问题,应该如何处理?【英文标题】:Is search engine optimization on a mean.js full stack javascript application still a major issue an how should it be dealt with 【发布时间】:2015-01-24 20:47:07 【问题描述】:

我正在开发我的第一个全栈 javascript 应用程序,特别是使用 mean.js 作为我的起点,我开始对搜索引擎优化 (SEO) 问题感到紧张和困惑。

Google 最近(在去年左右)为改进 javascript 抓取所做的努力是否使这不再是问题,还是我需要在项目的规划和结构中考虑到这一点?

如果 Google 现在可以抓取 AngularJS/Ajax 繁重的应用程序,为什么我们会收到有关 SEO 问题解决方案的博客文章: http://blog.meanjs.org/post/78474995741/mean-seo

是否需要这种类型的解决方案。 这在 SEO 方面是否会与服务器端渲染一样有效。 hash bang (#!) url 是必要的邪恶还是纯粹的邪恶。

我知道以前有人问过关于 SEO 和 AngularJS 的问题,但是在这个问题上似乎有很多不同的意见,以至于我迷失了,如果有一些更具体的 mean.js 想法会很好。我主要担心的是:

如果构建 angularjs 繁重的实现会使其成为 SEO 黑洞。 如果我最终在静态文件中再次构建几乎整个项目,只是为了 SEO 如果我需要查看服务器端渲染解决方案。

【问题讨论】:

【参考方案1】:

如果您使用 JavaScript 呈现大部分内容,那么是的,它会成为搜索引擎的黑洞。这是胖客户端应用程序的一大缺点。如果您需要搜索引擎的高知名度,这是一个挑战。有一个中间立场。

您需要结合使用服务器端渲染和客户端渲染。当页面第一次加载时,它应该包含用户需要的所有可见内容,或者至少是出现在“首屏”(在页面顶部)的内容。链接应该是描述性的,并允许搜索引擎更深入地了解该网站。您网站的主菜单应该与网页一起提供,同时让搜索引擎有一些可以咬的东西。

首屏内容或分页内容可以动态拉入并使用任何 JavaScript 框架在客户端上呈现。这为您提供了一个很好的服务器端渲染组合以供搜索引擎使用,以及动态拉入内容可以提供的性能提升。

【讨论】:

更具体地说,使用 ie 渲染所有 SEO 并将相关内容输入页面。 php。至于 hashbanging,我会改用 history.pushstate。 谢谢,因为我的开发工作还很早,所以我决定改变一些事情,按照您的建议对最初可见的内容使用更多的服务器端渲染。我仍在研究细节,但初步测试看起来不错。我接受了这个答案,但也投票支持其他有用的 cmets,因为其他答案中有几个有用的提示。【参考方案2】:

你需要担心你的网站的公众形象你不应该被认为是登录屏幕背后的任何东西,对我来说,使用无头浏览器方法的快照使用farment_scape 似乎是要走的路,它会消耗更少的时间,而且正如你所看到的那样 mean-seo 并不难实现。

看看这个question,有一些关于如何在页面上创建对 SEO 友好的链接的答案,几乎所有最近的帖子都相互吻合。

https://support.google.com/webmasters/answer/174992?hl=en

并尝试注册到https://webmasters.stackexchange.com/,您会发现更多关于 seo 的信息

【讨论】:

【参考方案3】:

只想提一下这个 npm 包 https://www.npmjs.com/package/mean-seo,它使用 PhantomJS 呈现您的应用程序的预览,并在您设置的任何时间段内将其缓存在磁盘/redis 上。

【讨论】:

以上是关于mean.js 全栈 javascript 应用程序上的搜索引擎优化仍然是一个主要问题,应该如何处理?的主要内容,如果未能解决你的问题,请参考以下文章

Heroku 上的空白页 - mean.js Angular 应用程序

Angular 和 Express 路由如何在 mean.js 应用程序中协同工作?

7Python全栈之路系列之协程

从客户端控制器 (MEAN.JS) 指定 Mongo 查询参数

蚂蚁金服网红技术团队分享,用 JavaScript 全栈打造商业级应用

我应该将 Angular 代码放在这个 Mean.js 应用程序中的啥位置以使该列表可排序?