My thoughts on CSS

This article will be included in a series on how I develop my WordPress projects on a daily basis, but for now let’s consider it in its own right. I’d like to give you a little introduction to my thoughts on CSS as it relates to WordPress child theme customization.

In my day to day life, as I’ve mentioned in a few other articles, I work for a saas company where we use tailwind as a css framework and everything is tied strictly to a rigid design system. In my “spare time” however, when I work on simpler projects and have ample leeway, I have developed my own child theme which I presented in this article: https://blog.riccardodicurti.it/my-local-development-environment-and-how-i-update-in-production. More often than I would like I start from a commercial theme with visual composer. The initial theme does not use a css framework but the column management and some patterns are very reminiscent of bootstrap.

When I make these websites, I very often need to create elements for the visual composer that are very reminiscent of reusable react components for page creation, but unfortunately in this environment there is no css module analogue.

In any case, I follow these principles in writing my css:

• use of new features: I try to stay as current as possible with the times, sometimes investing time to try out new features ( when they are sufficiently compatible https://caniuse.com/ ). In the past, this investment has led me to know features that have turned out to be game changers and that to this day profoundly speed up my workflow.
  
  Let me give some trivial examples: flexbox, grid, calc(), object-fit or sticky
• use of sass: What to say, I couldn’t do without sass. Writing standard css without the use of variables, reusable code, and nesting is torture at this point.
  
  For those who do not know sass I encourage you to visit the site: https://sass-lang.com/
• use of BEM: using sass is important to speed up your work, but having a clear idea of how to organize your css code also helps to speed up the writing of your code.
  
  If you have not yet adopted a clear methodology for nomenclature, I invite you to visit the BEM site: https://getbem.com/introduction/
• Less is more: I always try to write and upload as little css as possible, if it’s worth it I try to upload only one file per template so that the upload is reduced to the bare minimum.

In recent years, CSS has evolved quite a bit, both from the perspective of the language and the libraries and frameworks. I believe that, as in everything, it is important to stay up to date, but how to do that? I personally check out the state of css every year ( at this link you will find the 2022 one https://2022.stateofcss.com/en-US/ ) and go over the things I don’t know in detail. I also try to follow some industry blogs ( https://css-tricks.com/, https://tympanus.net/codrops/ or https://www.smashingmagazine.com/ ).

Join the state of css 2023: https://survey.devographics.com/it-IT/survey/state-of-css/2023