Stylesheets und was am Ende in Browser herauskommt...

[Oliver Schönwald]

Hallo liebe Leute,

seit geraumer Zeit erstelle ich Webseiten unter Verwendung von CSS-Stylesheets und habe hierbei einige sehr zeitraubende Probleme bemerkt. Ich frage mich, ob es fuer Entwickler von Webseiten geeignete Werkzeuge gibt, die bei diesen Problem helfen koennen. Hier mein uebliches Problem:

Ich definiere ein umfangreiches Stylesheet, vielleicht sogar mehrere, und binde diese in einer bestimmten Reihenfolge ein. Der Browser stellt nun bestimmte Elemente nicht so dar, wie ich es erwarte. Beispiel: die Hintergrundfarbe wird nicht richtig gesetzt, oder eine Schriftart wird nicht so gezeigt, wie ich sie lt. Stylesheet definiert habe, obwohl das betreffende Element die CSS-Klasse benennt.

Nun bin ich in erster Linie Systementwickler und programmiere zumeist in Java. Von daher werde ich, was die Ursache gewisser Fehler angeht, durch die verwendeten Komponenten (Compiler, Debugger) ausreichend unterstuetzt, um der Ursache fuer ein bestimmtes Verhalten auf den Grund zu gehen.

Bei der Darstellung im Browser habe ich solch eine Unterstuetzung leider noch nicht entdeckt. Ich kann leider nicht z.B. die Frage beantwortet bekommen "Welche Style-Anweisungen fliessen in die Darstellungen jenes Textelementes ein? Wurden bestimmte Anweisungen ignoriert (z.B. durch einen Tippfehler bei der Definition)? Wurden bestimmte Styles durch nachfolgende Styles/Styleelemente ueberdeckt? Welches Stylesheet dient fuer die Anwendung eines bestimmtes Styles als Quelle?"

Ist jemandem bekannt, ob es ein Tool gibt, dem man eine URL oder eine HTML-Seite nennen kann, und dieses Tool nennt dann die fuer die konkrete Darstellung beliebiger Seitenelemente geltenden Attribute und die Herleitung dieser Werte?

Gibt es ein Tool, welches die Korrektheit eines CSS-Stylesheets prueft, fehlerhafte, unsinnige Definitionen identifiziert und benennt?

Gibt es ein Tool, durch das man erkennen kann, wenn bestimmte Stylesheet-Definitionen eines Stylesheets gar nicht mehr benutzt werden? (Stichwort: Optimizer)

Wenn mir jemand hierzu Tipps geben koennte, und seien es nur Hinweise auf weiterfuehrende Websites, waere ich sehr erfreut. Mir sind bereits die Hilfsfunktionen mancher Browser bekannt, die um Blockelemente Rahmen ziehen.

Danke im Voraus,

Oliver Schönwald

[Jeena Paradies]

Hallo,

Als erstes hier der Link: http://jigsaw.w3.org/css-validator/.

Was ich immer mache wenn ich debbugen will, ich mache mir immer einen Rahmen in einer auffälligen Farbe um das zu bearbeitende Element, somit sehe ich gleich ob die Abstände passen und ob die Anweisungen auch dort ankommen.

Grüße
Jeena Paradies

[Marc]

Moin moin

Ist jemandem bekannt, ob es ein Tool gibt, dem man eine URL oder eine HTML-Seite nennen kann, und dieses Tool nennt dann die fuer die konkrete Darstellung beliebiger Seitenelemente geltenden Attribute und die Herleitung dieser Werte?

Es gibt da eine ganze Reihe von Tools - unter anderem hat eigentlich jeder HTML-Editor eine Syntax-Prüfung.

Gibt es ein Tool, welches die Korrektheit eines CSS-Stylesheets prueft, fehlerhafte, unsinnige Definitionen identifiziert und benennt?

In gewissem Rahmen macht das der CSS-Validator auf www.w3c.org

Gibt es ein Tool, durch das man erkennen kann, wenn bestimmte Stylesheet-Definitionen eines Stylesheets gar nicht mehr benutzt werden? (Stichwort: Optimizer)

Ich kenne leider keines.

Wenn mir jemand hierzu Tipps geben koennte, und seien es nur Hinweise auf weiterfuehrende Websites, waere ich sehr erfreut. Mir sind bereits die Hilfsfunktionen mancher Browser bekannt, die um Blockelemente Rahmen ziehen.

Grundsätzlich ist der Mozilla ein Werkzeug, der dank DOM-Inspektor, weitgehender Standardkonformität u. ä sehr hilft, aber richtig komfortabel wird es erst mit den entsprechenden Erweiterungen.

Was mir sehr hilft sind die beiden Mozilla-Erweiterungen "Developer Toolbar" und "Checky".

Die gibt es bei http://extensionroom.mozdev.org/

Gruß,
Marc.

[Ingo Turski]

Hi,

Ist jemandem bekannt, ob es ein Tool gibt, dem man eine URL oder eine HTML-Seite nennen kann, und dieses Tool nennt dann die fuer die konkrete Darstellung beliebiger Seitenelemente geltenden Attribute und die Herleitung dieser Werte?

mir ist so ein Tool bisher noch nicht untergekommen, aber wenn's sowas tatsächlich noch nicht gibt, war das eine gute Anregung für mich, das mal zu programmieren.

freundliche Grüße
Ingo

[MudGuard]

Hi,

Ist jemandem bekannt, ob es ein Tool gibt, dem man eine URL oder eine HTML-Seite nennen kann, und dieses Tool nennt dann die fuer die konkrete Darstellung beliebiger Seitenelemente geltenden Attribute und die Herleitung dieser Werte?
mir ist so ein Tool bisher noch nicht untergekommen, aber wenn's sowas tatsächlich noch nicht gibt, war das eine gute Anregung für mich, das mal zu programmieren.

Du kennst den DOM-Inspektor des Mozilla nicht?
Da kann man sich das gewünschte Element raussuchen (per Strukturbaum oder per Klick in die Seite) und dann kann man sich dazu die CSS-Regeln angucken (da steht auch genau dabei, aus welchem der Stylesheets die herkommen inkl. Zeilennummern)

cu,
Andreas

[Ingo Turski]

Hi,

Du kennst den DOM-Inspektor des Mozilla nicht?

nur den Namen ;-)
Aber ich werde ihn mir wohl mal demnächst genauer ansehen.

freundliche Grüße
Ingo