DRY CSS: Don’t Repeat Your CSS. A few weeks ago in the comments on my post about css formatting, Brett and David pointed me to a couple of articles and a presentation I hadn’t yet seen. All had interesting ideas about css practices and I thought I would offer some of my thoughts on them. One of the articles, Don’t use IDs in CSS selectors? , makes the argument for using classes over IDs as css styling hooks. Since I covered another article with similar of arguments I won’t cover Oli’s article here, but would recommend you give it a read. In this post I want to talk about a presentation Brett pointed me to.
I’ll get to the article David pointed me to next week. The presentation is one give by Jeremy Clarke on the topic of DRY CSS. DRY CSS Principles I wasn’t quite sure what to make of Jeremy’s presentation. Some of my doubt is probably due to a lack of practical application on my part so keep that in mind. Jeremy offered 2 principles for writing good css. So how does it work? How DRY CSS Works DRY CSS comes down to 3 things: CSS Dry Principle. The DRY (Don’t Repeat Yourself) principle is a software design theory that stresses the importance of not duplicating code. Every software programmer these days uses a variety of design principles and design patterns in their day to day programming tasks. It helps them improve the quality, performance and maintainability of the software system by avoiding code redundancy.
Other useful CSS articles: We have to alert schools, banks, insurance companies, doctors, friends, etc. The DRY principle suggests that we should have only one copy of our address stored somewhere and everyone else should refer to that address. That way, if we change addresses, we only have to tell the post office the new address and everyone will see the change. Grouping Selectors Incorporating DRY principle in web design, especially in CSS coding can really enhance our web design experience. The normal CSS code will look like this: By grouping the CSS selectors the same code can be re-written like below. Summary. DRY CSS talk (slides and audio) Don't repeat yourself. Applying DRY[edit] DRY vs WET solutions[edit] Violations of DRY are typically referred to as WET solutions, which is commonly taken to stand for either "write everything twice" or "we enjoy typing".[2][3] See also[edit] References[edit] External links[edit]
DRY CSS talk (slides and audio)