Javascript看似无限的可能性使得基于HTML和CSS的公共网站成为过去。然而,尽管JavaScript为用户提供了出色的动态体验,但它也为开发人员创建了一个雷区。因此,Javascript搜索引擎优化成为一个不容忽视的问题。

javascript是如何工作的?

除了HTML和CSS,JavaScript是三种核心Web开发技术之一。HTML用于创建铁字品圈静态页面(即代码按原样显示在浏览器中,并且不能根据用户的操作进行更改),而JavaScript则使页面具有动态性。当用户单击按钮或从下拉框中选择值时,程序员可以使用JavaScript更改HTML标记的值和属性。javascript与HTML代码一起放在页面上,并与代码一起使用。

客户端和服务器端呈现

在讨论JavaScript时,我们需要提到两个概念并理解它们之间的区别:服务器端呈现和客户端呈现。

传统上,与静态HTML页面一样,代码在服务器上呈现(服务器端呈现)。当访问一个页面时,google bot将获得完整的现成内容,因此它不需要做任何事情,只需下载CSS文件并在浏览器中显示信息。

另一方面,javascript通常运行在客户机(客户机渲染)上,这意味着Google Bot最初获取的页面没有内容,然后javascript创建用于加载渲染的DOM(文档对象模型)内容。每次加载页面时都会发生这种情况。

显然,如果google bot不能正确地执行和呈现你的javascript,你将无法看到你想要看到的页面和内容。这就是JavaScript搜索引擎优化带来的大部分问题。

如何避免这些问题?如何检查网站是否正确呈现?

让谷歌机器人正确展示你的网站需要你集中精力正确展示链接和内容。如果你不提供链接,谷歌机器人很难在你的网站上找到它的方式。如果你没有在你的网站上正确的呈现内容,谷歌机器人将无法看到它。

这里有一些选项可以帮助您

1。网站:订单

首先,site:该命令将显示Google当前为您的站点工作的页面数。如果站点的许多页面还没有被索引,这可能是内部链接问题的迹象。

其次,您可能需要检查由javascript本身加载的内容是否已被Google编入索引。

要做到这一点,您需要找到一行文本,这些文本不会显示在初始HTML代码中,并且只会在JavaScript执行之后加载。然后,使用站点:yourdomain。在谷歌索引中搜索这行文本的COM命令。

请注意,这不适用于cache:commands,因为缓存的页面版本只包含未经处理的原始代码。

2铬41

2017年8月,谷歌更新了其搜索指南,并宣布他们正在使用Chrome41展示它。这是对SEO的一个改变,因为现在你可以检查谷歌如何渲染页面,而不是猜测。

现在你可以下载chrome 41,看看google bot是如何渲染和查看网站或网页的。

三。铬焊机

JavaScript代码的某些部分可能被编程为执行用户特定的操作-单击、滚动等。但是,Google Bot不是用户,它不单击或向下滚动,因此它看不到您正在加载的内容。

检查是否在没有任何用户操作的情况下加载所有基于javascript的元素的最快和最简单的方法是使用chrome开发工具:

用Chrome打开你的网站

在devtools中打开元素选项卡

通过查看浏览器构建的实际页面的DOM查看如何呈现页面-确保所有关键导航和内容元素都已存在。

我建议你在Chrome41中检查一下,它会让你相信GoogleBot可以从技术上看到这个元素。

当然,您也可以在当前版本的Chrome中进行检查和比较。

4。谷歌搜索控制台的抓取与展示

谷歌搜索控制台中的捕获和呈现功能允许我们了解谷歌如何呈现我们的网站。

首先,您必须复制并粘贴您的网址。然后单击“提取并渲染”并等待一段时间。这将允许您查看谷歌机器人是否可以呈现您的网页和查看任何相关的文章、副本或链接。

在这里,您还可以使用谷歌的移动友好测试,它显示javascript错误和呈现的页面代码。

5。服务器日志分析

为了验证谷歌机器人是如何爬过你的网站的,你能做的最后一件事就是服务器日志分析。通过仔细查看服务器日志,您可以检查google bot是否访问过特定的网址,以及google bot是否检索过任何网址。

在服务器日志中,您可以分析许多元素。例如,您可以检查

javascript学习方法指南的更多相关文章

  1. JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...

  2. JavaScript权威指南 - 对象

    JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可删. JavaScript中的所有事物都是对象:字符串.数字.数组.日期,等等. JavaScript对象除了可以保持自 ...

  3. JavaScript权威指南 - 数组

    JavaScript数组是一种特殊类型的对象. JavaScript数组元素可以为任意类型,最大容纳232-1个元素. JavaScript数组是动态的,有新元素添加时,自动更新length属性. J ...

  4. 《javascript权威指南》读书笔记——第二篇

    <javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字 ...

  5. 《javascript权威指南》读书笔记——第一篇

    <javascript权威指南>读书笔记——第一篇 金刚 javascript js javascript权威指南 由于最近想系统学习下javascript,所以开始在kindle上看这本 ...

  6. 【转】JavaScript 风格指南/编码规范(Airbnb公司版)

    原文转自:http://blog.jobbole.com/79484/ Airbnb 是一家位于美国旧金山的公司,本文是其内部的 JavaScript 风格指南/编码规范,在 Github 上有 11 ...

  7. Javascript权威指南

    一.数字写法 3.14 2345.789 .333333333333333333 6.02e23 // 6.02 × 10 23 1.4738223E-32 // 1.4738223 × 10 −32 ...

  8. 《JavaScript权威指南 第六版 中文版》(一)

    <JavaScript权威指南 第六版 中文版> 第二章 词法结构 2.1字符集 JavaScript是使用Unicode字符集编码写的. 2.1.1区分大小写 JavaScript是区分 ...

  9. javascript权威指南(中文版)中的一些错误(一)

    本人目前正在学习js,使用的是javascript权威指南(中文版),学习的时候发现一些细节上的错误,若是我的错误,欢迎指正 1.P11------多了“我们称为 原文为 return Math.sq ...

随机推荐

  1. SpringCloud(六)之 网关概念、Zuul项目搭建-(利用Zuul 实现鉴权和限流实战)

    一.网关概念 1.什么是路由网关 网关是系统的唯一对外的入口,介于客户端和服务器端之间的中间层,处理非业务功能 提供路由请求.鉴权.监控.缓存.限流等功能.它将"1对N"问题转换成 ...

  2. 基于MybatisUtil工具类,完成CURD操作

    package loaderman; import java.io.IOException; import java.io.Reader; import java.sql.Connection; im ...

  3. Handler注意事项

    一. Handler与Thread的区别. Handler与调用者处于同一线程,如果Handler里面做耗时的动作,调用者线程会阻塞.Android UI操作不是线程安全的,并且这些操作必须在UI线程 ...

  4. 11 MySQL之性能优化

    01-优化简介 MySQL数据库优化是多方面的,原则是减少系统瓶颈,减少资源的占用,增加系统的反应速度. 1.通过优化文件系统,提高磁盘I\O的速写速度: 2.通过优化操作系统的调度策略,提高MySQ ...

  5. swoole详解

    1.swoole结构图 2.swoole流程图 3.详细流程图 3.1.Master:处理核心事件驱动(主进程)3.2.Reactor: 处理TCP连接,收发数据的线程.Swoole的主线程在Acce ...

  6. maven-1-是什么

    背景 1.1. 场景 假如你正在Eclipse下开发两个Java项目,姑且把它们称为A.B,其中A项目中的一些功能依赖于B项目中的某些类,那么如何维系这种依赖关系的呢? 很简单,这不就是跟我们之前写程 ...

  7. 【Hadoop】MapReduce自定义分区Partition输出各运营商的手机号码

    MapReduce和自定义Partition MobileDriver主类 package Partition; import org.apache.hadoop.io.NullWritable; i ...

  8. ASP.NET Core 入门笔记6,ASP.NET Core MVC 视图传值入门

    摘抄自:https://www.cnblogs.com/ken-io/p/aspnet-core-tutorial-mvc-view-renderdata.html 如有侵权请告知 一.前言 1.本教 ...

  9. 【VS开发】VSTO 学习笔记(十)Office 2010 Ribbon开发

    微软的Office系列办公套件从Office 2007开始首次引入了Ribbon导航菜单模式,其将一系列相关的功能集成在一个个Ribbon中,便于集中管理.操作.这种Ribbon是高度可定制的,用户可 ...

  10. Linux-android 模拟器使用

    1.把sdcard挂载到一个文件夹 mkdir sdcard sudo mount -o loop sdcard.img sdcard 日志在sdcard下lm-kill文件下查看 注解: http: ...