Jquery 加载动画会影响搜索引擎优化吗?

Jquery 加载动画会影响搜索引擎优化吗?,jquery,animation,seo,onload,Jquery,Animation,Seo,Onload,让我们假设我对我的页面使用了一些加载动画,例如: $(document).ready(function() { $('html.myhtml').css('overflow', 'auto').fadeTo(0, 0, function() { $(this).css('visibility', 'visible').animate({ opacity: 1 }, 200); }); })​ 并从内联样式开始,首先将其隐藏

让我们假设我对我的页面使用了一些加载动画,例如:

$(document).ready(function() {
    $('html.myhtml').css('overflow', 'auto').fadeTo(0, 0, function() {
        $(this).css('visibility', 'visible').animate({
            opacity: 1
        }, 200);
    });
})​
并从内联样式开始,首先将其隐藏:

<html class="myhtml" style="visibility:hidden; overflow:hidden">

最初,页面将作为空白,然后使用
fadein
设置动画。我想知道:-

  • 这会以任何方式影响SEO吗
  • 这种做法是好的,还是有一些重要的理由不这样做

    • 这不会影响它。出于同样的担忧,我个人通过微数据测试了谷歌机器人的读数。谷歌现在实际上在某种程度上可以看到javascript交互,甚至swf文件。所以你应该清楚了。

      据我所知,谷歌只识别页面的初始状态。这包括CSS呈现,例如,如果添加
      display:none或<代码>可见性:隐藏,我不认为谷歌会索引它

      为了安全起见,我会在加载时隐藏内容,然后淡入。我还没有真正测试过它,但我从未见过谷歌的机器人程序与JavaScript的交互太好。使用hashbang方法时出现了一个异常


      这种方法的另一个好处是,禁用javascript(我知道,duh)的用户仍然能够看到您的内容,因为它不会被隐藏在第一位。

      我建议您看看:


      很遗憾,我没有你问题的SEO答案,但解决办法是使用负边距将元素隐藏在屏幕外。然后当javascript启动时,设置正确的位置并隐藏,然后淡入或做任何你想做的事情。

      我认为你应该注册到谷歌网站管理员工具。然后找到一个名为“作为googlebot获取”的函数,现在让google去获取您想要的页面,看看它是否发现任何错误或异常行为,或者它没有显示您预期的内容。如果是这样的话,你可以确定你的页面有问题,谷歌会告诉你在抓取你的页面时遇到了什么问题。那就是纠正你的问题了

      编辑:使用javascript的搜索引擎的主要问题是js在获取和阅读页面内容时会造成障碍。具体地说,当实际页面上没有内容,并且您使用js从其他地方获取内容时(因此出现ajax seo问题),就会出现这个问题。因此,人们应该关注将内容放在页面上,而不是从其他地方获取

      所以你也应该在关闭js和css的情况下测试他们的页面,看看当谷歌和其他搜索引擎看到你的页面时他们的页面是什么样子。所以,在经历了所有这些花哨的动画、抓取和其他东西之后,如果谷歌仍然能够阅读、抓取和索引你的页面,那么我一秒钟都不会担心,你也不会。毕竟,如果谷歌很好,那么我们就很好了

      它会影响搜索引擎优化吗

      如果我必须回答是或否,那么我会说:不

      这种做法是好的,还是有一些重要的理由不这样做

      我们可能整天都在争论动画,但仍然没有确定的答案。动画淡入淡出对搜索引擎有什么作用?没有一个因此,它应该是为了用户的享受?动画淡入淡出对用户有什么用途?没有一个因此,如果我们采用“为用户而不是搜索引擎设计”的模式,我可能会删除动画。这是我的意见

      回到SEO问题,它会影响SEO吗?不完全是,但这取决于搜索引擎和你的受众。如果我是一个使用屏幕阅读器的人,我可能不会从你的页面中受益,因为我的屏幕阅读器会失败。如果禁用javascript,将损害我的用户体验(我个人使用FF NoScript插件浏览)

      我知道你说过没有javascript的用户在你的网站上没有业务,但是你应该考虑到这一点,并以某种方式处理它。此外,Googlebot在爬行时没有启用javascript或会话cookie。第二,如果你的一个js失败了,你可能想让它优雅地退回到一些对用户有用的东西,或者至少是一些让他们知道的指令,比如“欢迎!我们这里有你的浏览器不支持的fancypants动画!请启用“javascript”

      强制动画通常对用户来说很烦人,尤其是当他们重复每次加载页面时。增加页面负载对谷歌搜索引擎优化不利,因为速度现在是排名的一个因素

      正如我提到的,Google主机器人不会在启用javascript或会话cookie的情况下爬行。它们有不同的爬虫程序用于不同的目的,比如一些只用于移动,一些用于js,一些用于flash。值得注意的是,加载动画/弹出窗口/或任何内容都会被“Google Instant Previews”捕获,并在结果中显示给用户(在您的情况下,它可能看起来像一个空白页面)。正如前面提到的,一般来说,使用文本缩进或负边距作为初始状态比使用可见性/显示/溢出更安全

      我会这样做():

      
      .myhtml{可见性:隐藏;溢出:隐藏;}
      document.documentElement.className='myhtml'
      1.html最初不隐藏,也没有类
      2.css styles register.myhtml类包含您想要的隐藏内容
      3.在BODY标记之前的script标记将启动并将类添加到html中,从而隐藏启用javascript的类的内容。其他所有禁用JS的人都可以正确地查看页面。
      4.在页面底部,jquery激发页面动画
      $(文档).ready(函数(){
      $('html.myhtml').css('overflow','auto').fadeTo(0,0,function()){
      $(this.css('visibility','visible')。动画({
      不透明度:1
      }, 200);
      });
      })​
      
      如果用户已停用javascript,则他们在我的网站上无事可做。也许谷歌以前是按照你说的方式做的,但是这个问题
      <html>
      <head>
      <style>
      .myhtml {visibility:hidden; overflow:hidden;}
      </style>
      <script>document.documentElement.className='myhtml'</script>
      </head>
      <body>
      
       1. html is not hidden initially and no class
       2. css styles register .myhtml class with the hidden stuff you want
       3. the script tag just before the BODY tag will fire and add the class to html thus hiding things for those with javascript enabled. Everyone else who has JS disabled sees the page properly.
       4. at the bottom of the page your jquery fires animating the page
      
      <script>
      $(document).ready(function() {
          $('html.myhtml').css('overflow', 'auto').fadeTo(0, 0, function() {
              $(this).css('visibility', 'visible').animate({
                  opacity: 1
              }, 200);
          });
      })​
      </script>
      </body>
      </html>