Naming Conventions in CSS: A Love Letter to BEM (Sort Of)

It’s clunky, sure, but it works—and that counts for a lot.

BEM is not beautiful, but neither is trying to work out why changing .title broke three unrelated pages. A predictable naming convention gives a team useful boundaries, even if the class names occasionally look like they have completed a small administrative form.

CSS rewards people who understand its model more than people who accumulate workarounds. The cascade, intrinsic sizing and modern layout tools solve a surprising number of problems once we stop fighting them.

There is a practical tension underneath this topic: we want enough structure to move confidently, but not so much that the structure becomes the work.

Front-end work has a habit of looking simple from a distance. The browser then introduces real content, small screens, old devices, keyboard navigation and somebody using the product in a way nobody drew in the design file.

That is not a dramatic conclusion, but useful work is often built from undramatic conclusions applied consistently.