Esa es la cantidad de archivos CSS que se deben cargar en cualquier sitio web.
Una
- Un sitio de una página.
- Un sitio bastante simple con solo un par de páginas que no son muy diferentes.
- Un blog o sitio similar a un blog, donde incluso si hay miles de páginas y taxonomías, en su mayoría se ven iguales.
Obviamente, un sitio de una página solo necesita un archivo CSS. Más sería para usted, no para el sitio.
Un sitio con solo unas pocas páginas probablemente solo necesite un archivo CSS. Incluso si tiene algunas páginas con plantillas diferentes, siempre que esas plantillas sean bastante similares, se pueden combinar todas juntas.
Incluso los sitios con cientos o miles de páginas a menudo pueden salirse con la suya con un solo archivo CSS si las páginas son en gran parte iguales. Incluso si hay varias taxonomías, como un blog típico.
Dos
- Una aplicación web con un conjunto global de patrones de diseño y luego patrones de diseño menos utilizados en diferentes secciones del sitio.
- Sitio pesado de contenido con un conjunto global de estructura, cuadrícula y tipografía y luego CSS adicional cargado para secciones específicas del sitio que necesitan más.
- Sitios donde cada página es única (CSS global y específico de la página).
- La mayoría de los sitios.
Una aplicación web con diferentes secciones bastante “en silos” probablemente necesite dos archivos CSS. Uno global con los patrones de diseño más comunes y luego un archivo CSS específico de la sección con los patrones de diseño menos comunes que esa sección necesita.
Los sitios con muchos estilos de páginas muy diferentes probablemente necesiten dos hojas de estilo. Un global (probablemente hay algunos elementos compartidos) y un archivo CSS específico para las páginas únicas.
Tres
- Sitios muy complejos que necesitan CSS global, CSS específico de sección y CSS de página única
Los sitios que tienen distintas secciones y luego subplantillas de esa sección probablemente necesiten un archivo CSS global, específico de la sección y específico de la página o único.
Propongo que tres es la mayor cantidad de archivos CSS que cualquier página necesita.
Esto es CSS desplegado
Cuando digo uno, dos o tres, me refiero a los archivos CSS vinculados desde el encabezado de los sitios web implementados. No me refiero a los archivos CSS que editas como desarrollador. Para eso, debe trabajar en cualquier parte modular que tenga sentido para usted. Luego, esos fragmentos modulares se combinan en el conjunto final de archivos implementados. Puede hacer esto con cosas como Rails Asset Pipeline, usando un preprocesador CSS o con aplicaciones como CodeKit.
Por ejemplo:
Global = main.css + grid.css + tipografía.css + botones.css + print.css
Sección del sitio A = pestañas.css + editor.css
Sitio sección B = formularios.css + video.css + detalles.css
Lo que se carga en la parte del “editor” del sitio = global.css & site-section-a.css
Lo que se carga en la parte de “detalles” del sitio = global.css & site-section-b.css
¿No es uno siempre mejor?
No. Si está pensando en crear un archivo CSS específico para una página y de alguna manera concatenar las partes que necesita en ese único archivo, no lo haga. Parece que, oye, ¡una solicitud es mejor que tres! Pero entonces no estás aprovechando el caché del navegador en absoluto.
Digamos que se encuentra en un escenario típico de dos hojas de estilo. A medida que navega dentro de una sección particular de un sitio, todas esas páginas se cargan después de la primera necesidad de cargar ningún archivo CSS, ya que ya están en caché. E incluso saltar a una nueva sección solo necesitará cargar un archivo nuevo (el global ya está en caché).
Si crea un archivo CSS único para cada página, los usuarios deberán solicitar una nueva hoja de estilo para cada página que visiten.
OK
Ahora puedes trolearme por simplificar demasiado las cosas. =)