Inline CSS doch nicht so ganz verkehrt?

[Mattes]

Wenn ich mir im Forum einige Beiträge zum Thema CSS durchlese dann heißt es immer wieder dass man kein CSS Inline schreiben soll, sondern alles in eine externe Datei.

… weil sich sauber getrennte Codeteile grundsätzlich leichter bearbeiten lassen.

Zusammengehörigen Code an mehreren Stellen zu lagern ist arbeitsaufwändig und fehlerträchtig. Denselben Code an verschiedenen Stellen in Kopie einzusetzen ist eine Fehlergarantie (sofern die Kopie nicht automatisiert wird).

Denselben Code bei jeder Seite erneut laden zu müssen, verzögert zudem den Seitenaufbau.

Wenn ich nun auf Google höre, muss der wichtigste CSS-Code inline geschrieben werden

… weil der Browser die Seite dann schon beim Einlesen des HTML-Codes, also der Daten der ersten Anfrage an den Server größtenteils fertig anzeigen kann.

Es geht dabei allerdings weniger um "das Wichtigste" als vielmehr um jene Bereiche der Seite, die zuerst auf dem Bildschirm erscheinen.

Von "muss" ist bei Google im Übrigen keine Rede. Es ist eine Empfehlung, mit der man seine Seiten eine halbe Sekunde schneller anzeigen lassen kann.

und alles andere wie gehabt in eine externe Datei, die sich allerdings am Ende der Seite befindet.

… weil das Nachladen von CSS (und Javascript) im Seitenkopf den weiteren Seitenaufbau bei manchen Browsern unterbricht.

Du solltest dich nicht sklavisch an Googles Empfehlungen halten, ebenso wenig an jene anderer Leute. Finde den für dich und dein Projekt günstigsten Mittelweg.

Googles Empfehlungen sind richtig, was die Ladegeschwindigkeit angeht. Das hilft dir aber nichts, wenn du im Gegenzug in einem Wust aus auf mehrere HTML-Dateien verteilten CSS-Code die Übersicht verlierst, dabei im günstigen Fall nur Zeit fürs Suchen verschwendest, im ungünstigen Falle aber Fehler einbaust, weil dir Abhängigkeiten wegen der Zersplitterung nicht ersichtlich sind oder du schlicht die Änderung in einer der zehn Kopien vergisst.

Es gibt durchaus die Möglichkeit, beidem gerecht zu werden, CSS zentral zu verwalten und besagte "wichtige Teile" automatisiert in den HTML-Kopf einzubinden. Server-Side Includes wären ein einfaches Beispiel, PHPs include_once() ebenso.

Und es ist obendrein nicht so, dass man sich um 100 gesparte Millisekunden einen Kopf machen müsste. Google gibt Empfehlungen aufgrund der bloßen Struktur einer Seite, nicht aufgrund der tatsächlichen Ladegeschwindigkeit. Lädt die Seite eh schnell, gibt es keinen Handlungsbedarf – jedenfalls keinen, der die Angelegenheit möglicherweise an anderer Stelle verschlimmert, siehe oben.