The first Cascading Style Sheet specification (CSS v1) was launched in 1996. The first browser to use CSS was Microsoft's Internet Explorer (IE). It was not full support, only very limited. It did break the dam wide open. CSS v1 was one of the initial projects of the W3C Consortium founded in 1995. The first three browsers supporting CSS: Internet Explorer, Netscape, Opera.
By 2003, support for CSS was well on its way. CSS Zen Garden was launched that year (2003) to showcase the power and flexibility of CSS. Yet until 2007, all browsers followed a different set of their own "rules" for implementing CSS. Eric Meyers came to the rescue with his CSS Reset that set the path for many developers. CSS Reset leveled the playing field and started the process of one development effort having the same appearance on all browsers. Well close.
2011 saw the release of a major revision to CSS ... that is CSS2. The major change in this release was support for web fonts and spacing. It's also the year that Twitter released Bootstrap. This minified first version came in at 32Kb. 2011 is also the year that we saw another major event: the release of the first version of "normalize.css" by Nicolas Gallagher.
Since Bootstrap, many CSS Frameworks have been launched. They all follow their own path. There is absolutely no categoring these CSS Frameworks. They range from the likes of Bootstrap that aim to do everything for you (I call it the kitchen-sink of CSS Frameworks) to class-less.
There is no doubt of the impact of Bootstrap. I checked the market share data again on the date of writing this article, and it stook at 79%. That means that 79% of websites that use a CSS Framework are using Bootstrap. There are no other CSS Frameworks that come even close to Bootstrap. The next closest are ALL at less than 1% market share each. Tailwind is at 0.5%, Bulma at 0.2%, MetroUI and Spectre are at 0.1%.
At one time, the developers and designers at my web development company lobbied to use Bootstrap. After looking closely at Bootstrap (at the time), I rejected that and we continued our roll-your-own strategy on an individual site/project basis – and note: at the time my company developed more web applications than sites. That decision was a mistake, I should have supported changing to Bootstrap and launched a project to roll-our-own framework.
My company is now closed, and I am (semi) retired. I selectively build websites. For the past three years, I've used Bulma (versions 0.9.1 to 0.9.4). My choice to use Bulma is that there is no more "team", I work entirely on my own. The class names were clean and intuitive (for the most part, there are some wanky ones). I have followed the history of Bulma a bit and watched as the announcements started about an upcoming v1.0.0. I was already concerned about serving pages through the "wire" and did everything I could to ensure gzip was enabled and I was using all the minified versions. I wrote my own Javascript and tried to limit that as much as possible ... but I did choose to use JQuery, planning to stay with some basic website applications that required JQuery (ie. datatables, owl carousel, etc.).
I was expecting Bulma to shrink in size and for the developer to remove "mini-reset" from the package. "Mini-reset" has to be the one comment consistent across all complaints. Essentially, the mini-reset code in Bulma wipes all the CSS defaults out. Gone is nearly 35 years of progressive CSS development and tweaking. All in favor of the opinions of the developer and contributors to Bulma. To my horror, v1.0.0 continues to use "mini-reset". Even more horrible is the bloating of v1.0.0 to more than TRIPLE the size of v0.9.4.
I no longer believe any of the statements coming out of Bulma. The claim is that it's more efficient and smaller ... Bulma is more than DOUBLE the size of any of its competitors including Bootstrap. It doesn't need Javascript. Actually, the words "fiercely against Javascript" ... in inspecting the Bulma code, there's a lot of code bloat trying to deliver in CSS what developers previously needed Javascript for. The Bulma website uses Javascript. You just can't get away from it. The claim is the class names are intuitive and simple. It started out that way, but the grid system is weird. "has-" and "is-" ... is over used and confusing. It's no longer as intuitive and simple. The Dark/Light mode introduced in v1.0.0 is laughable. What I get a kick out of is that Bulma makes an alternative version of Bulma v1.0.0 avialable by CDN that has "no-dark" mode. That version is 380Kb. The version with dark mode is 713Kb. Do you mean to tell the user community that implementing dark mode in Bulma v1.0.0 takes up 333Kb? Are you kidding? I must point out that I think Bulma made a mistake with the "no-dark" alternative version. It doesn't include the Bulma "utilities" ... add that back in at 202Kb and the total package climbs to 602Kb. That leaves a difference of 111Kb ... really, a Dark/Light mode costs 111Kb? Read on ... I've got a surprise about Dark/Light mode near the end of this article.
That has been driving me to re-evaluate CSS Frameworks. I don't want to look up any CSS Framework documentation to figure out how to code a button or a paragraph. I've been doing that for nearly 35 years. I know that a button is coded as <button>Submit</button>. I know that <h1>Main Heading</h1> is the largest heading there is. In Bulma speak, you need (at an absolute minimum) write <button class="button">Submit</button> and <h1 class="is-size-1">Main Heading</h1> or you get plain text with no background, no font-size, no padding, no margin, nothing. It's plain text. That's what the "mini-reset" does. Oh by the way, if you wrap everything in "<div class="container">" ... "</div>" you can get some CSS applied. But that means semantic HTML goes out the window, you have extra code to get a basic look.
At the other end of the categories is "class-less" CSS "frameworks" ... a bit of irony. If it's class-less, it can't be a framework. A misnomer ... "class-less" means that it applies to the HTML code, you don't need classes to get reasonable formatting for your HTML stream.
I've written about one particular "class-less" CSS Framework that is very simple and attractive. The look of a page with all of the main HTML tags very well styled is incredible. With no hesitation, I heartily recommend it: Simple CSS. And, KUDOS, to the developer, Kev Quirk.
That of course, let to a search for "class-less" CSS Frameworks that may have a responsive grid system as part of the package. And, gheez, I found one – Chota. It bills itself as a "micro CSS framework". Quite frankly, I think the developer (Jenil Gogari) has underestimated what he has here. The grid system is flexbox based (an early implementation). It's not quite up to the same standards for appearance as Simple CSS, but it's quite good. It's well worth a look at. Like many similar packages, it promotes the size of the package as the size when received by the end user – meaning the gzip'd version. Chota claims ~3Kb. The raw version is 24Kb and minified version is 18Kb. Above I discussed Bulma's implementation of a Dark/Light mode in their new v1.0.0 (333Kb). Chota CSS framework has Dark/Light mode already built in to their latest version. The entire package (including Dark/Light mode) is 24Kb raw. The entire package, including an attractive semantic HTML code standard, good-looking designs for all HTML elements (including forms), AND A FLEXBOX-based GRID SYSTEM – 24Kb. The entire package is about 3/100ths the size of Bulma. Can't you just hear my palm smacking my forehead?
I'm leaning, of course, in the direction of a class-less CSS Framework with flexbox based grid system. I'm still rolling-my-own with. I've had a more critical look at SImple CSS. Once I get the same CSS code as a reset, what is left is a mini theme/templating engine. So, I'll likely roll-my-own of these too.
PS. I am going to reach out to the developer of Chota for several reasons. First, I like the package, I think it has merit. Second, he developer is based in India. That's where my company was based and employed over 30 designers and developers at one point. Last I visited India was back in 2005 ... but quite frankly, I am still in touch with many that worked for me and think of them more like family.