Question

我正在迁移桌面网站，以通过一组单独的网址支持移动设备。在网站的根目录，我使用媒体查询来检测用户是移动用户还是桌面用户，然后重定向到相应的区域。

出于某种原因，桌面版Googlebot（使用谷歌搜索控制台的'抓取谷歌'）将作为移动设备实现。它基于以下媒体查询被检测为移动设备......

@media all and (max-width: 1024px) {  ... }

我能够确定视口宽度/高度是1024 x 768.因此，Googlebot桌面即将使用平板电脑尺寸。

当使用“获取谷歌”作为智能手机时，它会以980 x 1743的形式出现。根据媒体查询，这被正确检测为移动设备......

@media all and (max-width: 768px) { ... }

是什么给出的？我是否需要为Googlebot进行特殊用户代理检查以检测桌面或移动设备？

检测适用于Googlebot的移动设备或桌面的更好方法是什么？不希望不必检查不同移动设备用户代理的1000个可能字符串。媒体查询检查在真实设备上运行良好。

Answer 1

您可以使用orientation查询：

@media all and (orientation: portrait) {
  p {
    color: red;
  }
}

@media all and (orientation: landscape) {
  p {
    color: purple;
  }
}

<body>
  <p>Resize to change color</p>
</body>