Para cuando estamos trabajando en un proyecto Web en HTML 5 es bueno conocer html5shim. Es un pequeño archivo java script que permite que navegadores obsoletos como Explorer 5,6,7 y 8 soporten el trabajo con las nuevas etiquetas de html.

También lo hace con Versiones antiguas de Firefox (3x) y Safari.

La forma de implementarlo es súper simple añadiendo un pequeño hack en el código de nuestra página.

<!–[if lt IE 9]> <script src=”http://html5shim.googlecode.com/svn/trunk/html5.js”></script> <![endif]–>

De esta forma lo que estamos hacienda es traerlo de forma remota sin tener que incluirlo en nuestro servidor.

Esta es su Web y aquí la página del proyecto en Git Hub.

Luego contamos con LESS CSS que es otro archivo JS que podemos utilizar en nuestros proyectos y aparte trabaja con node.js del lado del servidor. Lo que hace es dotar al simple CSS de una dinamica mas similar a un lenguaje de programación. Permite entonces el uso de variables, mixings, funciones e incluso operaciones! El siguiente ejemplo ilustra un poco lo que quiero mostrar:

// LESS

@the-border: 1px;
@base-color: #111;
@red: #842210;

#header {
color: @base-color * 3;
border-left: @the-border;
border-right: @the-border * 2;
}
#footer {
color: @base-color + #003300;
border-color: desaturate(@red, 10%);
}

Que luego el navegador renderizaría del siguiente modo:

/* Compiled CSS */

#header {
color: #333;
border-left: 1px;
border-right: 2px;
}
#footer {
color: #114411;
border-color: #7d2717;
}

Los invito a que visiten la página Web lo descarguen y lo prueben. Lo que al principio resulta algo tedioso y molesto después se termina convirtiendo en una herramienta super útil. ;)

Anuncios