css - 媒体查询工作流程和标准做法？

Question

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

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

从更大/更小的屏幕开始工作会更好吗？您对性能、加载速度和编码难度有何看法？

Answer 1

这远远超出了响应式布局甚至 CSS。您应该根据最常用的方式优化任何内容。如果我正在制作一个大多数用户都想通过手机使用的网站，那么当然，我会先从手机版开始开发！我的理由是，随着屏幕尺寸变小，事情会如何退化，往往会有一些权衡（尽管很小）。为了确保权衡有利于移动版本，最好从那里开始并朝着桌面版本努力。但是，我总是发现自己处于从桌面尺寸开始最实用的情况下，然后我减小屏幕尺寸并使用媒体查询根据自己的喜好重新设置样式 - 减小屏幕尺寸、重新设置样式等。听起来是这样的

不管你选择什么，如果你写的是合理的代码，性能会很好，代码应该是可以理解的。

Answer 2

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