Uso de marcas para organizar ficheros CSS

Gracias a la ocurrencia de Manuel González Noriega de marcar ciertos recursos en del.icio.us con el tag para:ovillo, he llegado a un post de Douglas Bowman en Stopdesign, llamado CSS Organization Tip 1: Flags, en el que Douglas nos enseña uno de sus trucos para organizarse y no perderse en la maraña de líneas que puede suponer un fichero CSS. En su post, Douglas nos cuenta cómo empezó a hacer uso de alguna técnica para organizar un fichero CSS muy extenso. Se trata de ddividir el contenido del fichero en secciones con cierta significación, que hiciese fácil acceder y localizar algún grupo de reglas. Bien, ese es un paso que en cierto modo tiene su lógica, pero que cuando el fichero es muy extenso, puede llevarnos a perder demasiado tiempo haciendo scroll a lo largo del mismo en la tarea de localización de alguna regla. ¿Cómo solucionarlo?

En principio la lógica nos dice que hacer uso de la herramienta de búsqueda del editor de turno puede ser suficiente. De hecho es una opción muy válida. Dividimos en contenido del fichero en secciones y a cada una de ellas le asignamos una etiqueta, en forma de comentario, para identificarla.

Tendremos, pues, un fichero seccionado con eelementos como este:

/* Navigation
----------------------------------------------- */


Pero, ¿qué ocurre cuando a una sección le asignamos un nombre que coincide con una cadena de caracteres que se corresponda con algún atributo de las reglas o selectores? Douglas pone un ejemplo, un poco tonto, pero válido.

Tengamos la sección siguiente:

/* RDE
----------------------------------------------- */


Cuando queramos localizarla a través de la herramienta de búsqueda del editor, es muy probable que nos encontremos con esto:

#nav {
float:left;
width:182px;
border-top:1px solid #911;
}


Por lo tanto se hará necesario contar con algo que nos evite este problema, y que además no pase por variar la significación de los nombres de las secciones en las que dividamos nuestro documento. Para ello Douglas recomienda el uso de marcas o banderitas (traducción simplona de flags).

De ese modo podemos nombrar nuestras secciones de esta forma:

/* =RDE
----------------------------------------------- */


Apoyados en la marca ‘=‘ y ejecutando la búsqueda contra esa cadena de caracteres, evitaremos toparnos con las coincidencias anteriormente nombradas.