Choosing a CSS framework greatly impacts project development. Let’s compare three popular solutions: Skeleton, Bootstrap 3, and Foundation 5.

Skeleton

Characteristics:

  • Fixed 960px grid with 16 columns
  • Minimalist UI toolkit
  • Very lightweight structure (~400 lines CSS)

Advantages:

  • Simplicity and lightness
  • Easy to learn
  • Doesn’t impose style

Disadvantages:

  • No responsiveness (fixed width)
  • Limited components
  • Last update: 2012

Bootstrap 3

Characteristics:

  • Fluid 12-column grid
  • Responsive (breakpoints: 480px, 768px, 992px, 1200px)
  • Mobile-first from version 3
  • Rich set of UI components

Advantages:

  • Huge community and documentation
  • Many ready-made templates
  • Regular updates

Disadvantages:

  • Large size
  • “Bootstra

ppy” look of sites

  • May be overkill for small projects

Foundation 5

Characteristics:

  • Configurable grid (default 12 columns, possible 1-16)
  • Mobile-first with advanced optimization
  • SASS support
  • Responsive media and video

Advantages:

  • Greatest configuration flexibility
  • Advanced mobile features
  • Form validation
  • Touch device optimization

Disadvantages:

  • Steeper learning curve
  • Smaller community than Bootstrap

Comparison

FeatureSkeletonBootstrap 3Foundation 5
Size~400 lines~6000+ lines~5000+ lines
GridFixed 960pxFluid 12-colFluid, configurable
Mobile-firstNoYesYes
PreprocessorNoLESSSASS
ComponentsMinimumRich setRich set

Which to Choose?

  • Skeleton - for simple, static sites
  • Bootstrap - for rapid prototyping and standard projects
  • Foundation - for advanced mobile projects

Summary

Each framework has its place. Bootstrap offers the fastest start, Foundation gives the most control, and Skeleton is ideal when you need the minimum.