First off let me say that this is completely my opinion and what personally prefer.

Having said that, lets talk about front-end frameworks for now.

Front-end frameworks

These frameworks are usually packages made up of standardised code (HTML, CSS, JavaScript)

Usual component include:

CSS source code for grid creation: this helps developers to position elements that make up the site design

Classes to define HTML elements for advanced interface creation

Browser incompatibility solutions so that the site displays correctly in different browsers


Responsive frameworks: At the moment responsive web is on the rise, that is they help adapt the website to various resolutions for different devices ( desktop, tablets, mobile ). These frameworks help solve the problem of making responsive websites.

Framework selection

I would distinct two types of frameworks simple and complete frameworks. It all depends on the complexity of the framework. Though it’s subjective, and it’s not meant that one is better than another but rather they give different solutions depending on the solution required. I am more a fan of complete frameworks and haven’t used simple frameworks. But just for caparison I’ll give simple framework examples as well.

Simple framework

They give style sheets with with column systems to distributer different elements.

Some examples:

Golden Grid System

Folding grid for responsive design. 

Mueller Grid System


MUELLER is a modular grid system for responsive/adaptive and non–responsive layouts, based on Compass. You have full control over column width, gutter width, baseline grid and media–queries.

Responsive Grid System, by Graham Miller

Spectacularly Easy Responsive Design. Inspired by Ethan Marcotte’s responsive web design, this site was set up in the spirit of giving something back. I found something that works for me, and I want to share it.

Just a few of many i have found for a bigger list you can see it here: – 17 Minimal CSS Frameworks

Complete frameworks

They offer fetters like styled – typography, forms, buttons, icons and a lot of other components

that provide navigation, alerts, popovers, images frames, HTML templates, custom settings, etc.
Here are some of the big ones:



Designed for everyone, everywhere. Bootstrap makes front-end web development faster and easier. It’s made for folks of all skill levels, devices of all shapes, and projects of all sizes. Built at Twitter by @mdo and @fat. its source code utilises the two most popular CSS preprocessors, Less and Sass.

Creative Tim


Tim symbolizes the creative spirit inside of each and everyone of us. A designer by trade, he enjoys making the World Wide Web a more beautiful place and helping others do the same.

Semantic UI

UI is the vocabulary of the web. Semantic empowers designers and developers by creating a language for sharing UI. Semantic gives you a variety of UI components with real-time debug output, letting your code tell you what its doing.



An advanced responsive front-end framework. Foundation is built with Sass, a powerful CSS preprocessor, which allows us to much more quickly develop Foundation itself — and gives you new tools to quickly customize and build on top of Foundation.


A Beautiful Boilerplate for Responsive, Mobile-Friendly Development. Skeleton is a small collection of CSS files that can help you rapidly develop sites that look beautiful at any size.
For a bigger list of complete frameworks look here: – 20 Exceptional CSS Boilerplates

How to choose?

There is no one size fits all. Different frameworks offer different styles and every site is different.

If you design the website use the framework you are most comfortable with.

The frameworks don’t have my differences they are all complete and easy to use.

However, here are some pointers

Understanding: Some are easy to grasps others are more complex and have more configuration options. It all depends how well they are documented it all boils down to that. If you are looking for a framework look for one with good documentation.

Options: Some frameworks are more complex than others and offer more configuration options, widgets and interface options. These will allow you to do better things with your site.

Support: Look for frameworks with a decent community. Lack of community will result in lack of updates and support.

Pros and cons for using frameworks


Helps speed up the templating process

Your code is bound to be tidier

Helps with some CSS problems

Browser compatibility

Improves coding practice


There will be features that not all project need

Takes time to learn

You wont learn it to do yourself


Should you use frameworks

Completely the developers decision to use or not to use a framework. Depends on several issues we’ve looked at. Frameworks can be very useful for many people, but not necessarily useful for you. At least now you know what they are and which ones are out there.