Javascript 使用sessionStorage来显示/隐藏“a”的主页内容是否不好；“启动页”；？

我们的老板最近要求我们的开发团队为我们的网站主页创建一个他称之为“启动页”的页面。不是旧版的独立重定向启动页。相反，首页访问者一开始只会看到一条硬销售、行动号召“splash”消息，带有两个按钮：一个

mailto

链接和一个“Enter Site”按钮。如果单击“进入网站”按钮，硬销售消息将消失，同时显示“常规”主页内容

团队成员设计的解决方案是有一个

#hardsell

div和一个

#main

content div（包括站点标题和导航）。两个div都使用内联CSS设置了

display:none

使用

sessionStorage

切换两个div之间的可见性。这样可以避免设置cookie

function splashCheck() {
    var readValue = sessionStorage['myvariable'];
    if (readValue === "splash") {
        $("#main").css( "display", "block" );
    } else {
        $("#hardsell").css( "display", "block" );
            var myVariable = "splash";
            sessionStorage['myvariable'] = myVariable;
        }
}
splashCheck()

这非常简单，但我关心两件事：

在

#main

和

#hardsell

divs上显示

display:none

，意味着在

splashCheck（）函数启动之前没有可见内容。如果禁用javascript，则什么也看不到

搜索引擎优化：谷歌机器人和其他爬虫会在这个页面上看到什么？没有什么？（糟糕！）只有

#硬卖

内容？（也很糟糕！）主要内容是什么？（首选！）两套内容？（可以接受！）

我找不到一个明确的答案，谷歌将和不会爬行在这种情况下。谷歌机器人可能会像手风琴一样抓取隐藏内容，但谷歌文档也表示，机器人“可能有”动态隐藏部分的问题

---

我的担心是没有根据的吗？有没有一种方法可以通过sessionStorage做到这一点，让谷歌抓取

#main

内容，同时在初次访问时向访问者展示

#hardsell

。 在使用SPA（如react或angular）时，经常会问同样的问题

---

正如@Emiel Zuurbier评论的那样，“禁用CSS和JavaScript，并刷新页面。这就是谷歌将看到的。”。不是100%正确，你真的认为谷歌爬虫不能阅读javascript内容吗？我们会说，js内容让爬虫很难阅读内容

回答你的问题：

使用sessionStorage来显示/隐藏“启动页”的主页内容，这是不是不好的SEO？ 会话存储，否。 Javascript动态内容，是的

我建议你读这篇文章

根据SEO专家巴里·亚当斯（Barry Adams）的说法，基于React的SPA（以及其他基于JavaScript的SPA）不能很好地使用谷歌的爬虫

TLDR

一旦HTML被提供给网络爬虫（即使你是 用CSS隐藏某些部分）你应该很好，并且会有你的 页面索引

如果它将使用单页应用程序框架（SPA）构建，我建议您使用服务器端呈现（SSR）实现，而不是使用NextJS或Nuxt，它将提供web爬虫可以索引的实际HTML内容

底线是，一旦你在纯HTML中提供了内容，你就没事了

有计划使SPA在中可索引，但在撰写本文时，最好坚持使用最有效的（包含Meta和SEO相关Meta的纯HTML）或SSR实现

SPA（网络爬虫没有HTML内容）

SSR（特别是下一步）-网络爬虫的内容

香草，HTML/CSS/JS-用于网络爬虫的内容

---

对于我的拙劣问题，答案是“如果使用JavaScript检测，情况还不错。”正如@EmielZuurbier在对最初问题的评论中所建议的：

为了兼容性，您可以检查JavaScript是否已启用，然后使用初始屏幕。如果JS被禁用，则使其无需启动屏幕即可使用。这样每个人都可以使用这个网站

---

禁用CSS和JavaScript，并刷新页面。这就是谷歌将看到的。@EmielZuurbier正是如此@EmielZuurbier-您的建议显示了一个页面，其中两个div的内容都是可读的，这是令人欣慰的。我仍然担心，如果关闭JS，访问者将什么也看不到，但是现在有多少人禁用了javascript？我想可以肯定地说，这一比例相当小。然而，为了兼容性起见，您可以检查JavaScript是否已启用，然后使用初始屏幕。如果JS被禁用，则使其无需启动屏幕即可使用。这样每个人都可以使用这个网站。@EmielZuurbier-太棒了！这就是解决方案。谢谢大卫吉玛国王，但这只是一个古老的多页面网站；我们没有计划把这里建成温泉。@divvuk-alright你是对的；我的声明并没有完全涵盖搜索机器人看到或不看到的内容，因为它们在处理JS支持的网站方面已经变得更好了。然而，在OP的情况下，这不是该网站拥有的功能。谢谢，Stanley，但是尽管React/Angular/SPA对可见性问题有一些影响，但所讨论的网站只是普通的旧文件，有一点JS修改了主页@上面埃米尔·祖尔比尔的建议呈现了一个显示两个div内容的页面，因此，如果这是谷歌将爬行的内容的准确表示，我想我不太关心它，尽管它仍然让我感到不安，一个关闭javascript的实际访问者什么也看不到。@divvuk-aha，这是有道理的！公平地说，任何人在没有javascript的情况下浏览互联网都看不到太多内容