know the reason behind choosing bootstrap as css framework

14
 mkarsoft  website design and dev elopment Bangalore

Upload: omkarsoft

Post on 12-Oct-2015

32 views

Category:

Documents


0 download

DESCRIPTION

Designers need a solid foundation that gives us almost everything a typical website would require but is flexible enough for customization

TRANSCRIPT

  • Omkarsoftwebsite design and development Bangalore

  • Know the reason behind choosing Bootstrap as CSS framework

  • Why Developers designed CSS Framework?

    Designers need a solid foundation that gives us almost everything a typical website would require but is flexible enough for customization.

    Thanks to hundreds of hours spent by some developers and companies, we now have dozens of CSS Frameworks to choose from.

    Among all the available CSS frameworks out there, Bootstrap is the most widely used.

  • Why should we choose Bootstrap?

    The Following are the great reasons to choose Bootstrap

    1.Easy to Start:Bootstrap offers LESS files for those of us who know how to use it, but it also provides the plain old CSS file for those dont want to use CSS pre-processing.

    2. Saves Time:The Bootstrap libraries offer ready-made pieces of code that can pump life into a website.Web developer doesnt have to spend time laboriously working out and writing code.

    3. Offers Best Grid System:Bootstrap is built on responsive 12-column grids, layouts and components.Offsetting & Nesting of columns is also possible in both fixed and fluid width layouts.

  • Very easy to handy when you want to hide some content based on screen size.Whether you need a fixed grid or a responsive, its only matter of a few changes.

    4. Integration:If we want to style a table, all you need to do is take the styles you need and copy them to the CSS file youre working with.Integration is simple, fast and easy to accomplish and once youre done you can play with your design to your hearts content.

  • 5. Provided Basic Styling:A website has many different elements such as Headings, lists, tables, buttons, forms, etc. All these fundamental HTML elements have been styled and enhanced with extensible classes.

    The HTML elements for which styles are provided are:TypographyCodeTablesFormsButtonsImagesIcons

  • 6. Pre styled Components:Styling of every single element follows a consistent theme and if you know LESS, then customizing it takes just few minutes.

    Some of the pre styled components are listed belowDropdownsButton GroupsNavigation BarBreadcrumbsLabels & BadgesAlertsProgress Bar

  • 7.Responsiveness:Bootstrap is responsive. Bootstrap adapts to the change in platforms with super speed and efficiency.

    8. Bundled JavaScript plugins:Numerous JavaScript plugins are bundled in the bootstrap package.If your project requires sliders, tabs, accordions, then you no longer have to try and test numerous different plugins across the web. Adding these functionalities is just a matter of adding few lines of code.

    9. Good Documentation:It provides a great documentation with examples and demo that makes it more easier for even someone new.

    10.Future Compatibility:For instance both HTML5 and CSS3 are things that are going to be big in the future. It has the potential to become a yardstick for web developers in the years to come.

  • Download Bootstrap Files:

    Download the files from https://github.com/twbs/bootstrap and after unzipping, include the files in the head of your HTML document.

    The example HTML document includes the bootstrap framework with its default styling and every single components and JavaScript plugins.

  • Documentation:

    Bootstraps documentation is impressive. Become familiar with elements of bootstrap by using the documentation.

    Bootstrap gives you a head start because you dont have to play with everything to learn and instead can find information on just about anything through the documentation.

    Demo: http://getbootstrap.com/getting-started/#examples

    Download: http://getbootstrap.com

    Documentation: http://getbootstrap.com/getting-started

  • Bootstrap themes:Few bootstrap themes and templates were mentioned below :

    Unify Responsive Website TemplateREEN Made for Designers PortfolioKanzi Multi-Purpose TemplateBoomerang Multipurpose TemplateAce Responsive Admin Template

  • Bootstrap Source Code:

    If you downloaded the Bootstrap source code then the file structure would be as follows:

    The files under less/, js/, and fonts/ are the source code for Bootstrap CSS, JS, and icon fonts (respectively).

    The dist/ folder includes pre-compiled bootstrap section.

    docs-assets/, examples/, and all *.html files are Bootstrap documentation.

  • Conclusion:

    Bootstrap is designed to work equally well on both desktop and mobile devices.

    Dont get the idea that Bootstrap forces you to use a limited number of layouts and special features.

    Its actually quite flexible.

  • Thank YouOMKARSOFT website design and development Bangalorepublished by www.omkarsoft.com