Building with Twitter Bootstrap

Building with Twitter Bootstrap

Slides from 2012 conference talk: "Building with Twitter Bootstrap"

Less than a year, Twitter Bootstrap has taken over the frontend world and currently is the most popular open source project on Github. In the talk we dive in to the principles of using Bootstrap effectively in your design and development process - and how not use it.

Additional resources:


Karri Saarinen

May 17, 2012


  1. 6.

    Twitter Bootstrap: Started about 1,5 years ago by @mdo &

    @fat from Twitter 28,000 watchers & 2000 forks on Github
  2. 13.
  3. 15.

    “Seeing a default Bootstrap “theme” site makes me leave it

    right away because I feel the person doesn’t care about what they are doing” - Paul Scrivens
  4. 23.

    2) Without LESS + Downloading the .css and including it

    takes 2 minutes Customize by overwriting the styles
  5. 26.
  6. 27.

    New Kippt landing page: 1: <link href="bootstrap.css" rel="stylesheet"> 2: Grab/write

    the markup 3: <link href="landing.scss" rel="stylesheet">
  7. 28.
  8. 34.

    <i class=”icon-search”></i> .icon-search { background:url(icons.png) 0 40px no-repeat; } If

    you can, use your own. You can still bene t from the convention:
  9. 38.
  10. 42.

    “We need a dropdown” Everyone and their mother has a

    dropdown implementation. Which one should I use?
  11. 43.
  12. 49.