CSS validieren

Das Überprüfen von Formatvorlagen in Form von Cascading Style Sheets (CSS) bleibt im Alltag oft links liegen. Mit den beiden Programmen Csstidy [28] und Cssed [29] kommen Sie Fehlern in diesen Dateien allerdings schnell und ohne viel Arbeit auf die Spur. Während Sie beim Kommandozeilenwerkzeug Csstidy im Terminal arbeiten, liefert Cssed eine grafische Oberfläche (Abbildung 3). Die Validierung starten Sie hier über die Schaltfläche mit dem grünen Haken.

Abbildung 3: Der grafische CSS-Validator Cssed bietet beim Überprüfen von CSS-Dateien viel Komfort und zahlreiche weitere Funktionen.

Csstidy validiert den CSS-Code nicht nur, sondern analysiert ihn und optimiert die darin benutzten Schlüsselbegriffe. So wandelt das Programm etwa Farben in Wortform in den entsprechenden Farbcode in RGB-Notation um, etwa "white" nach "#FFF". Darüber hinaus entfernt Csstidy überflüssige Leerzeichen, Semikolons und Mehrfachzuweisungen. Die Ausgabe in Listing 1 zeigt das anhand eines Beispielaufrufs. Insgesamt verkleinert Csstidy das Beispiel um mehr als 25 Prozent.

Listing 1

$ csstidy style.css
Selectors: 24 | Properties: 100
Input size: 2.922KiB  Output size: 2.134KiB  Compression ratio: 26.97%
-----------------------------------
body {
background:#FFF;
color:#000;
font-size:medium;
}
img {
border:none;
}
[...]
3: Optimised color: Changed "white" to "#FFF"
4: Optimised color: Changed "black" to "#000"
20: Optimised color: Changed "#DD0000" to "#D00"
38: Optimised color: Changed "white" to "#FFF"
46: Optimised color: Changed "white" to "#FFF"
47: Optimised font-weight: Changed "normal" to "400"

Kombiniert

Viele Webpräsenzen gliedern die Formatvorlagen in unterschiedliche Dateien und binden diese zu einem späteren Zeitpunkt wieder ein. Sie sollten diese Einzel-Dateien soweit wie möglich zu einer einzigen Formatvorlage zusammenfassen: So muss der Browser nicht für jede weitere CSS-Datei eine neue Verbindung öffnen. Da moderne Webbrowser versuchen, die referenzierten Daten parallel zu laden, sollten Sie zudem darauf achten, die Formatvorlagen im Kopf der HTML-Datei zu referenzieren. Dabei spielt auch der Cache des Webbrowsers eine Rolle – dort puffert der Browser externe Dateien. Nur bei einem expliziten Reload lädt er alle Daten erneut von der Originalquelle.

Prüfen Sie dabei am besten gleich mit, ob sich der Inhalt der Webseite auch ohne Formatvorlage dem Betrachter erschließt. Möglicherweise nutzten manche Leser Ihres Angebots Text-Browser, andere haben eventuell die Darstellung von CSS im Webbrowser deaktiviert, oder die Formatvorlage ging bei der Übertragung gleich ganz verloren. Beachten Sie auch, dass sich die Webcrawler der Suchmaschinenbetreiber nur für die Inhalte der Webseite interessieren und CSS ebenfalls wenig Beachtung schenken.

Diesen Artikel als PDF kaufen

Express-Kauf als PDF

Umfang: 7 Heftseiten

Preis € 0,99
(inkl. 19% MwSt.)

LinuxCommunity kaufen

Einzelne Ausgabe
 
Abonnements
 
TABLET & SMARTPHONE APPS
Bald erhältlich
Get it on Google Play

Deutschland

Ähnliche Artikel

  • out of the box
    Unsicher, ob das HTML der eigenen Webseiten richtig ist? Hat der HTML-Export der Textverarbeitung oder der HTML-Editor Unfug produziert? Mit tidy räumen Sie auf.
  • Expressversand
    Durchdachte Einstellungen beim Webserver und kleine Tricks beim Optimieren machen lahmen Webseiten Beine.
  • Links auf Webseiten überprüfen mit Linkchecker
    Manche Domains sterben einen leisen Tod – zurück bleiben verwaiste Links, die dorthin zeigen. Mit Linkchecker identifizieren Sie solche Sackgassen in Ihrer Webpräsenz.
  • HTML-Editoren
    Der Weg zur eigenen Internetseite gerät ohne passendes Werkzeug recht steinig. Während Einsteiger ohne HTML-Kenntnisse nach einer komfortablen Layout-Hilfe verlangen, stoßen Kenner schnell an die Grenzen eines einfachen Texteditors. Für beide Welten stehen unter Linux gleich mehrere Programme bereit, die antreten das Designerleben zu erleichtern.
  • Interessante Tool für HTML5-Entwickler
    "HMTL5 rocks" – das findet nicht nur Google, und so gibt es bereits eine erkleckliche Anzahl von Ressourcen, Frameworks und Werkzeugen rund um den brandneuen Web-Standard.
Kommentare

Infos zur Publikation

LU 02/2018: PAKETE VERWALTEN

Digitale Ausgabe: Preis € 5,95
(inkl. 19% MwSt.)

LinuxUser erscheint monatlich und kostet 5,95 Euro (mit DVD 8,50 Euro). Weitere Infos zum Heft finden Sie auf der Homepage.

Das Jahresabo kostet ab 86,70 Euro. Details dazu finden Sie im Computec-Shop. Im Probeabo erhalten Sie zudem drei Ausgaben zum reduzierten Preis.

Bei Google Play finden Sie digitale Ausgaben für Tablet & Smartphone.

HINWEIS ZU PAYPAL: Die Zahlung ist ohne eigenes Paypal-Konto ganz einfach per Kreditkarte oder Lastschrift möglich!

Stellenmarkt

Aktuelle Fragen

sharklinux
Gerd-Peter Behrendt, 18.01.2018 23:58, 0 Antworten
Hallo zusammen, ich habe sharklinux von der DVD Installiert. 2x, jedesmal nach dem Reboot ist di...
Anfänger sucht Ratschläge
Alucard Nosferatu, 18.01.2018 21:56, 3 Antworten
Guten Tag, meine Wenigkeit würde gerne auf einer meiner Festplatten von meinen Feldrechnern e...
Suchprogramm
Heiko Taeuber, 17.01.2018 21:12, 1 Antworten
Hallo liebe Community, keine Ahnung ob dieses Thema hier schon einmal gepostet wurde. Ich hab...
Linux Mint als Zweitsystem
Wolfgang Robert Luhn, 13.01.2018 19:28, 4 Antworten
Wer kann mir helfen??? Habe einen neuen Laptop mit vorinstaliertem Windows 10 gekauft. Möchte g...
externe soundkarte Kaufempfehlung
lara grafstr , 13.01.2018 10:20, 3 Antworten
Hallo Ich bin auf Suche nach einer externen soundkarte.. Max 150 Euro Die Wiedergabe is...