Fichero único CSS vs. varios ficheros

[juanfuentes]

Hola!

Desde hace tiempo tengo una duda sobre la estructura de las hojas de estilo y me gustaría saber qué opináis, o cómo acostumbráis a trabajar.

La cuestión es si organizar todo el código CSS en un único fichero (comentado, agrupado por secciones...) o separando el código en varios ficheros según su función.

Teniendo un único fichero, la primera vez que se lo baja el navegador tiene que bajarse todo el código, incluso estilos que no se utilizarán en la página actual. Por otro lado, como los ficheros CSS son cacheados por el navegador, luego no volverá a bajárselo (mientras lo tenga en caché, claro).

Con múltiples ficheros, se puede indicar en cada página qué ficheros son necesarios para maquetar esa página. Esto supone menos ancho de banda necesario baja visualizar la página completa. Pero también implica un mayor número de peticiones, una por cada fichero .css que tenga que cargar.

¿Cómo os organizáis vosotros?

Gracias ;)

[diciembre7]

Al inicio yo tenía la misma duda, y por algunos temas que había leído me inclinaba por la opción de varios archivos, ahora con un poco más de experiencia te puedo decir que depende de lo que trabajes.

Por ejemplo:

• miweb.css
• miweb-ie.css

Si son sitios "de producción", con muchas impresiones, es mejor utilizar uno o dos archivos CSS con secciones separadas, por la razón que mencionas del cache. Sin embargo, si trabajas en equipo (dos o más personas) es mucho más ordenado y fácil trabajar varios archivos CSS separados porque varias personas pueden trabajar al mismo tiempo diferentes secciones del sitio web, al finalizar solo las unes en un gran archivo CSS.

Si eliges la opción de muchas hojas de estilo una muy buena practica es hacer una hoja de estilo base, con la estructura básica, tipo de letra, colores, fondo, etc y luego, en el resto de CSS, agregar solo estilo de cada sección.

Por ejemplo:

• estructura.css
• estructura-ie6.css (hacks para IE6)
• articulos.css
• galeria.css
• formularios.css
• productos.css

A lo anterior agregaría que casi siempre es recomendable separar las hojas de estilo para Internet Explorer, porque estas no necesitan (ni deberían) ser cargadas por el resto de navegadores.

Espero esto te haya servido :)

[juanfuentes]

Pues sí :) Muchas gracias.

Creo que me decantaré por la primera opción.

[Jamati]

Yo hago algo parecido.
Tengo toda mi web, la cual son cientos de páginas, y solamente tengo dos archivos CSS:

1) para la estructura, donde todas las páginas lo utilizan
2) y mi segundo CSS es para las secciones especiales, las cuales son muy pocas y no vale la pena que se carguen junto con el otro CSS porque demanda mas tiempo.

Aparte, a este segundo archivo le hago continuos cambios, y yo una vez lo pregunté acá y el tema es que queda en cache como bien dijiste vos, entonces tengo que apretar varias veces F5, yo me doy cuenta... pero un usuario no sabe, entonces me ocasiona problemas.