Trucos CSS: Optimizando nuestro CSS (II)

14 jul. 2008
Siguiendo con uno de los temas principales abiertos este blog, el que tiene que ver con las cascade style sheet, los CSS, aquí vienen una nueva tanda de trucos y consejos para optimizar nuestro código

Como ya se ha dicho con anterioridad, hemos de intentar que nuestro archivo CSS sea siempre lo más limpio y organizado posible. Una buena forma de lograrlo es estructurándolo de forma que podamos encontrar fácilmente las distintas clases que hemos definido. Para ello resulta vital la inclusión de comentarios, que pueden cumplir una doble función, informar y a la vez separar o agrupar nuestro código.

Remarcar que los comentarios en CSS se insertan entre las etiquetas /* para indicar el comienzo, y */ para marcar el final del comentario.

Veámos un ejemplo práctico.

Ejemplo 1:

/* === CABECERA ==== */
.HeaderContainer { ... }
.HeaderLink { ... }

/* === PIE DE PÁGINA ==== */
.FooterContainer { ... }
.FooterLink { ... }

Como se puede observar, hemos definido dos líneas de comentarios, que nos agrupan y separan los CSS utilizados en la implementación de la Cabecera por un lado, y los utilizados en la implementación del Pie de página por el otro. Cumpliendo así esa doble función que mencionabamos con anterioridad de organizar e informar.

Además la inclusión de estos comentarios ira creciendo en importancia, a medida que se incrementen las líneas de nuestro código, y el número de atributos CSS que vayamos definiendo. También será importante en el caso de que sean varias las personas que tengan que utilizar y trabajar sobre ese código CSS. Cuanto más conciso, claro y definido sea nuestro código, como ocurre generalmente en programación, mucho mejor.
comments powered by Disqus
subir