Using
BEM is the Block — Element — Modifier system. Essentially it's a component approach to markup, where individual site components are built in isolation and can be used anywhere, regardless of environment or content.
I used to name my classes naively and regularly suffered from collisions and conflicts. For some reason it's only now that I finally decided to look into what naming methodologies are out there. Read up on BEM, Atomic CSS (Utility-first CSS), OOCSS, SMACSS, ITCSS. BEM was the one that won my heart.
I settled on the block__element--modificator template