文章/答案/技术大牛

发布

社区首页 >问答首页 >Googlebot-mobile看起来不像Chrome开发者工具的设备模式

问Googlebot-mobile看起来不像Chrome开发者工具的设备模式
EN

Stack Overflow用户

提问于 2016-03-20 02:39:07

回答 1查看 162关注 0票数 1

谷歌一直抱怨我的网站对移动设备不友好。这是他们告诉我的，我的网站上的一个随机页面对Google Bot mobile是什么样子的：

下面是相同的页面在Google Chrome开发人员工具设备模式中的外观：

我已经为我的网站实现了响应式设计，尽管它还不是100%完美的(正如你可以看到的，内容比第二张图片中的屏幕略宽)，但它看起来肯定不像Google Bot mobile告诉我的那样。当我在一个真实的移动设备上测试它时，它看起来和Google Chrome开发者工具的设备模式一模一样。

你知道这里会出什么问题吗？

以下是报头中的重要部分：

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1" />
<meta name="mobile-web-app-capable" content="yes">

<link rel="stylesheet" media="all" href="/css/base.css" />
<link rel="stylesheet" media="(max-width:880px)" href="/css/dropdown.css" />
<link rel="stylesheet" media="(max-width:880px)" href="/css/mobile.css" />

mobile.css是base.css的一个“附加组件”，它取代了需要更改的东西，但base.css提供了“默认值”，并且总是加载的。

这就好像谷歌移动机器人没有触发mobile.css的加载。

seo

googlebot

mobile

回答 1

Stack Overflow用户

发布于 2016-03-20 20:40:22

我最终设法解决了这个问题--原来这是一个Googlebot mobile不喜欢的min-width: auto;。

出于某种原因(当我第一次开始实现我的响应式设计时，为了解决平板电脑上的问题)，我把

body{
    min-width: 1510px;
}

在我的桌面CSS中，并用以下命令覆盖它

body{
    min-width: auto;
}

在我的手机CSS中。将移动CSS更改为

body{
    min-width: 100%;
}

Googlebot可以正确显示页面。我将看看我是否可以安全地抛弃<body>上的最小宽度。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/36107456

复制

相似问题

问Googlebot-mobile看起来不像Chrome开发者工具的设备模式
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Googlebot-mobile看起来不像Chrome开发者工具的设备模式EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Googlebot-mobile看起来不像Chrome开发者工具的设备模式
EN