En el diseño y desarrollo de sitios web es importante mantenernos actualizados y migrar a las nuevas posibilidades que nos ofrecen los estándares web. Hoy se buscan que desarrolladores y diseñadores web apliquen ya HTML5 y CSS3 a sus sitios, específicamente a HTML5 que le permite una codificación más cómoda y aparentemente, una semántica ideal para la indexación de nuestro contenido en los buscadores.
Sin embargo, las versiones antiguas de nuestro navegador favorito Internet Explorer no reconocen los nuevos elementos de HTML5 de forma natural.
Así que, durante mi proceso de actualización a HTML5 y experimentos con CSS3, encontré esta bella, simple y mágica solución para poder utilizar un mark-up de HTML5 en versiones anteriores a la 9 de Internet Explorer.
HTML5 en IE6, IE7 e IE8 en 2 minutos
Lo que necesitamos hacer definir estos elementos como parte del documento y la única forma de lograrlo es con JavaScript, apoyado del famoso comentario condicionado <!--[if lt IE 9 ]>. Para esto, solo tenemos que colocar el siguiente código, dentro de la etiqueta <head>
Código :
<!--[if lt IE 9]>
<script type="text/javascript">
document.createElement("nav");
document.createElement("header");
document.createElement("footer");
document.createElement("section");
document.createElement("article");
document.createElement("aside");
document.createElement("hgroup");
</script>
<![endif]-->¿Qué hace este código Javascript por HTML5 en IE?
Este script crea soporte para las etiquetas <nav>, <header>, <footer>, <section>, <article>, <aside> (Que NO es para sidebars, es para contenidos relacionados de los articles) y <hgroup>. Las cuales ahora podrán ser renderizadas (por IE) en el Mark-up de nuestro sitio como cualquier navegador decente.
Seguimos teniendo otras limitaciones, podemos asegurar 2 cosas:
- Cada sección de nuestro sitio estará en su lugar para los usuarios de IE.
- Podremos beneficiarnos de las bondades SEO del Mark-up de HTML5 sin perder usuarios "vintage".
Disfrutenlo =)
Para aumentar un poco más este tema, todos los navegadores renderean cualquier etiqueta XML, aunque no sea valida como HTML. Si no la encuentran en su definición, la renderean como un simple <span>
Internet Explorer no. IE ignora las etiquetas que no reconoce y las elimina del DOM (el arbol de etiquetas). Por lo que no se les puede agregar estilos ni nada para poder usarlas.
Este código fuerza a IE a reconocerlas. Por cierto, este y otros hacks están compilados en el HTML5 Enabling Script.
Por torrealbaruben el 25 de Marzo de 2011
Gracias por la explicación..!
Buen tip MmO, gracias.
Por luco el 01 de Abril de 2011
Por Blas_Angel el 04 de Abril de 2011
Saludos!!!
Por Glorivel el 12 de Abril de 2011
Por jordy-jk el 28 de Abril de 2011
trankiloss!!
Por luisj135 el 25 de Mayo de 2011
http://remysharp.com/2009/01/07/html5-enabling-script/
Si, este articulo explica como funcional el código y te da la opción de hacerlo tu mismo. Pero el HTML5 Enable Script es más completo.
Por ejemplo acá en clab están utilizando el doctype de html5 pero siguen con el <div id="header">... al igual que otros sitios como youtube. ¿Será que no conviene utilizarlos todavía? ¿podrían generar problemas con el posicionamiento?
Por mafi el 23 de Julio de 2011
1 saludo
En el caso de este ejemplo sería:
header, footer, section, article, aside, hgroup {
display: block;
}
Saludos.
Por puaff el 28 de Septiembre de 2011
puaff-blog :
Qué tiene que ver HMTL5 con CSS3?... Los beneficios semánticos de HTML5 más sus propiedades para el uso de video y otras extensiones poco tienen que ver con CSS3... Además, a idea de usar CSS3 es forzar a las personas a actualizar sus exploradores para evitar que aterroricen Desarrolladores y Diseñadores web de la misma forma en que IE 6 lo hizo por años
Por Oscar el 01 de Octubre de 2011
Por Hueso ARG el 01 de Noviembre de 2011
Saludos.-
Por carla el 15 de Noviembre de 2011
Por Rafael Gaviria el 21 de Noviembre de 2011
Por zabaez el 30 de Enero de 2012
Por Zero_COOL el 06 de Marzo de 2012
Por eftenoon el 14 de Marzo de 2012
Gracias y saludos.
Por nuryfv el 07 de Mayo de 2012