在设计响应式网站时，我们倾向于专注于在当今世界各种屏幕宽度内保持内容的格式。这是有道理的，因为水平滚动不是特别用户友好的，因此将设计约束到浏览器的视口宽度通常是给定的。
在较小的屏幕上，将东西堆叠到单个列中是移动，并且通常，只要内容保持在适当的宽度内，进一步认为页面的高度不被赋予。结果，我注意到，在我自己的设计和许多在野外，移动页面长度往往是相当长的。这个帖子是一个建议，至少保持浏览器视口的高度，因为您正在设计响应式网站。
但是如果你把它拉到你的手机上，你可能会注意到需要相当多的滚动才能看到整个页面。在我的Macbook上，页面大约是4500像素高，大约是浏览器窗口可视高度的6倍。相比之下，在我的手机上，页面高约6,200像素，或大约是可见高度的10倍。这不是内在的坏; 没有设计法规定您必须使网站在不同尺寸的设备上保持高度，但我认为深入了解这是一个有趣的观察。
再次，我不认为整个页面长度本身是有问题的。我已经注意到，在许多响应式设计中，有意义的内容分组容易在较大的屏幕上发现，但是当事情开始在移动屏幕上堆叠时变得混乱。例如，在Nexus页面上，第二部分将三个硬件功能组合在一起。在一个足够大的屏幕上，您可以看到这三个块并排，并且该部分通常最终完全是浏览器可视区域的高度。在手机上，你最终只能看到一个块的一个块。当您浏览页面时，这3件事情并不是明确的，而是将它们分组在一起，而不是世界的尽头，但也不是最佳的。
最近，我一直使用设备视口的高度作为粗略的指导，以帮助确定如何布局内容。意图是解决上面提到的问题，可以在任何设备上同时合理地查看要组合在一起的内容。在Nexus示例中，替代原始设计可能看起来像这样。
通过大幅度缩小部分标题和缩略图的大小，我们可以将该部分的所有相同内容合并到单个视口中。这种改变本身可能只是一个小的增量改进，但总的来说，我发现遵循这个一般准则导致在滚动浏览移动设备页面时更容易遵循的布局。