Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.
crafting a mobileexperience withoutbuilding a separatemobile site       Ryan Huber       School of Medicine Web Development
crafting a tabletexperience withoutbuilding a separatetablet site       Ryan Huber       School of Medicine Web Development
crafting a netbookexperience withoutbuilding a separatenetbook site       Ryan Huber       School of Medicine Web Developm...
crafting a smarttvexperience withoutbuilding a separatesmarttv site       Ryan Huber       School of Medicine Web Developm...
why you’re here
responsiveweb design
it’s crazy trendy
because you love your users...
...regardlessof the device   they use
because yourmobile strategy...
doesn’t exist
Redirected from the page                  you actually wanted to                   our awesome mobile                     ...
responsiveweb design
a design that  adapts to the environment inwhich it is viewed
rather than aseparate site for  each device
(pretty examples)
cool right?
developing(if html and css aren’t your thing, cover your ears)
write pretty html
write css for mobile
(here comes the magic part)
media queries
nitty gritty bits
disable initial scaling
webkit text sizeauto-adjusting
polyfill
images
safari scaling bug
don’t disable scaling!
more complex manipulations
grids
videos
wide tables
slideshows
performanceconsiderations
if all of thatseems like a lot to    remember
Boilerplates
themes for your cms of choice
designing
a little uncomfortable?
The control which designersknow in the print medium, andoften desire in the webmedium, is simply a functionof the limitati...
a couple of ideas...
code iscompiled into CSS
hold it. you’reasking me to learna new language?
all CSSis valid     code
(prepare for magic)
ryan.huber@vanderbilt.edu
Responsive Design + LESS for Digital VU Meeting
Responsive Design + LESS for Digital VU Meeting
Próxima SlideShare
Cargando en…5
×

Responsive Design + LESS for Digital VU Meeting

439 visualizaciones

Publicado el

  • Sé el primero en comentar

Responsive Design + LESS for Digital VU Meeting

  1. 1. crafting a mobileexperience withoutbuilding a separatemobile site Ryan Huber School of Medicine Web Development
  2. 2. crafting a tabletexperience withoutbuilding a separatetablet site Ryan Huber School of Medicine Web Development
  3. 3. crafting a netbookexperience withoutbuilding a separatenetbook site Ryan Huber School of Medicine Web Development
  4. 4. crafting a smarttvexperience withoutbuilding a separatesmarttv site Ryan Huber School of Medicine Web Development
  5. 5. why you’re here
  6. 6. responsiveweb design
  7. 7. it’s crazy trendy
  8. 8. because you love your users...
  9. 9. ...regardlessof the device they use
  10. 10. because yourmobile strategy...
  11. 11. doesn’t exist
  12. 12. Redirected from the page you actually wanted to our awesome mobile homepageor is... eh... 1. Five links 2. from our 3. full site we limited 4. assume 5. you want. no more content for you.
  13. 13. responsiveweb design
  14. 14. a design that adapts to the environment inwhich it is viewed
  15. 15. rather than aseparate site for each device
  16. 16. (pretty examples)
  17. 17. cool right?
  18. 18. developing(if html and css aren’t your thing, cover your ears)
  19. 19. write pretty html
  20. 20. write css for mobile
  21. 21. (here comes the magic part)
  22. 22. media queries
  23. 23. nitty gritty bits
  24. 24. disable initial scaling
  25. 25. webkit text sizeauto-adjusting
  26. 26. polyfill
  27. 27. images
  28. 28. safari scaling bug
  29. 29. don’t disable scaling!
  30. 30. more complex manipulations
  31. 31. grids
  32. 32. videos
  33. 33. wide tables
  34. 34. slideshows
  35. 35. performanceconsiderations
  36. 36. if all of thatseems like a lot to remember
  37. 37. Boilerplates
  38. 38. themes for your cms of choice
  39. 39. designing
  40. 40. a little uncomfortable?
  41. 41. The control which designersknow in the print medium, andoften desire in the webmedium, is simply a functionof the limitation of the printedpage. We should embrace thefact that the web doesn’t havethe same constraints, anddesign for this flexibility. - John Allsopp
  42. 42. a couple of ideas...
  43. 43. code iscompiled into CSS
  44. 44. hold it. you’reasking me to learna new language?
  45. 45. all CSSis valid code
  46. 46. (prepare for magic)
  47. 47. ryan.huber@vanderbilt.edu

×