响应式网站制作的提示

Question

我是网络开发的新手，但我对这个领域非常感兴趣，关于制作响应式网站。

当您隐藏html元素（用于桌面视口）并在较小的屏幕尺寸上显示另一个html元素时，即使两个元素具有相同的内容（例如联系表单），这是一种很好的编程习惯吗？我确实隐藏了“html元素”，因为我发现使用媒体查询很困难......

注意：问题实际上与我试图隐藏或显示的html元素的内容无关。我只是想知道这样做是否是编程的好习惯？谢谢

Answer 1

没有

你必须发送两次标记，这会使用更多的带宽，当CSS没有被应用时（例如，如果它被搜索引擎索引机器人或使用Lynx的人读取）那么内容是复制。

人们通常希望这样做，因为他们想要重新排序内容。看看使用Flexbox（包括order属性）来代替。

Answer 2

答案不是，这不是好习惯。您需要尽量避免为桌面和移动设备复制相同的逻辑元素。尝试使用一个元素并使用媒体查询进行调整。

Answer 3

通常，处理响应式设计的最佳方法是尽可能避免隐藏和显示内容。通常最好设计您的网站以适应调整大小或重新排序元素，而不是简单地在某些屏幕上删除它们（特别是在您似乎要询问是否应该显示具有相同内容的元素的位置？）

显然这里的例外是下拉导航菜单。

这就是人们倾向于说你应该先设计手机的原因。这样，只有最重要的元素存在，而你不仅仅是不必要地隐藏元素。

我希望这是有道理的。您似乎已经理解了媒体查询，因此我建议您使用更改元素进行练习，而不是隐藏和显示它们。这种方法对于代码的可访问性和可读性来说并不是那么好。

Answer 4

我认为这不是一个好习惯。你的HTML变得臃肿，没有代码的重要性。

遍历你的html树结构也会遇到更多困难。毕竟这不是一个好习惯。只是尝试使用技巧和黑客来达到你想要达到的相同效果。