2012-08-29 22 views
6

Actualmente estoy desarrollando un sitio web profesional y he alcanzado alrededor de 750 líneas de CSS para alrededor de 4 páginas, la mayor parte va a la página de inicio. Tengo aparatos ortopédicos en líneas separadas. Probablemente podría reducirlo un poco volviéndolo a pasar.¿Cuánto CSS es demasiado CSS?

Pero me preguntaba, ¿qué consideras que es demasiado css?

Saludos,

Respuesta

3

¿Qué tan grande es su archivo CSS? Claro, tienes que preocuparte mucho de que el navegador tenga que trabajar en términos de carga al interpretar el CSS ... ¿es eficiente, estás trabajando?

Mantenga su tamaño lo más bajo posible, pero hay bastantes factores en los que pensar. Siempre puedes minimizar, comprimir gzip cuando termines para ahorrar algo de tiempo. Echar un vistazo a una herramienta de prueba http://tools.pingdom.com/

Hay un montón de artículos sobre esto, así que no se molestarán desgranando mi opinión personal, a fin de comprobar éstos hacia fuera

  1. http://css-tricks.com/efficiently-rendering-css/

  2. https://developer.mozilla.org/en-US/docs/CSS/Writing_Efficient_CSS?redirectlocale=en-US&redirectslug=Writing_Efficient_CSS

  3. http://speckyboy.com/2011/03/08/website-speed-part-1-write-more-efficient-css/

+0

El primer enlace es bastante interesante. Entonces, las líneas de código no siempre importan, el selector que use también es importante. –

2

creo que no hay un límite en absoluto. Simplemente escriba el código que necesita, y cuando haya terminado intente con optimize it.

+0

Estoy de acuerdo. Solo agregaría que es importante documentar su trabajo. Como su CSS tiene mucho contenido, puede ser fácil perderse en el presente y en el futuro. Afortunadamente, el enlace compartido por @simone aborda este aspecto. –

2

Depende de lo que se supone que debe hacer su sitio web. Si es un blog pequeño y necesitas, digamos, 3000 líneas de CSS, probablemente sea demasiado. Si se trata de una tienda en línea con múltiples secciones y un diseño complicado, puede que no sea suficiente. Depende de tus necesidades.

2

Suponiendo que su página de inicio no tiene decenas de componentes anidados que tienen diferentes roles/apariencia, probablemente esté siendo un poco no inteligente con su CSS. Hay dos cosas de las que preocuparse aquí:

  • de ancho de banda: Si el tamaño de su archivo CSS es más que 50KBs más o menos, algunos de sus clientes con bajas velocidades de conexión/ancho de banda podría experimentar cierto retraso notable.

  • Rendering: Es posible que su archivo CSS es lo suficientemente complejo como para forzar de layout/rendering engine el cliente para hacer un poco de esfuerzo extra mientras prestación.

Ambos problemas reducirían la eficiencia de tiempo de su sitio web. ¿Qué hacer?

El ejemplo más simple sobre cómo optimizar su archivo CSS es recopilar las reglas que usa para muchos elementos en una clase. Hay muchos otros consejos para ayudar a reducir el tamaño de su archivo CSS; las otras respuestas ya lo vinculan con algunos artículos con consejos útiles, pero si quiere probar programas que automatizan el proceso, eche un vistazo a CSS Tidy (y an online tool based on CSS Tidy).

¡Espero que haya sido útil!

3

Gotcha en este (no directamente relacionados con el PO, pero para otros que puedan surgir aquí) ...

IE9 y por debajo sólo reconoce los primeros 4096 selectores en un archivo CSS. Todo después de eso es simplemente ignorado silenciosamente.