Click here to load reader
Upload
jason-stehle
View
1.743
Download
4
Embed Size (px)
Citation preview
WHAT IS RESPONSIVE WEB DESIGN?Responsive Web Design is a way to make a website or web
application work well on devices of different shapes and sizes.
WHAT IS IT MADE FROM?CSS3 Media Queries
div.side-by-side { float: left; width: 48.93617021276595%;}
@media (max-width: 767px) { div.side-by-side { float: none; width: 100%; }}
BENEFITS OF RESPONSIVE WEB DESIGNOne codebaseBetter experience across screen sizesNo more m.*.comBetter future proofing
DRAWBACKS OF RESPONSIVE WEB DESIGNMore complexityMore testingMobile performance considerations (images, excesscontent, etc.)Legacy browser compatibility (Can I Use)
WHO USES RESPONSIVE WEB DESIGN?Microsoft, Boston Globe, etc.
Follow @rwd
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"
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)It's (mostly) well documented
DRAWBACKS OF BOOTSTRAPEverything's going to look like default Bootstrap.
So buy a theme, they're like 20 bucks.
AND NOW, SOME CODE