Son muchas los sitios que nos hablan de comprimir el CSS e incluso, hay sitios como CleanCSS que ofrecen hacerlo pero esas cosas automáticas hay que utilizarlas con cuidado; con mucho cuidado.
Un artículo de Impressive Webs titula algo así como "Démosle algo de espacio al CSS para que respire" y hace un análisis de estas cosas, mostrando alternativas y opinando qué es lo bueno y qué es lo malo. Es obvio que esas conclusiones son subjetivas (como todas) pero podemos leerlas, pensar y luego decidir.
Hay algo que me parece básico, desde el punto de vista del tiempo de carga, salvo excepciones, comprimir el CSS no es relevante y para quienes recién comienzan puede transformar el código en una maraña inmanejable que asusta e impide avanzar; el resultado, no será otra cosa que un montón de caracteres difíciles de digerir y difíciles de editar:
body{background-color:#343F4A;color:#CCC;font-family:'Trebuchet MS', Trebuchet, Helvetica, Arial, Verdana, Sans-Serif;font-size:12px;margin:0;min-width:920px;padding:0;text-align:center}.clear{clear:both;line-height:0;height:0}#navbar-iframe{height:0;visibility:hidden;display:none}a,a:visited,a:link{color:#AAA;outline:none;text-decoration:underline}a:hover{color:#FFF;outline:none}a img{border:none;outline:none;text-decoration:none}object{outline:none}h1,h2,h3,h4,h5,h6{font-family:'Trebuchet Ms', Helvetica, Arial, sans-serif;margin:10px 0}La estética del código no es relevante en absoluto, lo que interesa es que sea claro para nosotros mismos y evitemos los errores más comunes.
TODAS las propiedades terminan con un punto y coma; es cierto que no es necesario agregar ese caracter en la última propiedad de una regla pero, mejor lo ponemos en todas para acostumbrarnos y evitar problemas.
a { /* esto es un error */
color: #AAA
outline: none
text-decoration:underline
}
a { /* esto está bien aunque la utima no tenga punto y coma */
color: #AAA;
outline: none;
text-decoration: underline
}
a { /* esto está bien */
color: #AAA;
outline: none;
text-decoration: underline;
}div { /* esto es un error porque entre el cierre del paréntesis y la palabra no-repeat falta un espacio */
background: #AAA url()no-repeat left top;
}
div { /* esto está bien aunque no haya espacio entre los dos puntos y el color */
background:#AAA url() no-repeat left top;
}
div { /* esto está bien */
background: #AAA url() no-repeat left top;
}div { /* esto es un error */
<!-- comentario comentario comentario >
background: #AAA url()no-repeat left top;
}
div { /* esto está bien */
/* comentario comentario comentario */
background:#AAA url() no-repeat left top;
}Son muchos los que cambian las plantillas con frecuencia; es parte de la diversión, parte del juego y, cuando lo hacen, suelen encontarrse con un problema: las entradas se ven mal; ese color no es el color que uno quiere, esa fuente no es la que uno usaría en este nuevo diseño y tal vez preguntan ¿cómo hago? Pués, lamentantablemente, si los estilos han sido agregados en las entradas no queda otro remedio que editarlas una por una.
Es que, el CSS es justamente para evitar eso y lo estamos utilizando mal; lo que debemos hacer, siempre que sea posible, es establecer reglas generales; el color, las fuentes, todo eso que vamos a utilizar habitualmente y colocar esas reglas y propiedades por defecto junto con las otras. Si no queremos que los enlaces se subrayen establecemos la regla para todo el sitio y eventualmente, cuando queremos que alguno de ellos se subraye, lo indicamos expresamente; ese tipo de detalles hará que no debamos estar repitiendo estilos en cada etiqueta.
Agregar estilos inline, es decir, con un atributo style dentro de la etiqueta, debe ser siempre el último recurso, nunca el primero.

[








