移动设备和桌面设备有什么区别？

Question

使用Chrome浏览器开发者工具，我想在模拟设备选项卡中添加自定义设备。 您可以选择多个选项，例如宽度和高度。并且还可以在以下选项之间进行选择：

• 移动设备
• 移动设备（无触摸）
• 桌面设备
• 桌面设备（触摸）

因此，移动设备和桌面设备之间的区别似乎不是触摸事件。

---

一个1000*1000像素屏幕大小的没有触摸功能的设备是移动设备吗？

一个1000*1000像素屏幕大小的桌面设备是一样的吗？

或者一个1000*1000像素屏幕大小的移动设备和一个1000*1000像素屏幕大小的带触摸功能的桌面设备是一样的吗？

---

我的问题是：

从技术角度来看，桌面版和移动版有什么区别？

请解释这个概念上和在 DevTools 中的差异（我特别感兴趣）。

---

奖励编辑:

在回答其他问题后，我产生了这个疑问，并且看到谷歌、亚马逊和可能其他一些大公司在显示页面时的区别。这不是屏幕大小的区别，而是设备类型的区别（如果我理解正确的话）。所以我想知道除了“移动设备可以移动”之外，它们是如何区分桌面和移动设备的技术方面。

- Alvaro

---

好问题。就仿真而言，我不知道有任何实质性的差异，但可以快速查看源代码以查找模式之间是否存在任何编程差异。等我有空闲时间时，我会去看一下。 - Gideon Pyzer

Answer 1

我查看了源代码。虽然有点复杂，但我没有发现任何大的区别，除了有一个包含“touch”和“mobile”选项的“capabilities”数组。当启用“touch”时，会模拟四个触摸事件。除此之外，似乎在不同模式下有一些不同的缩放逻辑。

不确定这是否有帮助。如果您或其他人对深入研究感兴趣，可以查看“inspector.js”，其中大部分逻辑包含在“_calculateAndEmulate”和“_applyDeviceMetrics”函数中。

- Gideon Pyzer

---

如果您能指定模拟哪些触摸事件，那将非常有趣。 - deblocker

Answer 2

面向桌面和移动端的设计

在网页浏览器中，移动设备和桌面设备之间最重要的区别是屏幕的物理尺寸。这与屏幕分辨率不同。

针对桌面设计时，界面应该在屏幕上同时包含更多扩展内容，而移动版本则将大部分内容隐藏在图标中，用户可以通过触摸来展开。相比之下，移动版本将进行空间优化。

事实上，当平板电脑拥有比标准屏幕尺寸更大的屏幕时，例如现在可用的带有可拆卸键盘的平板电脑，网站的移动版本可能会过度优化空间，这就是为什么浏览器允许平板电脑用户选择以桌面模式显示网站的原因。

移动设备的分辨率可能比桌面设备高，但由于桌面机器的屏幕（至少被认为）要大得多，因此使用桌面设备的人们习惯于在屏幕上同时查看更多扩展内容，而不是使用移动设备的人们。

主要考虑因素比较

桌面：

• 更大、多屏幕，可以同时显示更多的内容。
• 更多的输入 - 常见的输入方式是键盘。
• 悬停和点击链接 - 常见的输入方式是鼠标。
• 放置在桌子上。
• 重度使用。
• 硬件更强大（内存和处理能力更便宜）。
• 性能更强。

移动：

• 更小、单一屏幕，空间优化至关重要。
• 较少的输入 - 常见的输入类型是触摸屏幕。
• 触摸和手势。
• 放在口袋里。
• 偶尔使用。
• 硬件能力较弱。即小型和冷却运行的内存和处理意味着您得到的性价比更低。
• 功耗效率更高。

- WonderWorker

---

非常好的回答。不过我不确定在移动设备上的“随意使用”。 - Alvaro

你有关于这个的任何资源吗？ - Alvaro

@Alvaro 谢谢你的赞美和建议。计算机驱动设备的多功能性越来越广泛。因此，当我创造“休闲使用”这个词语时，我的意图是传达三个主要移动操作系统上最受欢迎的应用程序与其桌面版本相比明显变得更加精简的方式，但我的观点显然受到了我数字和印刷媒体背景的影响。它们有很多用途，几乎不可能考虑到所有用途。我非常想听听你的观点，以帮助我重新思考我的措辞。 - WonderWorker

这是移动设备和桌面设备之间差异的描述。我认为OP（以及我）想要更多关于技术差异的信息，例如不同设备上视口的处理方式（以及Dev Tools中不同的设置）。 - Bennett McElwee

是的，这并没有真正回答关于Chrome开发工具的问题。 - Drazen Bjelovuk

Answer 3

一个主要的区别是Chrome发送的User-Agent请求头。

如果你选择Mobile，你会得到类似这样的内容：

Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko)
  Chrome/46.0.2490.76 Mobile Safari/537.36

而对于 桌面版，它将会是这个样子：

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)
  Chrome/54.0.2840.99 Safari/537.36

(当然，具体取决于您的操作系统、Chrome版本等。)

因此，如果您正在进行服务器端用户代理嗅探等测试/调试工作，这将有所帮助。(例如为桌面设备和移动设备提供不同内容，重定向到移动子域等目的)

- CBroe