777网Angular Universal:你需要知道的SEO

如果你使用Angular来增强你的网站,那么当涉及到搜索引擎优化时,你就需要跨越一个额外的障碍。幸运的是,Angular Universal很容易跳过它。

请记住,“简单”在这里是一个相对的术语。这涉及到相当多的技术魔法。

您几乎肯定需要一个开发团队的参与。

但一旦完成的产品交付,你的网站将提供优化的页面,搜索引擎将很容易找到和索引。

在这个指南中,我将解释Angular Universal以及它对市场营销人员的重要性。

搜索引擎优化的问题

Angular对于交付模块化的、用户友好的web应用程序来说是一个非常棒的框架。不幸的是,它有点敌视搜索引擎优化。

这有两个原因。

首先,Angular很大程度上依赖于脚本来交付内容。因此,一些搜索机器人无法“看到”用户看到的内容。

看一看Angular Universal文档。毫无疑问,这个页面是用Angular呈现的。

向下滚动,您将看到相当多的内容。你会认为它都是可索引的。

不一定。右键单击页面并从出现的上下文菜单中选择“查看页面源”。

只有100行源代码。在那里你看不到你正常浏览页面时看到的内容。

简而言之,这就是Angular的问题所在。人类访客将看到内容,但搜索机器人将看到源代码。

而且源文件没有内容!

还有另一个SEO问题:速度。Angular应用通常加载速度不快。

有些网站在显示主页之前会出现几秒钟的空白屏幕。这可能会导致游客失去耐心而离开。

网站速度是手机排名的一个因素,所以如果你的网站在手机平台上加载速度不够快,你的排名就会受到影响。

但谷歌表示……

谷歌声称它的机器人可以索引脚本驱动的网站。有很多证据可以支持这一点,但这并不意味着你可以在优化Angular网站时避免付出额外的代价。

首先,谷歌并不是唯一的搜索引擎。如果你想让你的Angular应用在Bing和DuckDuckGo上排名,你必须采取措施来实现这一点。

接下来,可能是谷歌可以索引一些Angular站点,但不能索引你的站点。不是所有的Angular应用程序都是一样的。你的可能是谷歌索引算法的例外。

根据我的经验,从HTML到Angular的网站在大多数情况下会减少搜索引擎带来的大量流量。事实上,在过去的一年里,我有三个客户来找我,因为Angular的原因,我们不得不重新修复网站。

有解决方案

幸运的是,有一些方法可以使你的Angular站点SEO友好。

一个比较流行的选项是使用动态渲染。这时您可以使用Puppeteer这样的工具来生成静态HTML文件,web爬虫程序可以更容易地使用这些文件。

然后,配置你的web服务器,当用户浏览正常的Angular应用时,引导搜索机器人到预先呈现的页面。

这是一个不错的解决方案,但仍然没有解决速度问题。为此,你可能会想使用Angular Universal。

什么是Angular Universal?

Angular Universal在服务器上运行web应用,而不是在浏览器上运行。

这是一个重要的区别。通常,Angular应用是客户端应用。

搜索机器人的问题是,它们并不总是像浏览器那样“处理”客户端代码,当它为你提供一个网页时。这就是为什么你会看到Angular Universal documentation页面与其源代码之间的差异。

Angular Universal处理服务器端呈现(SSR)。它预先将HTML和CSS内容呈现给用户。

这意味着用户将加载静态HTML页面,而不是客户端代码。因此,页面加载速度会更快。

此外,因为它是静态HTML,搜索机器人可以索引内容。

每个人都赢了。

为什么它很重要

如果你是数字营销的一员,那么你已经知道大部分的战斗都是为了获得在线曝光。这就是为什么你要联系有影响力的人,在社交媒体上发布更新,优化你的网站以获得更好的排名。

简单地说:如果你的网站不能被索引,你的网站就不能被排名。如果Angular正在为你的网站提供动力,你需要采取额外的步骤来确保它的内容出现在搜索引擎中。

这就是为什么你需要一个Angular通用的解决方案。

当然,它的缺点是要花钱。你将需要雇佣一个合格的开发团队添加SSR到你的网站。

如果你的网站在与你的利基相关的关键搜索关键词中排名靠前,那么这笔费用将远远超过它本身。

如何在Angular Universal上运行Angular应用程序

如果您喜欢亲自动手编写代码,或者只是想节省开发成本,您可以自行部署服务器端应用程序。

在你做这些之前,你最好对Angular有一个基本的了解,命令行界面(CLI), TypeScript,

滚动至顶部