Frontend Software Engineer Hire

Twitter Bootstrap (or other CSS framework)

What is Bootstrap?

Bootstrap is a package of stuff that saves us (designers and developers) some work. Bootstrap provides buttons, widgets (tabs, accordions, etc), icons, layout and more. Once we all become familiar with what Bootstrap includes, we will be more efficient.

What is bootstrap not?

Bootstrap is not the design. It will create some constraints for the design, but the site can still look custom. How constrained the design will be will depend on how Bootstrap is actually used on a given site.

Why use Bootstrap?

Since a lot of websites do things that are really similar (slideshow, tabs, etc) we can standardize those things. Then, when we use them, you know what they do, as a designer, and we know what they do as a developer. Also, you don't have to design them from scratch each time, and we don't have to develop them from scratch each time. We can just grab a widget and tailor it for this client (e.g. Use the tabs widget with no rounded corners, and make it blue and orange, and taller than normal).

How to use Bootstrap - Designers

To make effective use of Bootstrap, there are a few categories to consider.

Grid Layout

Our designs need to be responsive. To make this much easier, Bootstrap has a grid layout system. http://getbootstrap.com/examples/grid/

Components (icons, buttons, etc)

Check out bootstrap's components here http://getbootstrap.com/components/

Bootstrap "Themes"

Other people have taken bootstrap and customized it so not all websites look the same (same buttons, same icons, etc). It would be wise to start a new design with a bootstrap theme that looks close to what you want, and then tailor it to make it fully custom for that client. https://wrapbootstrap.com/

How to use Bootstrap - Developers

Find out which bootstrap "theme" the design is based on, if any.

Refer to that theme's documentation as well as bootstrap's documentation at http://getbootstrap.com/