High edweb brousseau

596 views

Published on

Портал Как сделать презентацию http://presportal.ru/, Международная высшая школа презентаций и коммуникаций http://presuniversity.com/

Published in: Design, Technology, Art & Photos
  • Be the first to comment

High edweb brousseau

  1. 1. DESIGNINGBIG PICTUREfor the (multi)
  2. 2. Hi.I’m Jon
  3. 3. pixel fonts!
  4. 4. <wml><card id="content" title="Title Card"><p>My spiffy WML page.</p></card></wml>
  5. 5. WHYSO TELL MEI SHOULD CARE?
  6. 6. 20132005Source: NBC News
  7. 7. Source: Cisco Visual Networking IndexIN 2012GREWGLOBAL MOBILE DATA TRAFFIC70%
  8. 8. Look & Feel01Experience02Content03Technology04
  9. 9. 01THE LOOK & FEELlookin’ good
  10. 10. ONE WEBIT’S NO LONGER
  11. 11. 010203Desktop First
  12. 12. Mobile First010203
  13. 13. 02THE EXPERIENCEfeelin’ good
  14. 14. Pinch & Zoom
  15. 15. Drag
  16. 16. 03THE CONTENTmakin’ sense
  17. 17. 04THE TECHNOLOGYwhat makes it tick?
  18. 18. Responsive
  19. 19. .container { width: 960px; margin:0 auto; }@media screen and (max-width: 768px) {! .container { width: 728px; }}@media screen and (max-width: 320px) {! .container { width: 100%; }}
  20. 20. Single codebase;Less expensive and moreefficient to maintainMore code to render;image resizing may beinadequatesome pros: some cons:Responsive
  21. 21. Dedicated
  22. 22. Content specificityMore optimizedexperience;Separate codebase;Requires ServerConfigurationsome pros: some cons:Dedicated
  23. 23. DEDICATEDRESPONSIVEVERSUS or
  24. 24. 05THE CASE STUDIESputting it all together
  25. 25. BU HOMEPAGEbu.edu
  26. 26. THE BUSbu.edu/bus
  27. 27. BOSTONIAbu.edu/bostonia
  28. 28. THANK YOU

×