corenominal

Full stack web developer, interested in all the things, but especially the web, code, design, Linux, OS X, PHP, WordPress, JavaScript & robots.

Tagged: bootstrap

Bootstrap considered harmful image/svg+xml

Bootstrap has become a very popular tool in front-end projects over the years, and it can have huge benefits. However, if your team has a front-end developer on board, I would argue you may be better off without Bootstrap. In some instances, it can do more harm than good.

The pros and cons of using Twitter’s Bootstrap framework. I’m currently sitting in the “wouldn’t touch it with a barge-pole” camp.

Bootstrap Studio image/svg+xml

Bootstrap Studio is a desktop application that helps web developers and designers create responsive websites using the Bootstrap framework. It supports a wide range of components and advanced features that make you more productive.

I’m trying to avoid using Bootstrap, but tools like this don’t help. It looks like a fab tool for rapid prototyping.

The Website Obesity Crisis

Apparently, there is a website obesity crisis (video here) and the average mostly-text site is now 2-3MB in size. To be honest, I can’t say that I’m shocked. Disregarding the advertising and surveillance bloat, which is the main culprit for the ever increasing page sizes, I think the proliferation of modern CSS and JavaScript frameworks have to take some of the blame.

I work with a lot of CSS and JavaScript frameworks and they are all pretty hefty. I would imagine that Twitter’s Bootstrap is probably one of main culprits of the current obesity crisis, and I’m as guilty as the next web designer for using it. The problem is, when you’re faced with a large workload and short deadlines it’s just too damn convenient.

I started using Bootstrap when I started at my current position. The project which I used it on was a replacement to a decaying Intranet. At the time, I figured page weight was irrelevant as the Intranet was served over our local network. To be fair, this is still the case and it’s nice that I don’t have to worry about how big the page sizes are, but the project is an edge case.

The problem is, once you start using a framework like Bootstrap and investing time into it, it is difficult to resist using it for other projects. More so when you apply the external pressures of deadlines and clients. To be honest, I’m pretty sure the client’s don’t care, they’re ignorant about such matters, but I care. So, I’m going to revisit some of the projects where I have used Bootstrap and attempt to remove it.

One site that I won’t have to revisit is this one, because I wrote all the CSS and JavaScript myself. I tested a random page on this site using Chrome’s inspector and it came in at 216KB, which I’m pretty happy with.

Screenshot showing page weight of 216 KB.

Styling My WP Theme

I’ve begun styling my WordPress theme. It’s going well, but it’s taking some time as I didn’t quite realise how many markup elements there are in a theme. In case you’re wondering, there are lots and lots and lots.  Still, I’m enjoying it, so it’s all good.

Regarding my style choices, I’ve opted to try and replicate my Twitter profile page. It’s totally different from the minimalist style I’d normally go for, but I like it and think it’s kind of fun. Interestingly, or not, I didn’t realise, until I started to attempt to replicate it, how good the current Twitter page and UX design is. Personally, I think it is a work of genius.

I’m sure my attempt at replicating it will pale in comparison, but as long as I get the basics right, I’ll be happy. Anyhow, the code has been going up to the GitHub repo and I’m hoping to pull it down to this production server soon.

A somewhat funny observation: I’ve used Twitter’s Bootstrap in pretty much every project for the past year, but now, as I’m attempting to replicate my Twitter profile page, I’ve opted not to use it. Go figure.