Una de las formas para incrementar la rapidez de carga de los sitios web es minimizar el tamaño de los archivos CSS. Reduciendo dicho tamaño, el servidor cargará más rápidamente las páginas, obteniendo así una página web mucho más rápida. Si alguna vez recibes muchas visitas en tu sitio, este es uno de los factores que hará que tu servidor caiga o no.
Uno de los métodos más comunes para optimizar la hoja de estilos (CSS) es eliminar los selectores que no se utilicen, quitar los espacios en blanco no deseados,
Algunas herramientas que podemos utilizar para optimizar nuestras hojas de estilo son:
W3C CSS Validator es una herramienta con la que podrás validar tu código CSS. Podemos descargar el validador Java y usarlo en nuestro ordenador, en modo offline, o si lo prefieres, usar el online para comprobar el codigo css.
CSS validator es una extensión para Firefox te ayudará a validar tu código CSS, al igual que la anterior, aunque con esta podrás iniciarla desde Firefox, sin necesidad de ir al sitio web de origen. Una vez instalado puedes comprobar el código CSS de cualquier página web con un solo click.
CSSCheck Aunque tu código CSS esté validado, no quiere decir que esté libre de error, únicamente que cumple los estándares de la W3C. Si deseas arreglar fallos de compatibilidad entre navegadores, CSSCheck es una excelente herramienta para realizar esta tarea.
CSS Analyzer es una herramienta que te permitirá validar tu hoja de estilos siguiendo los estándares W3C, realizar un test de contraste del color, y chequear que los tamaños relevantes están especificados en unidades relativas de medida. Muy útil.
El test del contraste de color simplemente comprueba si el fondo y la combinación de colores de nuestro sitio es adecuada para personas con dificultad para diferenciar colores, o cuando el sitio web se muestra en una pantalla en blanco y negro.
Selectores Dust-Me es otra extensión para Firefox que encuentra selectores CSS que no están siendo usados en la página que estás viendo. Puedes usarlo en páginas individuales o ordenar que rastree todo el sitio web.
Obtendrás un reporte con los selectores que no son usados, puedes eliminarlos de tu hoja de estilos, disminuyendo así el tamaño del archivo CSS y consiguiendo finalmente una velocidad más rápida para el sitio web.
CSS Tidy es un software libre que te permitirá comprimir y optimizar tu código CSS. Está disponible en formato .EXE (sólo para Windows) o en un script PHP comprimido compatible con todas las plataformas, para los desarrolladores web. CSS Tidy elimina los comentarios, espacios en blanco no necesarios y cambiar partes del código a shorthand. Mientras está comprimiendo puedes elegir entre mayor o menor índice de compresión. Dependiendo del tamaño de tu archivo, obtendrás un ratio de compresión de un 30% o más.
Estas herramientas nos permitiran realizar tareas de optimizacion sobre nuestros archivos de hojas de estilo y sobre nuestra web para ahorrar espacio e incrementar la velocidad de acceso para nuestros visitantes, ademas de tener mejor organizados los estilo que utilizamos al momento de desarrollar y diseñar.
