IceBeat

Organizar un CSS requiere mucha practica, es muy común que a la más mínima se vaya al garete toda la estructura. Hay gente que lo organiza según el layout, la tipografía o los colores, desde mi punto de vista no lo veo correcto, normalmente solemos trabajar por bloques enteros, es decir, cambiando ciertas partes de nuestra web, si necesitáramos cambiar la parte de los comentarios tendríamos que editar tres CSS en lugar de uno.

Estas son algunas reglas que utilizo para organizar:

1. Tener de base un buen archivo xhtml, en el CSS puedes ver de un plumazo donde estas ejecutando los estilos, es una gozada en serio.

2. Crear un archivo base, yo lo llamo base pero lo puedes llamar "DIOS" ya que si te lo curras bien lo podrás usar en todas tus plantillas. El archivo base define las necesidades básicas para facilitar el trabajo de inicio. Suelo definir los márgenes y paddings globales, el contenedor principal, los forms y algunas pijadas. base.css

3. Organizar con imports dividiendo los archivos en estructuras mas pequeñas, es decir, cabecera, pie, contenido, menu... css.css

4. Organizar la estructura de esos archivos, usa siempre selectores descendientes para poder saber quien es el padre y como le afecta. Pon comentarios cuando empieces un bloque diferente (posts, comentarios, trackbacks...)

5. Separar ciertos CSS aunque no cumplan las normas anteriores, yo por ejemplo tengo separado los estilos para los códigos pero porque ando trabajando en un highlight y necesito separarlos.

No quiere decir que sea la mejor forma para organizar los CSS pero es una alternativa más.

Buenas noticias, se ha unido al proyecto un nuevo desarrollador.
Lo tenia bastante parado aunque el desarrollo continuaba poco a poco. Tenemos pensado cambiar totalmente la estructura del proyecto conservando solamente el concepto.
Tendremos un nuevo parser más eficiente y también nueva sintaxis. Por supuesto un mejor soporte para Javascript con las librerías de moda.

Bienvenido Iván Montes aka DrSlump!

Si le echamos un vistazo a los ejemplos de la extensión Behavioral vemos como los eventos están definidos como propiedades, desde mi punto de vista prefiero que estos eventos sean llamados como pseudoclasses y no como propiedades.La explicación es porque normalmente estos eventos en CSS son usados para cambiar colores, mostrar capas o realizar alguna acción, si cada vez que tenemos que cambiar una cosa, tenemos que tirar de JS seria un poco confuso.

Otra planteamiento:

.Rollover {
border: thin solid blue;
}
.Rollover:onmouseover  {
border: thin solid red;
function: toogle;
}
.Rollover:onmouseout  {
border: thin solid blue;
function: toogle;
}

En este ejemplo los eventos se han convertidos en pseudoclasses, consiguiendo un mejor control en CSS, un CSS mucho más legible para todos. Para manipular el HTML se ha añadido la propiedad function que es la encargada de llamar a una función JS y procesar el objeto:

Ejemplo con la extensión:

.Rollover {
border: thin solid blue;
onmouseover: "return toogle(this)";
}

Seria algo a tener en cuenta en CSSing, plantear una mejor sintaxis para los diseñadores.

Por cierto: Gracias Dr.Slurmp por mostrarme otro punto de vista sobre CSSing.

Ya se puede descargar el proyecto (gracias benko) en la pagina de sourceforge y visitar una demo para que puedas ver el script en funcionamiento.

En los últimos días he corregido algunos fallos así que es posible que puedan surgir algunos imprevistos.

Esto es el comienzo y espero que lo tengáis en cuenta.

Si aun no sabes que es CSSing puedes leer CSSing1.0

Ya tenemos aceptado el proyecto en sourceforge.net, vamos lentos pero vamos ;p.
Se aceptan colaboraciones para traducir la release, el ingles no es lo mio.

Muchas gracias GNU/Hydrus por ayudarme con el proyecto. La release ya esta terminada solo queda ponerla bonita.

Lastima que los dias solo sean de 24 horas.