检查元素。
比较和对比这两个视角, DOM 中,而不是硬编码到源中。还有第三方 Chrome 扩展可以帮助实现此目的,例如 Chris Pederick 的 Web Developer 插件或 Jon Hogg 的 View Rendered Source 插件。
如何解决 JavaScript 渲染问题
诊断出 JavaScript 渲染问题后,如何解决 JavaScript SEO 问题?答案很简单:通用 Javascript,也称为“同构”JavaScript。
这意味着什么?
这里的通用或同构是指能够在服务 按行业划分的特定数据库 器或客户端上运行的 JavaScript 应用程序。
有几种不同的 JavaScript 实现比客户端渲染更适合搜索,以避免将 JS 负担给用户和爬虫:
服务器端渲染(SSR)。这意味着每次请 instagram 广告类型和格式 求都会在服务器上执行 JS。实现 SSR 的一种方法是使用 Node.js 库,例如 Puppeteer。然而,这会给服务器带来很大的压力。
混合渲染。这是服务器端渲染和客户端渲染的组合。核心内容在发送到客户端之前先在服务器端呈现。任何额外的资源都会被卸载到客户端。
动态渲染在此解决方法中
服务器检测发出请求的客户端的用户代理。例如,它可以将预渲染的 JavaScript 内容发送到搜索引擎。任何其 看看是否有任何核心内容仅加 购买电子邮件列表 载到 他用户代理都需要在客户端呈现其内容。例如,Google 网站管理员推荐了一种名为 Renderton 的流行开源解决方案来实现动态渲染。
增量静态重新生成,或在部署站点后更新静态内容。这可以通过 React 的 Next.js 或 Vue 的 Nuxt.js 等框架来完成。这些框架有一个构建过程,会将 JS 应用程序的每个页面预渲染为静态资产,您可以从 S3 存储桶等设备提供服务。这样,您的网站就可以获得服务器端渲染的所有 SEO 优势,而无需服务器管理!
这些解决方案中的每一个都
有助于确保当搜索引擎机器人发出抓取 HTML 文档的请求时,它们会收到网页的完全呈现版本。然而,其中一些在网络基础设施建成后可能非常困难甚至不可能实施。这就是为什么在设计下一个 Web 应用程序的架构时牢记 JavaScript SEO 最佳实践非常重要。
请注意,对于构建在已经预渲染大部分内容的内容管理系统 (CMS) 上的网站(例如 WordPress 或 Shopify),这通常不是问题。
要点
本指南提供了一些有关
JavaScript SEO 的一般最佳实践和见解。然而,JavaScript SEO 是一个复杂而细致的研究领域。我们建议您阅读 Google 的官方文档和故障排除指南,了解更多 JavaScript SEO 基础知识。有兴趣了解有关优化 JavaScript 网站搜索的更多信息吗?请在下面发表评论。
网络已经从纯 HTML 转变——作为 SEO,你可以接受它。向 JS 开发人员学习并与他们分享 SEO 知识。 JS不会消失。
想要了解更多有关
SEO 技术的信息吗?查看 Moz Academy 技术 SEO 认证系列,这是一个深入的培训系列,旨在磨练技术 SEO 的具体细节。
对 B2B 网站的全面审核可能意味着赢得新客户和在竞争中落败的区别。在这一全新的《Whiteboard Friday》节目中,客座主持人 Carly Schonhoven 将带您了解可以将您的审核提升到新水平的四个领域。