Friday, 11 August 2017

CSS Utility Classes and “Separation of Concerns”

Adam Wathan takes us on a journey through the different ways we can approach HTML and CSS. This is a really great read that I bet will resonate with a lot of you, whether or not you agree with where he ends up.

Here's a particularly interesting bit where he specifically calls out "separation of concerns" as being a straw man:

You either have separation of concerns (good!), or you don't (bad!).This is not the right way to think about HTML and CSS.

Instead, think about dependency direction. There are two ways you can write HTML and CSS:

CSS that depends on HTML ... In this model, your HTML is restyleable, but your CSS is not reusable.

HTML that depends on CSS ... In this model, your CSS is reusable, but your HTML is not restyleable.

It occurs to me that there are fairly large contingents heading in both directions with styling. One direction is headed toward tightly coupled CSS (i.e. `.vue` files with scoped styles living right next to the template HTML). The other direction is styling classes that are completely de-coupled from HTML (i.e. atomic CSS).

What seems to be least popular is loosely-coupled global styles.

Direct Link to ArticlePermalink


CSS Utility Classes and “Separation of Concerns” is a post from CSS-Tricks



from CSS-Tricks http://ift.tt/2vKHKCn
via IFTTT

No comments:

Post a Comment

Passkeys: What the Heck and Why?

These things called  passkeys  sure are making the rounds these days. They were a main attraction at  W3C TPAC 2022 , gained support in  Saf...