我有两个元素（菜单项）需要在响应式设计中移动（现在只有两种变体，假设一个宽度超过 750 像素，另一个小于 750 像素）：
我应该有两个单独的 html 块，每个变体一个，并根据设计大小隐藏/显示它们吗？
或者我应该只有一种 html 块和 css 样式可以使用位置？最后一个选项与我计划的设计有点复杂，所以真正的问题可能是：拥有两个不同的 html 块是否太糟糕了？该页面将有 javascript 和 ajax 交互，虽然我不确定到什么程度。先感谢您。
问问题
1044 次
4 回答
3
对于响应式设计，我尝试牢记一些经验法则：
- 尽可能将其保存在 CSS 中。如果你的标记是健全的，你可以通过改变 CSS 来控制这么多。推论：不要过度污染 HTML。
- 尽量减少发送到浏览器的数据量。移动数据连接速度缓慢、不可靠，并且越来越受到数据限制和限制。
- 页面应该是合理的，没有任何 CSS。想想 Googlebot 或屏幕阅读器会“看到”什么。任何网站都应该如此，但这并不意味着它经常如此。
基于这些，我会说不要使用两个单独的 HTML 块。
于 2012-04-24T03:46:51.243 回答
1
根据我的观点，使用两个 html 块不是一个好主意...在决定隐藏哪个和显示哪个时可能会造成混淆...但是在不了解您的设计和目的的情况下，无法决定.. .但一般尽量避免两个或更多的html块......
于 2012-04-24T04:09:26.070 回答
1
说明它是否“坏”是主观的，并且与您的目标有关。从可访问性的角度来看，相同的标记出现两次并只是切换隐藏一个或另一个并不理想，但是如果不了解更多关于您的设计的细节，很难确定它应该或不应该是做了一个特定的方法。我会说，一般来说，它不应该那么困难，因为你的标记不应该根据布局或设计来构建。
于 2012-04-24T03:44:11.857 回答
1
我认为这取决于你如何改变设计。如果只是设计具有不同的宽度、高度、图像等的情况，那么拥有多个 HTML 将违反编程的标准规则之一：
http://en.wikipedia.org/wiki/Don%27t_repeat_yourself
但是，如果设计差异是结构性的，那么使用不同的 HTML 就可以了，而不是试图通过 CSS 来强制它。
顺便说一句，如果可能，通过 CSS 实现的一个好处是，当您的老板（不可避免地）出现并要求提供专门为 1024 像素或更宽的设备设计的第三个版本时。如果您选择了 CSS 路线，那么添加另一组尺寸将需要几分钟的工作。使用 HTML 路由，您将被锁定，使一切变得更加复杂。
于 2012-04-24T03:54:27.840 回答