Top CSS frameworks for web developers

I know the web developers like to code and also they would love things like readily made css frameworks that will ease their development process.

So, I collected some of the most popular CSS frameworks which can help beginners and web designers.

Checkout How to make box in your sidebar fixed between two limits which uses bootstrap css framework

Few reasons why I choose these CSS frameworks,

  They are responsive 

           Being framework responsive will make our life easy to develop things on different platforms.

  Browser compatibility

           Authors(Experts) would have done some good testing across all browsers.

  Light Weight

           With their less footprint they will make our site load faster.

  CDN Availablity

           Most of the time we do not have to load these frameworks into our work area.      

  Better Community

           Since many web developers are using them, you might get better response for your questions :)

Here is the list of best css frameworks that I follow.

1. Most Popular CSS Framework:  Bootstrap.

This amazing framework has got all you need. It is responsive and since it is an open source product from twitter, it's been used by many web developers.

Also checkout Best CSS for Buttons

Bootstrap CDN:

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

2. Human Friendly CSS framework Semantic UI

The specialty of this framework is, the class elements are really easy to read and understand and this is getting popular now. It's javascript has got some additional built in functions. Checkout its UI elements

Download Semantic-UI from here or you can use CDN from cloudflare.

3. Modern responsive CSS framework Materializecss

I like this CSS framwork because the css is ready for mobile apps. Look at some examples who is using materializecss. And you can get started from here

Materialize CDN

 <!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/css/materialize.min.css">

  <!-- Compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/js/materialize.min.js"></script>

4. Simple and light weight CSS Framework PureCSS

This light weight 4KB framework is from yahoo and it has got things to just get started. There are example layouts from PureCss, this link could be helpful.

CDN for PureCSS

//Responsive
http://yui.yahooapis.com/pure/0.6.0/pure-min.css
//Non-Responsive
http://yui.yahooapis.com/pure/0.6.0/pure-nr-min.css

5. Another Open-source CSS Framework INK

There are some good javascript components along with css from this framework. The good part is that you can very good control over grids. The painful part is that they have their own javascript to learn. Its UI compents are available here

INK CDN

<link rel="stylesheet" type="text/css" href="http://fastly.ink.sapo.pt/3.1.7/css/ink.css">
<!-- inks css file -->
<script type="text/javascript" src="http://fastly.ink.sapo.pt/3.1.7/js/ink-all.js"></script>
<!-- inks js bundle -->

NEXT: 10 Best Javascript frameworks 2015