我应该使用新的HTML5语义元素吗?

时间:2013-11-02 16:22:11

标签: javascript css html5 modernizr

我正在升级我的网站,这涉及到使用新的HTML5语义元素<nav> <header> <footer> <aside> <section>而不是常规的旧<div>元素的决定。

我计划支持IE7和IE8,但我知道这些版本不支持上述语义元素。我已经读过像Modernizr,Initializr和HTML5shiv这样的'插件',而且我知道旧的浏览器会支持新的元素 IF 启用了JavaScript,但如果不是,我应该怎么做?

默认情况下,<html>标记的类为no-js,如果启用了JavaScript,则Modernizr / Initializr会将此类替换为js。这一切都很好,但有一些我不确定的事情。到目前为止,涵盖的是什么?

排序

  • 如果启用了JavaScript,则Modernizr / Initializr支持IE7和IE8。
  • 使用reset.css文件,其他旧浏览器支持这些新标记。
  • 现代浏览器都很好。

问题

  • 如果JavaScript被禁用,我应该怎么做IE8及以下? no-js类已添加到<html>标记中,那么我该怎么办呢?
  • 我如何在这里使用<noscript>?我不希望通过编码使页面太大。

所以,除了这些问题之外,我还想问一下,使用这些标签是否真的值得,当我可以使用好的'<div>标签时,这些标签既支持旧版浏览器又可以保持文件大小不变消除所需的编码以使新标签在旧浏览器中工作?

谢谢你, 迪伦。

5 个答案:

答案 0 :(得分:2)

最好同时使用两者,例如

<nav>
    <div>
        <ul>
        <!-- etc -->
        </ul>
    </div>
</nav>

如果您需要支持那些过时的浏览器,我不会做更多的事情。这些好处,例如它们,不值得付出额外的努力。

答案 1 :(得分:1)

  

我计划支持IE7和IE8,但我知道这些版本不支持上述语义元素。我已经读过像Modernizr,Initializr和HTML5shiv这样的'插件',而且我知道旧的浏览器会支持启用JavaScript的新元素,但是如果不是这样的话我该怎么办?

如果未启用JavaScript,则会显示新元素的内容,但CSS将无法正确应用于它们。在 theory 中,您可以使用noscript元素触发重定向到不使用新元素的页面版本(通过{{1}内的meta刷新标记}),那么你将维护你网站的两个版本。

例如,给定此页面:Live Copy

noscript

...早期版本的IE将以默认颜色显示文本。在<!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 Elements</title> <style> nav { color: green; } </style> </head> <body> <nav><ul><li>This text should be green</li></ul></nav> </body> </html> 元素之前添加HTML5 shiv:

style

...如您所知,需要JavaScript,将文字设为绿色:Live Copy

答案 2 :(得分:1)

没有必要遵循新的语义。新语义主要是针对搜索引擎开发的,而不是针对网站功能开发的。如果确实想要支持IE,请为IE执行此操作。

如果您真的考虑no-script个案例并且CSS不够,那么您所能做的就是PHP / ASP魔法。

我的朋友专门在Flash工作,因为没有js,完全是客户端,不关心浏览器......谁知道...

答案 3 :(得分:0)

  

我应该使用新的HTML5语义元素吗?

  

如果禁用JavaScript,我应该怎么做IE8及以下?   no-js类被添加到标记中,那么我究竟能做什么呢?

你可以这样做,

<强> HTML

  <div id='wrapper'>
     // Whole website coding here
    </div>
    <div id='old-browsers'>
      Use an upgraded browser
    </div>

CSS

    .no-js #wrapper {
      display: none;
    }

    #old-browsers {
     display: none;
    }

    .no-js #old-browsers {
      display:block;
    }

我如何在这里利用我的优势?我不希望通过编码使页面太大。

IE注意事项:

IE7已有7年历史,今天大多数开发人员都不支持它。禁用js的IE7 / IE8用户非常低,你不应该为这些例外开发。相反,你应该给他们一个建议,用上述方法升级。您可以将noscript标记用于相同的用例。

答案 4 :(得分:-1)

你可以做什么(以及很多大网站的做法)是在禁用javascript时显示通知(可选择当浏览器是IE7或IE8,但你需要服务器端检查),该网站不会以它应该的方式显示。有关如何操作,请参阅“How to detect if JavaScript is disabled?”。

只有5.3%(source)的互联网用户正在使用Internet Explorer&lt; 8和0.25%到2%(source)的总用户已禁用Javascript。您可以花费大量时间为访问者提供最大5%x 2%= 0.01%的流畅解决方案,或者您可以花5分钟构建我所描述的通知系统。