[CSS] Code in externe Dateien auslagern

[BF1942 Freak]

Ich würde gerne wissen, wie strikt man Code am besten in externe Dateien auslagern soll.
Also man hört ja immer, dass man PHP und HTML Code ganz strikt trennen soll, also das kein bisschen HTML in PHP Dateien drin vorkommen soll.
Ist das bei CSS genauso? Sollte möglichst kein CSS-Code in HTML-Dateien drinvorkommen? Oder ist das anders als bei PHP/HTML-Trennung? Sollte hier vllt sogar das ein oder andere im HTML-Code stehen, damit man in den CSS-Dateien nicht allzu viele verschiedene Klassen hat?

 

[1668mib]

Es ist besser, wenn man die Stylesheets konsequent auslagert, und jeden Style den man verwenden will, in der Vorlage definiert...

Also keine Angaben wie
<tr style="font-color:red;">

sondern konsequent
<tr class="importantrow">

Edit: Das Verlagern der Styles in eine externe Stylesheet-Datei hat auch einen Caching-Vorteil für die Browser und die HTML-Seiten werden theoretisch kleiner.

 

[Zweipunktnull]

Nur das es die Eigenschaft font-color nicht gibt. Die Schriftfarbe definiert man nur mit dem Wort color.

Aber ist es wirklich so wie du gesagt hast?
Ich denke mir manchmal, es ist doch umständlicher für Elemente, die a) nur eine Eigenschaft bekommen sollen und b) sogar auch auf nur eine einzigen Seite vorkommen sollen, eine eigene CSS-Klasse zu definieren als da mal gerade im HTML-Quelltext ein style-Attribut zu verwenden mit einer CSS-Eigenschaft drinnen. Liege ich da falsch? Bei komplexeren Sachen, klar, immer auslagern, aber einfach mal ein ganz simples Beispiel:

<!-- 1. Methode --> Das Pferd frisst <span style="color: red">keinen</span> Gurken Salat.
<!-- 2. Methode --> Das Pferd frisst <span class="font_color_red">keinen</span> Gurken Salat.

Da wäre die zweite Methode wirklich vorzuziehen? Selbst wenn man die Klasse font_color_red nirgendwo sonst mehr benötigt?

 

[1668mib]

Computer Freak, die Frage ist: Warum muss man in dem Beispiel denn rote Schrift verwenden?

Es handelt sich hier z.B. um eine Art Betonung, woher weiß ich vorher, dass nirgends anders eine Betonung dieser Art eingesetzt werden könnte?

Wenn das nun heißt

Das Pferd frisst <span class="important_text">keinen</span> Gurken Salat.

weiß ich warum hier ein Span um "keinen" steht und muss nicht den Text verstehen und evtl darüber nachdenken "warum nun rot und nicht blau?"

Design-Änderungen in ein z.B. rot-lastiges Design würden auch die Nacharbeitung dieser Seite notwendig machen, und wenn man zudem vielleicht direkt verschiedene Style-Sheets z.B. für sehbehinderte Menschen (ist sehbehindert diskriminierend? Ich hoffe nicht oO) definieren... etc

 

[Zweipunktnull]

Stimmt, da muss ich dir Recht geben. Mein Beispiel war allerdings auch im Nachhinein schlecht gewählt. Du hast es nun ja damit begründet, dass das span einen spezifischen Sinn hat.
Wie sieht es nun hingegen bei sinnlosen - nein, das klingt schräg - bei "logiklosen" Elementen aus, die wirklich nur dem gestalterischen dienen. Als Beispiel könnte man hier text-align: center wählen. In einem div soll der Text zentriert dargestellt werden - ohne tieferen Sinn, nur des Aussehens halber. Ist es da nicht umständlicher, eine eigene Klasse text_align_center zu definieren und die dann dem Element zu verpassen als das gerade direkt in den HTML-Quelltext zu schreiben? Am Ende bekommt das entsprechende div dann sogar noch mehrere Klassen zugewiesen...
Wie du siehst, bin ich noch nicht so ganz komplett überzeugt.

EDIT: Oder was mir gerade einfällt, was ich selbst öfters mache: In Forumlaren gib ich die Länge nie mit dem HTML-Attribut size an, sondern immer über die CSS-Eigenschaft width mit irgendeiner Prozentangabe. 50%, 75%, 100%, ... Diese Angabe schreibe ich bis jetzt immer direkt in die HTML-Datei, einfach weil ich nicht weiß, was der Vorteil sein sollte, wenn ich eine Klasse width_50percent definieren würde.

 

[1668mib]

Ja, für ein Alignment fällt mir echt kein Beispiel ein, welches sinnvoll begründen würde, warum es ausgelagert werden sollte :-)

Aber viele Alignments lassen sich durchaus auch in eine bestehende Vorlange integrieren, meistens sind es ja nur spezielle Dinge, die z.B. zentriert werden sollen ^^

Aber die Diskussion hier ist müßig, und es gibt wie du richtig einwendest bestimmt Situationen, in denen es Sinn machen kann, die Sytle-Sheets direkt im Tag zu definieren...