Ein Webprojekt verschlingt im Laufe der Zeit enorm viele Arbeitsstunden. Mit LESS kann man aber im Bereich CSS Zeit einsparen. Hierbei handelt es sich um eine dynamische Stylesheet Sprache. Das sonst sehr statische CSS wird um dynamisches Verhalten erweitert. Dabei geht es aber nicht um das Frontend, sondern ausschließlich darum, dem Entwickler die Arbeit zu erleichtern.
Vorteile
LESS CSS ermöglicht es, bei der Entwicklung einer Webseite CSS Variablen zu definieren, die im Anschluss daran beliebig innerhalb des Dokuments eingesetzt werden können. Besonders für einheitliche Textgrößen und Farben bietet sich diese Vorgehensweise an. Somit muss nur ein einziges Mal die Größe und Farbe festgelegt werden. Anschließend kann auf den Variablennamen zurück gegriffen werden.
Mixins machen es darüber hinaus möglich, eine Klasse mit Eigenschaften zu definieren und diese in eine andere ID oder Klasse einzufügen, ohne den Code wiederholen zu müssen. Bei der Entwicklung kann dies viel Zeit und Aufwand sparen.
Die so genannten “Nested Rules” sind analog zur Schachtelung der Elemente in HTML zu verstehen. Es werden Elemente innerhalb von IDs und Klassen definiert, was im Anschluss in Standard-CSS umgeschrieben wird.
Mittels Funktionen ist es möglich, mit zuvor definierten Variablen zu rechnen. So lässt sich beispielsweise die Schriftgröße halbieren oder die Intensität einer Farbe prozentual reduzieren.
Nachteile
Neben den positiven Eigenschaften ist allerdings anzumerken, dass es sich bei diesen Möglichkeiten um kein Standard CSS handelt. Dies bedeutet, dass der - für alle Browser verständliche - CSS Code erst noch generiert werden muss. Man spricht hier von kompilieren.
Es bedarf daher eines Kompilierers, der das LESS CSS in Standard CSS umwandelt. Unterschieden wird noch in die server- und clientseitige Kompilierung. Von letzterem ist aber abzuraten. Der mitgelieferte Kompilierer setzt Ruby on Rails auf dem Webserver voraus. Es gibt mittlerweile aber bereits eine PHP Alternative. Um auch auf PHP verzichten zu können, wurde zudem eine JavaScript Variante des Projektes veröffentlicht.
Als weiterer Nachteil ist die gering größere CSS-Datei zu erwähnen, die letztlich als kompiliertes Ergebnis kreiert wird. Dies lässt sich durch den Automatismus nicht unterbinden.
Weiterführende Informationen hält die LESS-Homepage bereit.
2 Kommentare zu " LESS: Website Entwicklung mit dynamischem CSS "
Pingback & Trackback
Kommentieren