jquery onload动画会影响SEO吗？

hts6caw3 于 2023-08-04 发布在 jQuery

关注(0)|答案(7)|浏览(120)

让我们假设我为我的页面使用一些加载动画，例如：

$(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产生影响？
这种做法是好的，还是有一些有分量的理由不这样做？

jquery

来源：https://stackoverflow.com/questions/12607632/does-onload-animation-affect-seo

7条答案

按热度按时间

uidvcgyl1#

不会有影响的。出于同样的考虑，我亲自通过微数据测试了谷歌机器人的读数。Google现在实际上在某种程度上可以看到JavaScript的交互，甚至swf文件。所以你应该是清白的。

赞(0）回复(0）举报 2023-08-04

b4lqfgs42#

它影响搜索引擎优化吗？
如果要我回答是或否，我会说：不需要
这种做法是好的，还是有一些有分量的论据不这样做？
我们可以为动画争论一整天，但仍然没有确切的答案。动画淡出对于搜索引擎有什么作用？没有。所以它应该是为了用户的享受？动画淡入淡出对用户有什么作用？没有。所以如果我们采用“为用户而不是搜索引擎设计”的模式，我可能会删除动画。这是我的看法。
回到搜索引擎优化的问题，它影响搜索引擎优化？不是真的没有，但这取决于搜索引擎和你的观众。如果我是一个使用屏幕阅读器的人，我可能不会从你的页面中受益，因为我的屏幕阅读器会失败。如果我禁用了JavaScript，它会伤害我的用户体验（我个人使用FF NoScript插件浏览）。
我知道你说过没有JavaScript的用户在你的网站上没有业务，但是你应该考虑到这一点，并以某种方式处理它。此外，Googlebot在爬网时也没有启用JavaScript或会话cookie。其次，如果你的一个js失败了，你可能希望它优雅地回落到一些可用的用户或至少一些指令，让他们知道像“欢迎！如果您的浏览器不支持跳转，请点这里.请启用javascript“。
强制动画通常会让用户感到厌烦，尤其是当它们重复加载每个页面时。增加页面负载对Google SEO不利，因为速度现在是排名的一个因素。
就像我提到的，主Googlebot不使用启用JavaScript或会话cookie进行抓取。他们有不同的爬虫用于不同的目的，像一些只是为移动的和一些为js和一些为flash。值得注意的是，有一个动画/弹出窗口/或任何加载将被捕获的'谷歌即时预览'，并显示给用户的结果（在您的情况下，它可能看起来像一个空白页）。就像WDever提到的，一般来说，使用文本缩进或负边距作为初始状态比使用可见性/显示/溢出更安全。
这是我的做法（here's a live preview with 4 second animation delay to test with and without js enabled）：

<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>

字符串

赞(0）回复(0）举报 2023-08-04

wmomyfyw3#

我认为你应该注册谷歌网站管理员工具。然后找到一个名为“Fetch as googlebot”的函数，现在让谷歌去获取你想要的页面，看看它是否发现任何错误或不寻常的行为，或者它没有显示你所期望的。如果是这样的话，你可以肯定的是，有一些错误与您的网页和谷歌会告诉你什么问题，它面临着，而抓取您的网页。那就得解决你的问题了

**编辑：**使用JavaScript的搜索引擎的主要问题是，js在获取和阅读页面内容时会产生障碍。具体地说，这个问题主要出现在实际页面上没有内容，而你使用js从其他地方获取内容的时候（因此 AJAX seo问题）。因此，我们应该关注的是将内容放在页面上，而不是从其他地方获取内容。

所以你也应该在js和css关闭的情况下测试他们的页面，看看当google和其他搜索引擎看到你的页面时，他们的页面看起来是什么样子的。因此，在所有花哨的动画，抓取和其他东西，如果谷歌仍然能够阅读，抓取和索引您的网页比我不会担心一秒钟，你也不应该。毕竟，如果谷歌很好，我们就更好了。

赞(0）回复(0）举报 2023-08-04

l7wslrjt4#

我建议你看一下：
http://searchengineland.com/google-io-new-advances-in-the-searchability-of-javascript-and-flash-but-is-it-enough-19881

赞(0）回复(0）举报 2023-08-04

cgyqldqp5#

据我所知，Google只识别页面的初始状态。这包括CSS渲染，例如，如果你添加display:none;或visibility:hidden;，我不认为谷歌会索引它。
为了安全起见，我会在加载时隐藏内容，然后淡入。我还没有真正测试过它，但我从来没有见过谷歌的机器人与JavaScript交互得太好。在使用hashbang方法时，似乎有例外。
这种方法的另一个好处是，JavaScript被停用的用户（我知道，duh）仍然可以看到你的内容，因为它不会被隐藏在第一位。

赞(0）回复(0）举报 2023-08-04

polkgigr6#

我不确定这些答案是否正确。谷歌仍然能够抓取你的内容，不管它是否使用动画淡入。
然而，在我看来，长动画仍然会在给定的时间内延迟交互和可读性，这可能会导致INP（与下一次绘制的交互）和FCP（第一次内容绘制）的评分不佳。

赞(0）回复(0）举报 2023-08-04

pieyvz9o7#

我很遗憾没有SEO回答你的问题，但一个解决方案是使用负边距来隐藏屏幕上的元素。然后当JavaScript踢在你设置正确的位置和隐藏，然后你淡入或做任何你想做的。

赞(0）回复(0）举报 2023-08-04