Como soportar el html5 en todos los navegadores?

Seguro que esta pregunta se hicieron mas de una vez y es cierto que no todos los navegadores lo soportan y para revisar el soporte de los navagadores puedes revisar desde esta pagina caniuse y tambien pueden ver el soporte del css.

Pero existen polyfills que nos ayudan a solucionar este problema pero hablare del que uso y se que puede ayudarles en sus desarrollos.

Hablo de modernizr una libreria JS que simplemente con agregar en el head del documento

<script src="js/modernizr-2.5.3.min.js">/js/modernizr.js"></script>

Sucede la magia ya es soportador las etiquetas semanticas y CSS

Nota: Todos no estan incluidas por defecto se deben seleccionar si las requieren por que no siempre se requieren todas y seria innecesario hacer pesado el JS

ademas tiene cuenta con una funcion que nos permite preguntar al navegador si es soportado elementos por  Modernizr.load() y que se basa en Yepnope.js que esto es una gran ayuda  para tenerlo mas claro realizare un ejemplo practico:

En HTML5 se agrega el atributo a los input que es placeholder para colocar un texto en el input que desaparece al colocar el focus que no es soportado por modernizr pero con el Modernizr.load() solucionamos condicionandolo.

//si el navegador no soportar placeholder if(!Modernizr.input.placeholder) { //vemos si existen input's if ($('input').length) { //corremos en todos los input $('input').each(function(index) { //cogemos el texto que tiene el placeholder $texto=$(this).attr("placeholder") //removemos el atributos por que ya no sirve $(this).removeAttr("placeholder") //si existe texto es que tenia placeholder y arreglamos para crear el mismo efecto con javascript if ($texto!="") { //con esto creamos la miso efecto del placeholder $(this).attr("onblur","if (this.value==''){this.value='"+$texto+"'}"); $(this).attr("onfocus","if (this.value=='"+$texto+"'){this.value=''};"); $(this).attr("value",$texto); } }); } }

Como vemos con estas condiciones nos solucionamos mucho en nuestros desarrollos con esto ya no hay excusas para no comenzar a maquetar con HTML5.