Bueno voy a explicaros unas tecnias sencillas de optimización de CSS mediante las cuales puedes reducir tamaño mejorar el diseño y la velocidad de carga de tu pagina, además de ahorrar tiempo a la hora de diseñar.
Comenzamos por la más sencilla para
reducir tamaño:
Muchos y yo personalemente utilizamos cualquier tipo de CMS, Joomla!, Wordpress, Drupal, etc... y al no ser que seas un manitas generalmente utilizas un diseño prefabricado que te descargas.
Bueno pués en estos diseños siempre hay unos cuantos problemas:
Muchos comentarios, creditos y espacios en blanco que no aportan nada al diseño y aumentan el peso del CSS, así que borrarlos.
El segundo consejo es "
comprimirlo" es decir colocar todo lo relacionado con un DIV en una linea osea en vez de:
#right {
background:#FFF;
padding-left:3px;
}
DEJARLO ASI:
#right {background:#FFF; padding-left:3px}
De esta manera tambien reduciremos (algo menos que de la anterior) el tamaño.
Otra manera es generando DIVS que dejaras en blanco pero utilizaras en el CSS:
si tienes por ejemplo posiciones como right, left, top y en ambas tienes:
padding-left:3px;
margin-right:10px;
ahorrarias espacio creando un div en el index de tu plantilla que se llamara por ejemplo: posiciones. Entonces en tu CSS añades:
padding-left:3px;
margin-right:10px;
y en vez de tenerlo que escribir en 3 sitios lo escribes solo en uno reduciendo asi las lineas y el tamaño, además si queires realizar una modificación global de tamaño y/o color te sale más facil que ir una por una.
Por ultimo aquí dejo unas
herramientas que "optimizan el CSS" de manera automatica:
www.cssoptimiser.com/
flumpcakes.co.uk/css/optimiser/
www.cleancss.com/
Espero que os sirva de algo.
