Hello my friends, I have just started to build web pages in the new HTML5 but I am confused about which type of script to use either Shiv or Modernizer to display the new html tags correctly and also I want to know that by adding these JS files should I have to explain the CSS like aside, header, footer {display: block;} OR it is not necessary if using Shiv or Modernizer.
Thanks.
You still need to do that. Not all browsers recognize things like <section> as a block element, so state that in your CSS file to be sure.
Out of interest, why are you using elements that are not really ready yet? It’s fun to experiment with this stuff, but why load real life websites with experimental and unsupported elements that only survive on a life suport system of javaScript? Is it worth the hassle?
What I do, is I use
<hr>
To digress a little.
Is HTML5 ready for use? It is.
The problem is some will still think of HTML5 in W3C terms: a mixture of technologies. And this mixture is not ready for use, not by far. To this concern, W3C made a big disservice to the web community, tying up together HTML to CSS and JS and then some, under the HTML5 logo, and then propagate the confusion further and further.
A few have gone up and formed a group focused on HTML alone, WHATWG. What they define there as HTML5, they go further and simply call it HTML, and in their specs you’ll find stuff already 100% supported and implemented in modern browsers.
Modern as in less than 3 yrs old. The part about html5shiv and CSS display: block is for these browsers, older than 3 yrs, that are locked in and unable to update. Which accounts for roughly about 15% of the visitors still using them. For the 85% of the rest I believe HTML5 it’s worth it. HTML, that is.
Well thanks Ralph for the reply you just made… so now I’ll add those element styles into my CSS as well but an another question is still on pending is that may include HTML5 shiv or modernizer to execute my webpage??
Modernizr is a library that helps you feature detect a browser and helps you apply fixes if needed or conditionally download resources.
Modernizr includes html5shiv:
http://modernizr.com/docs/#html5inie
HTML 5 elements in IE
[…]
As of Modernizr 1.5, this script is identical to what is used in the popular html5shim/html5shiv library.
[…]
Finally, Modernizr doesn’t make possible HTML5 or CSS3 in lesser browsers, it just detects capabilities.
<hr>
html5shiv creates missing elements like section for browsers like IE8. After that, you can style them to your needs. If they need to behave like blocks, apply display: block to them.
If it seems like too much to worry about, CSS normalize I was talking about does that for you, fixes the styling, along with some other fixes for various quirks in various browsers. Very useful to me.
<hr>
html5shiv and CSS normalize are the least you’re required for HTML5 if you need to support browsers like IE8 or IE7. Modernizr it’s a step forward from html5shiv, so you should use it only if advanced feature detection is needed.
itmitica’s advice of using the shiv with normalize sounds good to me, but he is more experienced with this. I’m still not fully clear on what modernizr is for, but it sounds like it helps when you are using more advanced HTML5, for which there is less reliable browser support.