LESSLESS is een dynamische stylesheet-programmeertaal waarmee CSS-stylesheets efficiënter kunnen worden geschreven. verder lezen is een dynamische stylesheet-programmeertaal waarmee CSS-stylesheets efficiënter kunnen worden geschreven. Hier vind je uitgebreid antwoord op de vraag; wat zijn de voordelen van LESS?
Wat is LESS?
LESS is een dynamische stylesheet-programmeertaal waarmee CSS (Cascading Style SheetsCSS ofwel Cascading Style Sheets, zijn stijldefinities voor een webpagina of webapplicatie. verder lezen, waarmee een website wordt voorzien van kleuren, beeld en lettertypen) kan worden gecompileerd. Met LESS heeft de programmeur functies en variabelen tot de beschikking, zodat CSS-code sneller en efficiënter kan worden geschreven.
De voordelen van LESS
TijdsbesparingWaarom zo veel programmeurs gebruik maken van zogenaamde preprocessors van CSS is omdat het de code overzichtelijker en makkelijk aan te passen maakt. Voordat de stylesheet-code naar de browser wordt gestuurd, wordt door een compiler LESS-code omgezet in CSS. Doordat je variabelen kunt inzetten om kleuren en locaties van lettertypen en afbeeldingen te definiëren, is het aanpassen van een enkele regel voldoende om de hele website (of webapplicatie) een alternatieve stijl te geven. Dit scheelt veel tijd en zorgt er bovendien voor dat de code voor andere programmeurs gemakkelijker te begrijpen is.
Gebruik van variabelenLESS maakt dus gebruik van variabelen, zoals @main-color: #FF2400;
, die vervolgens overal in de stylesheetEen stylesheet is een stijldefinitie voor een webpagina, document of applicatie. verder lezen kan worden gebruikt. Wanneer de variabele in de definitie wordt aangepast, wordt – na opnieuw compileren van de code – de CSS herschreven met de nieuwe definitie. De variabele @main-color kan met ingebouwde functies zoals fade(@main-color,10);
zelfs gemanipuleerd worden. De hoofdkleur rood zoals in het voorbeeld hierboven wordt nu door de preprocessor 10% transparant gemaakt. Het is daarmee voor de programmeur niet meer nodig dit in normale, vrij complexe CSS-code uit te schrijven en bespaart daarmee tijd.
LESS laat toe zelf complexe functies te schrijven, die hulp bieden bij het definiëren van locaties van lettertypen en afbeeldingen of bijvoorbeeld het responsief maken van een webpagina. Bij Ambrero gebruiken we LESS in veel projecten om overzichtelijke en gemakkelijk aanpasbare code te schrijven, die zonder al te veel gedoe kan worden begrepen en aangepast door verschillende programmeurs. Inmiddels maken veel van onze projecten gebruik van het alternatieve SASSSASS maakt het mogelijk om met behulp van variabelen kleuren en andere eigenschappen van de pagina vast te leggen. Dit geeft een efficiënte en schone webpagina-stijl. verder lezen, omdat het veelgebruikte framework BootstrapBootstrap is een CSS-framework waarmee je snel een responsive webpagina kunt maken die goed functioneert in alle grote moderne browsers. verder lezen in de nieuwste versie gebruik maakt van deze preprocessor.
De voordelen van LESS op een rij:
- Variabelen om wijzigingen in bijvoorbeeld kleuren snel door te voeren
- Minder code nodig om hetzelfde voor elkaar te krijgen
- Tijdbesparing door complexe CSS-code achterwege te laten
- Veel betere onderhoudbaarheid en leesbaarheid