Cascading Style Sheets
CSS steht für Cascading Style Sheets!
Damit können Sie unter anderem die Schriftgrössen, Schriftfarben, Schriftauszeichnungen, Zeilenabstände, Bildschirmhintergründe etc. in eine externe Datei auslagern. Diese eine Datei kann das Design einer ganzen Website beeinflussen.
Informationen gemäss Stand vom 12.12.2024
Bild: Joseph Mucira auf Pixabay.com
Vorteile durch den Einsatz von CSS
-
Schlank und rank
Die HTML-Seiten werden wesentlich schlanker. Kurze Ladezeiten und schnellerer Seitenaufbau sind Lohn für die Umstellung auf CSS. -
Tabellen ade
Mit CSS verfügen Webdesigner u. a. über eine Spaltenverarbeitung. Damit kommen Webseiten ohne Tabellen aus. Komplizierte Tabellenkonstruktionen mit den entsprechenden Problemen und Einschränkungen entfallen. -
Trennung des Inhalts vom Layout
Mit CSS ist es relativ einfach, das Layout vom Inhalt zu trennen. Redesigns werden somit schneller durchgeführt. -
Viele Formatiermöglichkeiten
CSS bietet Formatieroptionen, die weit über die Möglichkeiten der Textbeschreibungssprache HTML hinausgehen. So etwa Blocksatz, variable Zeilenabstände etc. -
Pixelgenau arbeiten
So ist es mit CSS möglich, Objekte pixelgenau zu positionieren. CSS bildet zusammen mit der Programmiersprache Javascript die Grundlage für Dynamic HTML (DHTML). -
Designwechsel durch CSS-Datei-Austausch
Ein kompletter Webauftritt lässt sich optisch mit wenigen Klicks und Einträgen verändern. -
Optimiert für Drucker
Für die Bildschirmausgabe respektive für die Druckerausgabe lassen sich unterschiedliche Einstellungen vornehmen. Der Ausdruck kann so optimiert werden, dass die Seitennavigation nicht mitgedruckt wird. -
Optimiert für verschiedene Ausgabegeräte
Mit CSS kann man ein responsives Webdesign erstellen. Diese dynamischen Layouts passen sich an die verfügbare Bildschirmauflösung an. So erfordert ein 24″-Bildschirm ganz andere Einstellungen als ein Smartphone.
Worauf zu achten ist
So werden die CSS-Dateien in die Webseiten eingebaut. Folgender Hinweis kommt in den HEADER einer Webseite:
<link rel='stylesheet' type='text/css' media='screen' href='styles.css'>Zusätzlich kann eine Datei eingebettet werden, die definiert, wie eine Webseite ausgedruckt wird:
<link rel='stylesheet' type='text/css' media='print' href='print.css'>-
Unterschiedliche Interpretation des Codes
Unterschiedliche Browser reagieren unterschiedlich beim Einsatz von CSS. Verwenden Sie nur Befehle, die in allen Browsern brauchbare respektive ähnliche Resultate erzeugen. -
CSS-Validator
Die Qualität eines CSS-Codes kann mit einem Validator wie jigsaw.w3.org/css-validator/ getestet werden.
Bitte klicken, ähnliche Themen
Autor: Walter B. Walser, kundennutzen.ch
