eine oder zwei css-Dateien?

[m-werk]

Hallo,

eines meiner Layouts hat mehrere css-Dateien.

Macht es bezüglich der Performance etwas aus, wenn man meherere css-Dateien hat?

Oder soll man besser alles in einer bzw. zwei Dateien das Layout hineingeben?

Die CSS wird dann aber bei mir sehr groß.

[lucina]

Ich habe auch Layouts mit 6-10 CSS-Dateien (kommt daher, wenn man sehr stark modularisiert, um immer nur die benötigten zu benutzen aus einem Pool von viel mehr). Ist ein wenig wie mit der Religion: manche finden, die Zahl der HTTP-Requests gehöre reduziert und alles ist besser, wenn es kompakt ist - manch andere sind der Meinung, dass es besser ist, nur absolut notwendiges zu laden. Ich stehe auf Letzteres, und zum Ausgleich komprimiere ich die CSS-Dateien gerne.

Was ich wichtig finde. Sicherzustellen, dass die Basis der Seite (also das Grundlayout mit den Positionierungen) in relativ kurzer Zeit geladen ist und angezeigt wird.

YSlow ist ein recht guter Ratgeber. Schau doch mal, was da kommt.

MfG, Carolina.

[xchs]

Hallo,

ich für meinen Teil gehöre dann wohl eher der anderen Religion an: Ich würd' schauen, die Zahl der CSS- und JS-Dateien nach Möglichkeit auf einige wenige zu beschränken und so die Anzahl der nötigen HTTP-Requests auf ein Minimum zu reduzieren. Der große Nachteil der HTTP-Requests liegt nämlich darin, dass selbst bei relativ kleinen zu übertragenden Datenmengen ein ziemlich großer Übertragungs-Overhead entsteht (RTT-Zeiten usw). Da nützt Dir auch keine noch so schnelle Breitbandanbindung - das liegt einfach an den Spezifikationen des HTTP-Protokolls...

Bei meinen Projekten mach ich das meistens so:

• CSS-/JS-Dateien werden am Server entsprechend ihrer Funktion/Einsatzbereich modularisiert (ähnlich wie lucina das macht) - dies vereinfacht das Handling und verbessert die Wartbarkeit
• vor Auslieferung werden diese statischen Ressourcen in einigen wenigen Dateien zusammengeführt
• da dadurch natürlich die Dateigröße steigt, werden diese Dateien anschließend noch mittels YUICompressor sowie einer Gzip-Komprimierung entsprechend verkleinert
• natürlich sollte in diesem Zusammenhang auch das Caching mittels .htaccess bzw. httpd.conf geeignet eingestellt werden, damit die statischen Ressourcen nicht bei jeder neuen Anfrage mit übertragen werden müssen
• das Problem dabei ist allerdings, dass aufgrund des Browser-Cachings Änderungen an Deinen CSS-/JS-Dateien erst nach Ablauf der Cache-Zeit sichtbar bzw. wirksam werden würden. Deshalb werden bei mir die statischen Ressourcen zusätzlich mit einer Versionierung gekennzeichnet, d.h. jeder Verweis auf die CSS- bzw. JS-Dateien erhält eine Versionsnummer zugewiesen, welcher dann mittels entsprechender RewriteRule in der .htaccess auf den physischen Dateinamen am Server umgeschrieben wird. So erspart man sich das Umbennen der betreffenden Dateien am Server und erzwingt aufgrund des geänderten Verweisnamens eine Neuanforderung der Ressource durch den Browser.

[Sebastian]

HI

ich verwende (meistens) folgende Dateien:

• basic.css (von https://contao.org, stark angepasst)
• gridpx.css (von https://contao.org)
• screen.css (für das Layout)
• inhalt.css (für den Inhaltsteil, wird auch im Druck verwendet)
• print.css
• newsletter.css

Bisher konnte ich keine Nachteile feststellen.

Sebastian

[xchs]

Einige interessante Ansätze hinsichtlich Optimierung und Performance von Websites findet man im neuen Buch von Steve Souders "Even Faster Web Sites" ("High Performance Web Sites")

In diesem Zusammenhang auch interessant folgender Artikel:
http://limi.net/articles/resource-packages/