I skrivandets stund saknar min blogg syntax-färgning, så jag får kämpa på med det lilla jag kan erbjuda. En revidering är inte allt för långsökt.
De tekniska målen med en layout är att HTML-massan endast skall innehålla information, sorterad efter relevans i rimlig mån. Detaljer som rör utseendet, interaktiviteten et cetera skall inte dränka det som den efterfrågade sidans svar. I teorin låter detta inte svårt, men verkligheten visar sig vara en annan. Men detta är ett redan avhandlat kapitel; detta blogginlägg skall istället beröra optimering av redan rensad presentationslogik.
(Vet också att detta är ytterst subjektivt. Se mina blogginlägg i kategorin webbutveckling som tips och inte finita instruktioner. Vi har alla våra egna vägar mot perfektion.)
Klasser
En klass i CSS-sammanhang känns igen med dess inledande punkt (.) i deklarationen. En klass kan hållas helt komponentoberoende, men också adresseras till ett urval komponenter genom kombinering av selektorer. Klasser kan appliceras på alla element som får tilldelas kärnattributet class. Varje element kan dessutom tilldelas flera klasser.
Styrkan i klasser är att de i grundutförande är obundna till element, och att utvecklaren har stor makt över hur mycket varje enskild klass skall styra över. Det är möjligt att deklarera en mängd typsnittsklasser (endast innehållande font- och textattribut) och en mängd dimensionsklasser (endast innehållande marginaler och avstånd) och kombinera dessa för att element skall bete sig efter önskemål.
Leker man med arv och märkesberoenden, kan man dessutom göra skillnad på h2.redText och p.redText. Detta är dock något jag är starkt emot, eftersom det på lång sikt kan leda till förvirring; enligt mig är målet att slippa dubletter, även i deklarationer.
Klassers stora nackdel kommer med applikationer som har ett flertal teman att välja mellan. I ett tema kanske h2-märket delar beteende med legend, och i ett annat inte alls. I en strikt klassbaserad layout leder detta till komplikationer.
Selektorer
De vanligaste selektorerna som används är ID-selektorer. Dessa känns igen på sin inledande brädgård (#) i deklarationen. Under kategorin selektorer räknar jag dock också in vanliga elementselektorer, med eller utan pseudoklasser (t ex 'p', 'a:link' och 'h2 span').
I en strikt selektorbaserad layout används inte class-attributet överhuvudtaget. Där består deklarationerna av en eller flera selektorer som delar en uppsättning gemensamma attribut. Det är i grund och botten ingen dum idé. Då inga klasser finns blir layouten fantastiskt skalbart för att byta mellan layouter. Det har dessvärre förödande konsekvenser på ordningen i CSS-filerna eftersom det blir omöjligt att sortera sin CSS på ett bra och väligenomtänkt sätt.
Balansen mellan klasser och selektorer
Hemligheten med att balansera klasser och selektorer är att fördela det hela på ett välplanerat sätt. För mig har detta lett till att använda klasser för generella, ofärgade beteenden som kan delas av flera komponenter utan att göra systemet mobilt och flyttbart.
För mer unika egenskaper, såsom bakgrundsbilder och annat, använder jag selektorer. Där har de en styrka, eftersom sådant som kan tänkas vara unikt för varje komponent inte definieras av klasser.
Klasser kompletteras med selektorer, helt enkelt. Och med det är mitt flummande slut för idag.
Nästa blogg kommer att handla om filstrukturer.