Home

Responsive Web Design with Bootstrap

A workshop focused on teaching you how to design and build responsive web sites with Twitter’s Bootstrap. In the hands-on workshop you will learn to control layout using the responsive grid system, apply Bootstrap’s CSS to HTML elements, and incorporate select Bootstrap’s custom jQuery plugins.

Participants should come with a basic understanding of HTML/CSS, a laptop, and an opinion (or two).

Workshop Topics

  • Downloading Bootstrap and incorporating it into an HTML document
  • Designing page layouts utilizing the Bootstrap responsive grid system
  • Adding basic page elements using Bootstrap’s core CSS and customizing the CSS
  • Creating navigational menus with Bootstrap (NavBar, Link Group, Breadcrumbs)
  • Incorporating jQuery plugins with Bootstrap, including modal windows, image carousels, and more
  • Optional Topics (time permitting): web font icons, responsive multimedia elements, CSS customization, and CMS integration and more

Participants are expected to have:

  • Basic HTML and CSS skills
  • Laptop/notebook with a text editor

Workshop Files

Presentation

Demo Website

Get Bootstrap

jQuery

Additional Resources

Workshop Presenter

Roy Degler
Roy Degler is a librarian in the Digital Library Services Division at Oklahoma State University. His academic and professional interests include creative technological solutions in the library, online education and reference service. In addition to his computer and information knowledge, he is an avid foosball player.

My Links

© Roy Degler 2013-