媒体查询工作流程和标准实践？

Question

我正在做一个响应式的网站，但有一个问题总是困扰着我，那就是我们是否应该总是从较小的屏幕开始工作，并向更大的屏幕或其他方向移动？

对我来说，我发现在较大的屏幕上工作更容易，然后缩小浏览器屏幕并慢慢调整它。我这样做的原因是因为我可以更容易地保留我的原始pc屏幕的设计，如果我从较小的屏幕开始工作，调整它到原始pc屏幕设计将是困难的。

从更大/更小的屏幕开始工作更好吗？在性能、加载速度和编码难度方面，您的看法如何？

Answer 1

这远远超出了响应式布局甚至CSS。你应该根据它最常用的方式来优化任何东西。如果我要做一个大多数用户都想从他们的手机上使用的网站，那么当然，我会先从手机版开始开发！我的推理是，当屏幕尺寸变小时，往往会有一些权衡(尽管很小)，因为事情会变得更糟。为了确保折衷有利于移动版本，最好是从移动版本开始，并朝着桌面版本努力。然而，我总是发现自己在这样的情况下，从桌面尺寸开始是最实际的，然后我缩小屏幕尺寸，并根据我的喜好重新设计媒体查询的样式-减小屏幕尺寸，重新设计样式，等等。这听起来像是你正在采取的方法，这应该是好的，除非一个项目从一开始就像我说的那样需要更多的关注移动设备。

无论您选择什么，如果您正在编写合理的代码，性能将会很好，并且代码应该是可理解的。

Answer 2

正如m59所说，从最常用的设备开始。一种可以从移动监控工作流程中受益的场景是，当您从头创建一个新站点时。这个场景更倾向于影响设计决策，因为通过启动移动，你包括了用户绝对必要的所有功能和内容-最基本的必需品。通过这种方式，您可以过滤掉进入某些桌面站点的任何填充物，从而使您的设计更加整洁，用户界面更加友好。此外，从移动开始，将允许您探索并增强未来的移动UI开发能力，而不仅仅是学习如何将其全部塞进去。