Relative font sizes, or pixel based? 2020-edition

Occasionally I still have discussions about px-based font sizing, feeling like the other party has lived under a rock since early 2000's. But some designers still like their pixel based tools; maybe it even got popularised again by relatively new tools like Sketch and Figma, introducing pixel-units in a vector-based tool.

Well, to be honest, it matters less these days when compared to the days I learned that pixels are bad. Those days browsers were enlarging only text when it used relative sizes. In response to not all sites serving relative font siz browsers have introduced full page zoom functions, which is common place these days, when you press Command/Control plus ‘+’ everything will scale; text images etc.

But the text-size function is still used. In Firefox, Settings > General > Language and appearance sets the default font-size. In Chrome: Settings > Appearance > Lettersize. When you’re young and able you probably wouldn’t need to know about these things. But we shoul…

Introductie tot Cascading Stylesheets

Inleiding

Een stylesheet is eigenlijk een filter die over een pagina gelegd wordt die de pagina opmaakt. Stylesheets zijn in grote mate te vergelijken met Stijlen uit WordPerfect en Opmaakprofielen uit Word. Het mooie aan stylesheets is dat ze, met uitzondering van de zogenaamde inline stylesheets, de opmaak en inhoud van elkaar scheiden. Een stylesheet verteld hoe de inhoud gepresenteerd moet worden en kan in deze presentatie een perfecte continuiteit bieden. Een ander voordeel is dat stylesheets nog het meest crossbrowser compatible zijn. Ten slotte is het met stylesheets mogelijk om verschillende blokken op elkaar te stapelen en te positioneren.

Soorten stylesheets

Er zijn drie verschillende soorten stylesheets te onderscheiden, nl.:

external stylesheets internal stylesheets inline stylesheets

External stylesheets

External stylesheets zijn stylesheets die niet in het document zelf zijn verwerkt, in een apart text bestand, meest…