Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Responsive Web Design is NOT a Buzz Word

4c9a493357b17fb1ac818b3cfed6583a?s=47 Nima Izadi
December 10, 2012

Responsive Web Design is NOT a Buzz Word

Because too many people think it is...

Link to video [FR] : https://vimeo.com/56921998


Nima Izadi

December 10, 2012


  1. R e s p o n s i v e

    Web Design A BUZZ Word IS NOT
  2. Lima you said? No, NIMA! Neither Nemo! Frontend Web Engineer

  3. On The Rails Again

  4. Responsive Web Design ? “Responsive web design [...] is an

    approach to web design in which a site is crafted to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones) Wikipedia
  5. Don’t be lost Even this fridge has a browser

  6. ResponsiveMuseum.com Idea from Julien Dorra & Geoffrey Dorne Because their

    websites sucks
  7. National Museum of Natural History

  8. Centre Pompidou

  9. The Louvre

  10. Trello, the way forward

  11. None
  12. None



  16. HTML5ROCKS <meta name="apple-mobile-web-app-capable" content="yes"> <link rel="apple-touch-icon" href="iphone-icon.png">

  17. How to do it?

  18. Media Queries “A media query consists of a media type

    and at least one expression that limits the style sheets' scope by using media features, such as width, height, and color. Added in CSS3, media queries let the presentation of content be tailored to a specific range of output devices without having to change the content itself. Mozilla Developer Network
  19. Media Queries & SASS @mixin iphone { @media only screen

    and (max-width: 480px) { @content; } } @include iphone { body { color: red } }
  20. NIMA IZADI @Nima_Izadi OnTheRailsAgain.com/Nima SpeakerDeck.com/nim1989