SlideShare a Scribd company logo
1 of 38
Size doesn’t matter.
Size doesn’t matter.
http://allthingswildlyconsidered.blogspot.com/2010_07_01_archive.html
The world is changing.....
The world is changing.....
Houston, we have a problem!
We no longer design for the web,
     We now design for _____ ?
“insist upon forcing a square peg into a round hole"
          -- Edward Bulwer Lynton in Kenelm Chillingly, His Adventures and Opinions
Separate Mobile Sites
Native Apps?
Inspiration
Luke Wroblewski




       http://forrst.com/people/icoach/posts
Jeffery Zeldman
There’s a general agreement that the “mobile”
user is not to be trifled with; give them the
content they want as quickly as possible
‘cause they’re in a hurry. But the corollary
does not hold true. Why do we think
that the “desktop” user is
more willing to put up with
having unnecessary crap
thrown at them?


        http://www.zeldman.com/2011/04/27/adactio-journal%E2%80%94content-first/
Ethan Marcotte
Frameworks
Everything should be made
     as simple as possible,
           but not simpler.
Rows and Columns
Rows and Columns
        twelve columns




   eight columns         four columns
How is
 it done?
But we did that with <table>
Everything should be made
     as simple as possible,
           but not simpler.
But can tables do this?
Responsive Design makes it easier not easy!
Tools/Resources

• Foundation- http://foundation.zurb.com
• Bootstrap- http://twitter.github.com/
  bootstrap/
• List of Responsive Design Frameworks
 •   http://designshack.net/articles/css/which-is-right-for-me-22-responsive-
     css-frameworks-and-boilerplates-explained/
Image/Content Credits
• Images- http://sxc.hu
• Images- http://abookapart.com
• Images- http://www.oup.com
• Images- http://commons.wikimedia.org
• Images(Plagiarized)-
  http://allthingswildlyconsidered.blogspot.com/2010_07_01_archive.html
Helpful Links


• Site testing- http://responsive.is
• Great examples- http://mediaqueri.es/
Size Doesn't Matter

More Related Content

What's hot

Why the heck isnt word press a cms
Why the heck isnt word press a cmsWhy the heck isnt word press a cms
Why the heck isnt word press a cmsJohn Eckman
 
Selenium in the enterprise what went right and what went wrong so far - sel...
Selenium in the enterprise   what went right and what went wrong so far - sel...Selenium in the enterprise   what went right and what went wrong so far - sel...
Selenium in the enterprise what went right and what went wrong so far - sel...Noah Sussman
 
EduWeb - Building a Responsive Website for the Presidential Debate
EduWeb - Building a Responsive Website for the Presidential DebateEduWeb - Building a Responsive Website for the Presidential Debate
EduWeb - Building a Responsive Website for the Presidential DebateJon Liu
 
The State of the Web - Helsinki meetup
The State of the Web - Helsinki meetupThe State of the Web - Helsinki meetup
The State of the Web - Helsinki meetupChristian Heilmann
 
Working connected to create offline - Trondheim Developer Conference 2014
Working connected to create offline - Trondheim Developer Conference 2014Working connected to create offline - Trondheim Developer Conference 2014
Working connected to create offline - Trondheim Developer Conference 2014Christian Heilmann
 
How HTML5 missed its graduation - #TrondheimDC
How HTML5 missed its graduation - #TrondheimDCHow HTML5 missed its graduation - #TrondheimDC
How HTML5 missed its graduation - #TrondheimDCChristian Heilmann
 
Truly Responsive Design Means Aligning to Business and User Goals
Truly Responsive Design Means Aligning to Business and User GoalsTruly Responsive Design Means Aligning to Business and User Goals
Truly Responsive Design Means Aligning to Business and User GoalsJohn Eckman
 
Tech presentation
Tech presentationTech presentation
Tech presentationleaseist
 
Web tools -lunch bunch5--final
Web tools  -lunch bunch5--finalWeb tools  -lunch bunch5--final
Web tools -lunch bunch5--finalprofecordova
 
Devops at Walmart GeC Brazil
Devops at Walmart GeC BrazilDevops at Walmart GeC Brazil
Devops at Walmart GeC BrazilRodrigo Campos
 
Moore vs. May - everything is faster and better: we can fix that
Moore vs. May - everything is faster and better: we can fix thatMoore vs. May - everything is faster and better: we can fix that
Moore vs. May - everything is faster and better: we can fix thatChristian Heilmann
 
So…What Do I Make? (Dan Mall)
So…What Do I Make? (Dan Mall)So…What Do I Make? (Dan Mall)
So…What Do I Make? (Dan Mall)Future Insights
 
Como ser um bom dev FrontEnd em 2017
Como ser um bom dev FrontEnd em 2017Como ser um bom dev FrontEnd em 2017
Como ser um bom dev FrontEnd em 2017Criciúma Dev
 
Delivering the News on WordPress
Delivering the News on WordPressDelivering the News on WordPress
Delivering the News on WordPressJohn Eckman
 
Delivering results: The State of Content Management and the Opportunity for D...
Delivering results: The State of Content Management and the Opportunity for D...Delivering results: The State of Content Management and the Opportunity for D...
Delivering results: The State of Content Management and the Opportunity for D...John Eckman
 
JAX2013 Keynote - When open-source enables the Internet of Things
JAX2013 Keynote - When open-source enables the Internet of ThingsJAX2013 Keynote - When open-source enables the Internet of Things
JAX2013 Keynote - When open-source enables the Internet of ThingsBenjamin Cabé
 
Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015Christian Heilmann
 

What's hot (20)

Why the heck isnt word press a cms
Why the heck isnt word press a cmsWhy the heck isnt word press a cms
Why the heck isnt word press a cms
 
Selenium in the enterprise what went right and what went wrong so far - sel...
Selenium in the enterprise   what went right and what went wrong so far - sel...Selenium in the enterprise   what went right and what went wrong so far - sel...
Selenium in the enterprise what went right and what went wrong so far - sel...
 
EduWeb - Building a Responsive Website for the Presidential Debate
EduWeb - Building a Responsive Website for the Presidential DebateEduWeb - Building a Responsive Website for the Presidential Debate
EduWeb - Building a Responsive Website for the Presidential Debate
 
The State of the Web - Helsinki meetup
The State of the Web - Helsinki meetupThe State of the Web - Helsinki meetup
The State of the Web - Helsinki meetup
 
Working connected to create offline - Trondheim Developer Conference 2014
Working connected to create offline - Trondheim Developer Conference 2014Working connected to create offline - Trondheim Developer Conference 2014
Working connected to create offline - Trondheim Developer Conference 2014
 
How HTML5 missed its graduation - #TrondheimDC
How HTML5 missed its graduation - #TrondheimDCHow HTML5 missed its graduation - #TrondheimDC
How HTML5 missed its graduation - #TrondheimDC
 
Truly Responsive Design Means Aligning to Business and User Goals
Truly Responsive Design Means Aligning to Business and User GoalsTruly Responsive Design Means Aligning to Business and User Goals
Truly Responsive Design Means Aligning to Business and User Goals
 
Tech presentation
Tech presentationTech presentation
Tech presentation
 
SXSW Interactive 2012 (According to Chelsey)
SXSW Interactive 2012 (According to Chelsey)SXSW Interactive 2012 (According to Chelsey)
SXSW Interactive 2012 (According to Chelsey)
 
Web tools -lunch bunch5--final
Web tools  -lunch bunch5--finalWeb tools  -lunch bunch5--final
Web tools -lunch bunch5--final
 
Devops at Walmart GeC Brazil
Devops at Walmart GeC BrazilDevops at Walmart GeC Brazil
Devops at Walmart GeC Brazil
 
Moore vs. May - everything is faster and better: we can fix that
Moore vs. May - everything is faster and better: we can fix thatMoore vs. May - everything is faster and better: we can fix that
Moore vs. May - everything is faster and better: we can fix that
 
Do The Work
Do The WorkDo The Work
Do The Work
 
Slideshare
SlideshareSlideshare
Slideshare
 
So…What Do I Make? (Dan Mall)
So…What Do I Make? (Dan Mall)So…What Do I Make? (Dan Mall)
So…What Do I Make? (Dan Mall)
 
Como ser um bom dev FrontEnd em 2017
Como ser um bom dev FrontEnd em 2017Como ser um bom dev FrontEnd em 2017
Como ser um bom dev FrontEnd em 2017
 
Delivering the News on WordPress
Delivering the News on WordPressDelivering the News on WordPress
Delivering the News on WordPress
 
Delivering results: The State of Content Management and the Opportunity for D...
Delivering results: The State of Content Management and the Opportunity for D...Delivering results: The State of Content Management and the Opportunity for D...
Delivering results: The State of Content Management and the Opportunity for D...
 
JAX2013 Keynote - When open-source enables the Internet of Things
JAX2013 Keynote - When open-source enables the Internet of ThingsJAX2013 Keynote - When open-source enables the Internet of Things
JAX2013 Keynote - When open-source enables the Internet of Things
 
Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015Erase and Rewind - Open Web Camp 2015
Erase and Rewind - Open Web Camp 2015
 

Similar to Size Doesn't Matter

Finding harmony in web development
Finding harmony in web developmentFinding harmony in web development
Finding harmony in web developmentChristian Heilmann
 
UX design for every screen
UX design for every screenUX design for every screen
UX design for every screenFour Kitchens
 
Jensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJen Simmons
 
Fundamentals of Lean UX, Agile on the Beach 2014
Fundamentals of Lean UX, Agile on the Beach 2014Fundamentals of Lean UX, Agile on the Beach 2014
Fundamentals of Lean UX, Agile on the Beach 2014Adrian Howard
 
Responsive code
Responsive codeResponsive code
Responsive codeRoy Degler
 
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014Christian Heilmann
 
Ember.js - scratching the surface
Ember.js - scratching the surfaceEmber.js - scratching the surface
Ember.js - scratching the surfaceUģis Ozols
 
MIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design WorkflowMIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design Workfloweaselsolutions
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with librariesChristian Heilmann
 
SXSWUI15 UI Patterns: Then & Now
SXSWUI15  UI Patterns: Then & NowSXSWUI15  UI Patterns: Then & Now
SXSWUI15 UI Patterns: Then & NowStephen MacKley
 
Responsive Web Design & the state of the Web
Responsive Web Design & the state of the WebResponsive Web Design & the state of the Web
Responsive Web Design & the state of the WebYiannis Konstantakopoulos
 
HTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsHTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsChristian Heilmann
 
Get responsive in 30 minutes (WordCamp Sofia)
Get responsive in 30 minutes (WordCamp Sofia)Get responsive in 30 minutes (WordCamp Sofia)
Get responsive in 30 minutes (WordCamp Sofia)Nickolay Ninarski
 
Monkeytalk Fall 2012 - Responsive Web Design
Monkeytalk Fall 2012 - Responsive Web DesignMonkeytalk Fall 2012 - Responsive Web Design
Monkeytalk Fall 2012 - Responsive Web DesignSerge Hufkens
 
Kill Your Darlings: Solving Design by Throwing Away Your Prototypes
Kill Your Darlings: Solving Design by Throwing Away Your PrototypesKill Your Darlings: Solving Design by Throwing Away Your Prototypes
Kill Your Darlings: Solving Design by Throwing Away Your Prototypesjsokohl
 
Travailler dans le présent - Chris Heilmann - Paris Web 2008
Travailler dans le présent - Chris Heilmann - Paris Web 2008Travailler dans le présent - Chris Heilmann - Paris Web 2008
Travailler dans le présent - Chris Heilmann - Paris Web 2008Association Paris-Web
 
Working In The Now - Paris Web
Working In The Now - Paris WebWorking In The Now - Paris Web
Working In The Now - Paris WebChristian Heilmann
 
The Age of Responsive Design
The Age of Responsive DesignThe Age of Responsive Design
The Age of Responsive DesignDenise Jacobs
 

Similar to Size Doesn't Matter (20)

Finding harmony in web development
Finding harmony in web developmentFinding harmony in web development
Finding harmony in web development
 
UX design for every screen
UX design for every screenUX design for every screen
UX design for every screen
 
Jensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesignJensimmons html5live-responsivedesign
Jensimmons html5live-responsivedesign
 
Fundamentals of Lean UX, Agile on the Beach 2014
Fundamentals of Lean UX, Agile on the Beach 2014Fundamentals of Lean UX, Agile on the Beach 2014
Fundamentals of Lean UX, Agile on the Beach 2014
 
Responsive code
Responsive codeResponsive code
Responsive code
 
RWD - Bootstrap
RWD - BootstrapRWD - Bootstrap
RWD - Bootstrap
 
Responsive Design
Responsive DesignResponsive Design
Responsive Design
 
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014
Welcome to planet Fintlewoodlewix - SmashingConf NYC 2014
 
Ember.js - scratching the surface
Ember.js - scratching the surfaceEmber.js - scratching the surface
Ember.js - scratching the surface
 
MIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design WorkflowMIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design Workflow
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with libraries
 
SXSWUI15 UI Patterns: Then & Now
SXSWUI15  UI Patterns: Then & NowSXSWUI15  UI Patterns: Then & Now
SXSWUI15 UI Patterns: Then & Now
 
Responsive Web Design & the state of the Web
Responsive Web Design & the state of the WebResponsive Web Design & the state of the Web
Responsive Web Design & the state of the Web
 
HTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutionsHTML5 - Moving from hacks to solutions
HTML5 - Moving from hacks to solutions
 
Get responsive in 30 minutes (WordCamp Sofia)
Get responsive in 30 minutes (WordCamp Sofia)Get responsive in 30 minutes (WordCamp Sofia)
Get responsive in 30 minutes (WordCamp Sofia)
 
Monkeytalk Fall 2012 - Responsive Web Design
Monkeytalk Fall 2012 - Responsive Web DesignMonkeytalk Fall 2012 - Responsive Web Design
Monkeytalk Fall 2012 - Responsive Web Design
 
Kill Your Darlings: Solving Design by Throwing Away Your Prototypes
Kill Your Darlings: Solving Design by Throwing Away Your PrototypesKill Your Darlings: Solving Design by Throwing Away Your Prototypes
Kill Your Darlings: Solving Design by Throwing Away Your Prototypes
 
Travailler dans le présent - Chris Heilmann - Paris Web 2008
Travailler dans le présent - Chris Heilmann - Paris Web 2008Travailler dans le présent - Chris Heilmann - Paris Web 2008
Travailler dans le présent - Chris Heilmann - Paris Web 2008
 
Working In The Now - Paris Web
Working In The Now - Paris WebWorking In The Now - Paris Web
Working In The Now - Paris Web
 
The Age of Responsive Design
The Age of Responsive DesignThe Age of Responsive Design
The Age of Responsive Design
 

More from Roy Degler

Demo for iCon 2015
Demo for iCon 2015Demo for iCon 2015
Demo for iCon 2015Roy Degler
 
Once is enough
Once is enoughOnce is enough
Once is enoughRoy Degler
 
OSU Star Party Feb 13 2013
OSU Star Party Feb 13 2013OSU Star Party Feb 13 2013
OSU Star Party Feb 13 2013Roy Degler
 
OSU Library Resources
OSU Library ResourcesOSU Library Resources
OSU Library ResourcesRoy Degler
 
Peer Training 11-1-2012
Peer Training 11-1-2012Peer Training 11-1-2012
Peer Training 11-1-2012Roy Degler
 
D2l to LibGuides
D2l to LibGuidesD2l to LibGuides
D2l to LibGuidesRoy Degler
 
Open-Source web apps for libraries
Open-Source web apps for librariesOpen-Source web apps for libraries
Open-Source web apps for librariesRoy Degler
 
Beginning LibGuides
Beginning LibGuidesBeginning LibGuides
Beginning LibGuidesRoy Degler
 
Libguides: user perceptions, expectations and satisfaction
Libguides: user perceptions, expectations and satisfactionLibguides: user perceptions, expectations and satisfaction
Libguides: user perceptions, expectations and satisfactionRoy Degler
 

More from Roy Degler (13)

Cope
CopeCope
Cope
 
My scheduler
My schedulerMy scheduler
My scheduler
 
Demo for iCon 2015
Demo for iCon 2015Demo for iCon 2015
Demo for iCon 2015
 
CIL2014
CIL2014CIL2014
CIL2014
 
Once is enough
Once is enoughOnce is enough
Once is enough
 
OSU Star Party Feb 13 2013
OSU Star Party Feb 13 2013OSU Star Party Feb 13 2013
OSU Star Party Feb 13 2013
 
OSU Library Resources
OSU Library ResourcesOSU Library Resources
OSU Library Resources
 
Peer Training 11-1-2012
Peer Training 11-1-2012Peer Training 11-1-2012
Peer Training 11-1-2012
 
D2l to LibGuides
D2l to LibGuidesD2l to LibGuides
D2l to LibGuides
 
Open-Source web apps for libraries
Open-Source web apps for librariesOpen-Source web apps for libraries
Open-Source web apps for libraries
 
Beginning LibGuides
Beginning LibGuidesBeginning LibGuides
Beginning LibGuides
 
Libguides: user perceptions, expectations and satisfaction
Libguides: user perceptions, expectations and satisfactionLibguides: user perceptions, expectations and satisfaction
Libguides: user perceptions, expectations and satisfaction
 
Welcome week
Welcome weekWelcome week
Welcome week
 

Size Doesn't Matter

Editor's Notes

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. \n
  35. \n
  36. \n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n
  44. \n