Bootstrap is an open-source CSS and Javascript framework that has come into existence in the recent times, courtesy Twitter. As such, Bootstrap is a combination of

  • Cascading Style Sheet (CSS)
  • Javascript and
  • HTML

The primary objective of this entity is to facilitate building user interface. In fact, it has been so designed that it supports both CSS3 and HTML5.

The framework – in fact – provides more functionality to a website and remains embedded within the HTML pages. Bootstrap uses some of the latest browser techniques that provide users with more stylish

  • Forms
  • Buttons
  • Topography
  • Grids
  • Tables and
  • Navigational options, etc.

A small backtrack

There was a time when Twitter had just come into being. During then, the fraternity of web designers and techies used to use just any library to design the front-end requirements that they were individually familiar with. Thus, there was no standardization in this regard. This prevailing inconsistency among different applications made things difficult to scale and maintain.

It was in this backdrop that Bootstrap came up as a dependable solution to the crisis. In fact, this development occurred during Twitter’s first Hackweek. In fact, things have improved significantly since then. Bootstrap, as it is today, is an extensive interface to design elegant and long-lasting front-end design patterns and is widely accepted in the entire industry.

Inherent components

The Bootstrap developmental files are categorized under seven heads. These are

i.            reset.less

ii.            preboot.less

iii.            scaffolding.less

iv.            type.less

v.            patterns.less

vi.            forms.less and

vii.            tables.less, respectively.

reset.less: It is a CSS reset that has been modified to remove unnecessary elements.

preboot.less: This one deals with different colour variables and mixings for elements like gradients, transparencies and transitions, etc.

scaffolding.less: This deals with basic and global styles for generating structural layouts, page templates and grid systems, etc.

type.less: Helps in redefining typography with improved headings, lists, codes and body text options.

patterns.less: Deals with repeatable interface elements including modals, navigation, popovers and tooltips, etc.

forms.less: Helps in defining durable styles for input types and form layouts, etc.

tables.less: Defines styles for tabular data in a vast number of unique displays

As such, the objective behind developing Bootstrap was to resolve CSS into more easily manageable chunks. Thus, compiling these files with ‘Less,’ mean a user eventually ends up with just a single CSS file to include.

Pros and cons

In fact, Twitter Bootstrap has its own set of advantages and disadvantages. First, let us consider its advantages.

  • Facilitates speedy development
  • Helps in unifying naming conventions among teams
  • Includes readymade design patterns
  • Allows rapid prototyping and
  • Comes with a grid system etc.

Negative factors for Bootstrap are quite extensive as well.

  • The aspect of customization of an original design is severely limited
  • Ignores the designing aspect; in fact, as many designers put forth their opinion,  it is extensively prescriptive
  • All websites designed on this interface look more or less identical

In fact, many people also argue that it is unsuitable to work with at the professional level. Most interestingly, in spite of these adverse observations, the product is uniquely popular among the users.