考虑到旧版浏览器,使用HTML5元素是否明智?

5

我在思考像<header><footer><article><section>和HTML5文档类型之类的东西。

现在设计页面有什么好处吗?老旧的浏览器会如何看到它们?它们能被验证吗?

我不确定这些东西有多大的向后兼容性。


谷歌停止支持IE6的Gmail,是时候我们放弃旧浏览器了。 - zzzzBov
5个回答

6
一种确保向后兼容性的好方法是使用像Modernizr这样的工具,它是一个JavaScript文件,可以告诉您用户的浏览器支持哪些HTML5 / CSS3功能,从而使您能够以一种优雅的方式设计您的代码,或者仅针对不同的浏览器使用不同的规则(例如,为支持该属性的浏览器创建使用border-radius的类,并为不支持该属性的浏览器创建使用基于图像的圆角的单独类)。请参考Modernizr网站

1
+1,但我编辑了你的链接文本,以便提供一些关于链接去向及其有用性的信息。希望你不介意?(如果你介意,我很抱歉践踏你的底线!)=) - David Thomas

2

尽管其他回复中提到的原因是值得的,但需要注意以下几个问题:

  • 如其他地方所述,不理解新元素的浏览器需要将display: block;添加到样式表中
  • 早期IE 9不允许您为未知元素设置样式,因此需要使用JavaScript hack。请参见HTML5 Doctor获取有关如何执行此操作的更多信息
  • BlackBerry浏览器(BlackBerry OS6之前)也不允许对其进行样式设置。我不知道任何解决方法。这是否对您有影响取决于您的站点有多少侧重于移动设备以及是否有单独的移动站点。 BlackBerry浏览器是一款流行的移动浏览器,但它需要一段时间才能在BlackBerry设备上获得使用Webkit内核的新BlackBerry OS系统。
  • 屏幕阅读器也不知道这些新元素。建议将它们与等效的ARIA角色配对,直到支持变得普遍为止。请参见HTML5、ARIA角色和屏幕阅读器 以获取更多信息。

我不知道使用HTML5文档类型存在任何缺点。我相信这是完全安全的。


2
您在帖子中提出了几个问题:
“现在使用HTML5设计页面有什么好处吗?”
答案是:是的。通过使用新的语义化网络,您可以赋予数据含义,从而使其产生奇妙的效果。
“旧浏览器如何看待它们?”
这要取决于浏览器。HTML规范指出,非标准的HTML元素应被忽略,就像它们从未存在于源代码中一样(除非有其他东西告诉它们不要这样做)。对于大多数符合规范的浏览器(如Firefox、Safari、Opera、Chrome),您必须在显示之前为HTML5元素设置一个显示样式才能显示它们。
section, header, footer, nav, article
{
  display: block;
}

请记住,这取决于浏览器是否符合规范,一些旧的浏览器 *咳咳* IE *咳咳* 有时并不遵循规范 (我有时怀疑IE开发团队是否曾经阅读过任何HTML规范)

它们可以被验证吗?

有点像……

HTML5规范尚未最终确定,但已经有许多在线HTML5验证工具可用。


有时我会想,IE开发团队是否曾经阅读过HTML规范。 - Valentin Despa

1

当然可以 - 许多浏览器已经实现了对 HTML 5 的部分支持,或者与其常见特性相关的功能,而且其中一些方式即使你将它们引入到不支持的浏览器中,也不会破坏任何东西。

像往常一样,您应该使用适当的特性检测,而不是全面的浏览器检测,来确定可用性 - 这样更不容易受到破碎的用户代理字符串等问题的影响。

有一个出色的指南Dive Into HTML 5,基本上讨论了这个非常重要的点。


0

是的,HTML5是一种通用标准,因此大多数浏览器(除IE外)都强烈支持。此外,如果不支持视频,您可以将Flash放在视频标记中,并设置一个库,例如jQuery作为备份,以防不支持HTML5。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接