Hace tiempo que conozco Modernizr, pero nunca había escrito sobre esta librería de Javascript que nos permite adaptar la página al navegador del visitante.
Básicamente lo que hace es comprobar si el navegador soporta ciertas características (que podemos indicar nosotros en la página de descarga, añadir en base a eso ciertas clases a nuestro <html>, y almacenarlo en un objeto js.
Por ejemplo, si en nuestro modernizr hemos puesto que compruebe si el navegador soporta la propiedad box-shadow, podríamos poner en nuestro CSS algo así:
.box-shadow .sombra {
/*Para navegadores que soportan la propiedad*/
-webkit-box-shadow: 1px 1px #eee;
-moz-box-shadow: 1px 1px #eee;
box-shadow: 1px 1px #eee;
}
.no-box-shadow .sombra {
/*Para los que no la soportan usaremos un borde*/
border: 1px solid #eee;
}
Cómo usarlo
Para usarlo sólo hay que ir a la página de descarga, seleccionar nuestras opciones, darle a descargar y guardarlo en algún hosting propio, o en lugares como dropbox.
Después sólo habría que referenciarlo entre <head> y </head> así:
<script src="URL DEL SCRIPT"></script>
Modernizr no sólo sirve para eso: Prepara el documento para poder usar HTML5 en navegadores antiguos, tiene utilidades para cargar archivos condicionalmente, etc. Son ciertas utilidades de las que quiero hablar más adelante.