Pros and cons of HTML and CSS frameworks

Table of Contents

Many people got used or are at least thinking about using some of the available frameworks. Some of the more known and better positioned frameworks on the Internet are Bootstrap, Foundation, Skeleton, HTML5 Boilerplate, Cube, YAML and Less Framework. Every framework offers something different and they all also vary in their size. Another thing to always keep in mind is their browser support. However, this is not agenda of this post. Today, we will take a look at the pros and cons of using frameworks in your workflow.

We will start with pros first and cons second. In each of these categories I will offer you five benefits or costs you will gain or pay. Let’s have a look …

Pros

#1 – Low-barrier entry

If you decide to use any kind of framework, one of the benefits is that you don’t need to have a bigger knowledge in programming. Knowing at least something is definitely good, but it is not required. In order to make it easier for everyone, all frameworks offers rich and detailed documentation on their websites so they are easy to understand and start with. What’s more because the documentation is focused on group of people with different skill sets, it is created in a way that is friendly and simple to navigate through. Whole content is often broken to individual parts by their main subject which makes it easy to find exactly what do you need.

#2 – Complete UI

One thing web designers struggle with while working on some project is getting together the UI. When you want to create seamless user experience you have to tune and unify all the elements. This includes buttons, navigation, typography, behavior (scripts) and various other assets. It takes a lot of time when you have to do all of this on your own, but with frameworks, this is already solved. Frameworks often comes with some specific style and all the elements are designed in the same way. This allows web designers to focus solely on the “creative” side of the project like planning the layout, creating graphic, etc.

#3 – Grid System

In recent years grids were a big subject appearing in almost every discussion related to web design. Because of its popularity, many various systems was created and new one are still coming. Basically, you can choose from two types of grids. First one are fixed – they are tailored to certain resolution – and the second one are fluid – in most cases percentage-based grid systems. The decision about which one to choose can some times create a confusion and slower whole design process. This problem goes away with frameworks.

Every framework has its own grid system, either fixed or fluid, and is properly customized to it. Through clear documentation it is also fast to understand and use. With this, the only thing you have to deal with is how to organize the content on the page.

#4 – Maintenance

When you work with certain framework, one of the benefits you will get is the fact that there are many people taking care about the code. Thanks to these folks, you are working with clean and stable code you can rely on. There is no need from your side to debug every line or check if you didn’t make any typo. Everything is polished and ready to use. It’s like living in a house and hiring someone for cleaning.

#5 – Stability

All frameworks have something in common. They are well tested on different devices and browsers by huge group of people. They are also open-source and so anyone who spot some bug or issue can either contact the support or fix it on his own. Thanks to this, frameworks are pretty safe to use across the platforms. Still, you have to always check the compatibility.

Cons

#1 – Learning

One of the downsides to using frameworks is the need to learn their syntax in order to be able to work with them. Since every framework is from different creator(s), when you decide to switch between them, you also have to learn the syntax and system all over again. Sure, it will be much faster than learning programming, but it will still require certain time and effort invested in learning all that stuff. For this reason, take the time and choose wisely which framework (if any) will you use because with it comes the commitment to learn about it.

#2 – Unnecessary Code

In order to suit different needs of all the people who might use the framework, it has to be ready for everything. Because of this they are often loaded with a big amount of styles and scripts you might not use at all. If you have the skills, you can get rid of the code you don’t need and keep it lean. Otherwise, you either have to ask someone for help, learn the skills or just work with what you’ve got. For beginners, good rule of thumb is rather to not to touch the code. Your website will be bigger, but this is still better than breaking it.

#3 – Similarity

If you don’t like your website to look like other ones, you will probably have a hard time at least with some frameworks. While some of them include only the basic foundation (HTML and simple CSS), other comes completely styled up. Navigation, form elements, buttons, text … All of it is already styled in certain way and you can either spend some time rewriting those rules or get used to it. This can restrict your creative freedom and put unnecessary barriers to your work.

#4 – Additional Customization

This follows the previous issue of similarity, but now it is more about the code than visuals. Many frameworks include robust architecture covering behavior of elements too. Whenever you will want to alter these properties you will have to find that specific code and modify it by yourself (or look for someone to do it).

#5 – Dependence

You are not the author of the framework. This makes you dependent on some one else and it can get you in situations where you will have to swallow things you will not like. When the author(s) decide to, for example, drop support for certain browser or modify some part of frameworks, you will have to adapt to that change (or stay with older version).

Summary

Frameworks comes with various gains and pains you have to consider when deciding about to use some of them. These gains and pains will vary in their importance according to your skills and needs. However, choose wisely.

If you liked this article, please subscribe so you don't miss any future post.

If you'd like to support me and this blog, you can become a patron, or you can buy me a coffee 🙂

By Alex Devero

I'm Founder/CEO of DEVERO Corporation. Entrepreneur, designer, developer. My mission and MTP is to accelerate the development of humankind through technology.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.