search引擎是否会在Bootstrap选项卡中看到我的dynamic创build的内容?

我有一个页面index.php有3个Bootstrap选项卡,每个选项卡都是在用户点击之后生成的。
例如:

  • 当页面加载时,我将执行SQL查询,将只从第一个选项卡的数据库中获取数据。
  • 当用户点击第二个选项卡时,我正在执行一个查询,它将采集数据并将其显示在选定的选项卡中。

这是好的方法吗? 当索引包含所有这些选项卡的页面时,Google是否也会查看所有数据? 由于性能问题,我不想立即提取所有数据。

这里是我的示例代码,所以请告诉我,如果这是一个好方法:

index.php文件:

 <!DOCTYPE html> <html> <head> <title>Tabs demo</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> </head> <body> <div class="container"> <ul class="nav nav-tabs"> <li class="active"><a data-toggle="tab" href="#home">Home</a></li> <li><a data-toggle="tab" href="#menu1">Menu 1</a></li> <li><a data-toggle="tab" href="#menu2">Menu 2</a></li> </ul> <div class="tab-content"> <div id="home" class="tab-pane fade in active"> <h3>HOME</h3> <p>Some content.</p> </div> <div id="menu1" class="tab-pane fade"> <?php $model = [ 0 => ['title' => 'First item', 'content' => 'Some first content'], 1 => ['title' => 'Second item', 'content' => 'Some second content'] ]; ?> <?php foreach ($model as $data): ?> <h3><?= $data['title'] ?></h3> <p><?= $data['content'] ?></p> <?php endforeach ?> </div> <div id="menu2" class="tab-pane fade"> <h3>Menu 2</h3> <p>Some content in menu 2.</p> </div> </div> </div> <!-- jQuery library --> <script src="//code.jquery.com/jquery-2.1.4.min.js"></script> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> </body> </html> 

恐怕search引擎不会看到第二个和第三个标签的内容。 或者至less他们不会把它们和index.php页面联系起来。 我错了吗?

不,如果选项卡下的内容是dynamic生成的(即不是隐藏的),我们(Google)将不会看到标签后面的内容。

您还可以在Search Console(以前的网站pipe理员工具)中使用“Google抓取方式”function查看我们“看到”的内容; 使用Google抓取方式阅读我们的post中的更多function。

最好的办法是devise网站的工作没有JavaScript,只是取代所有的锚点元素与Ajax工作传递一个GETvariables到您的Web控制器,所以它知道要返回的HTML插入JavaScript。

如果您使用的是JS / AJAX,(我真的没有看到,但我想不出更好的select),您将很难让Google为您的页面编制索引。 谷歌有一个很好的文档,在过去帮助我有类似目标的项目。

https://developers.google.com/webmasters/ajax-crawling/docs/learn-more

是否真的是一个很大的交易,不加载内容,直到点击标签? 除非你正在处理一个不可caching的不断更新的数据库和大量的HTML输出,这将创造一个无形的内容长闪光我会说分裂标签视图代码是有点微不足道的。

也许这可以帮助:

如果您的问题是性能问题,那可能是因为您拥有强大的数据库查询或共享服务器。 如果没有,请忽略此。

加载整个页面时,请在每个选项卡中添加一个“假”HTML代码。 尝试构buildHTML代码,形成每个选项卡被单击时加载的实际代码。 把所有这一切都放在一个无形的DIV中。 每次页面加载时,也放一些随机数据(可能是一个16字符的随机生成的string)。 通过这种方式,我认为Google会更频繁地抓取您的数据(这不会发生在静态内容中)。

问候。