Responsive Web Design with Bootstrap

  • Published on
    20-May-2015

  • View
    1.738

  • Download
    4

Embed Size (px)

Transcript

<ul><li> 1. RESPONSIVEWEB DESIGN WITH BOOTSTRAP Jason Stehle @jasonstehle</li></ul> <p> 2. WHAT IS RESPONSIVE WEB DESIGN? Responsive Web Design is a way to make a website or webapplication work well on devices of different shapes and sizes. 3. WHAT IS IT MADE FROM? CSS3 Media Queriesdvsd-ysd { i.ieb-ie fot lf;la: et wdh 4.3101755;it: 89672269%}@ei (a-it:77x { mda mxwdh 6p) dvsd-ysd {i.ieb-ie fot nn;la: oe wdh 10;it: 0% }} 4. BENEFITS OF RESPONSIVE WEB DESIGN One codebase Better experience across screen sizes No more m.*.com Better future proofing 5. DRAWBACKS OF RESPONSIVE WEB DESIGNMore complexityMore testingMobile performance considerations (images, excesscontent, etc.)Legacy browser compatibility (Can I Use) 6. WHO USES RESPONSIVE WEB DESIGN?Microsoft, Boston Globe, etc.Follow @rwd 7. WHAT IS BOOTSTRAP? Grid system, useful styles, component library.*I have been informed by a hipster that it should not be referred to as "Twitter Bootstrap" 8. WHY DO I USE BOOTSTRAP?I am not a particularly talented front-end developerI am not a particularly talented visual designerGood for building a passable UI quicklyI have deadlinesI can use it how I wantIt has the "critical mass"It has an ecosystem (builtwithbootstrap, bootswatch,wrapbootstrap, jetstrap, divshot)Its (mostly) well documented 9. DRAWBACKS OF BOOTSTRAPEverythings going to look like default Bootstrap. So buy a theme, theyre like 20 bucks. 10. AND NOW, SOME CODE</p>

Recommended

View more >