Mobile Web Is HereTuesday, September 18, 12
Agenda                  The Mobile Eco System                  Challenges for Mobile Developers                  Mobile We...
The Mobile Eco SystemTuesday, September 18, 12
The Mobile Eco System                                   Almost                                    Dead                 Alm...
How We Got Here                  1990, started using 2G                  systems                  1992, First SMS         ...
How We Got Here                  2G was good for talk,                  not good enough for                  data         ...
Modern Mobile Device                  3G or 3.5G capable                  Internet Connectivity                  Voice and...
Major Players                  Apple                  Google                  Nokia                  MicrosoftTuesday, Sep...
Apple                  2007, first iPhone                  device                  iPhone Power                        Focu...
Tuesday, September 18, 12
Google                  2005 Google Buys                  Android Inc                  2007 Announcing                  An...
Nokia                  The Oldest player in                  the game.                  World’s largest phone             ...
Microsoft                  Known best for its                  desktop applications.                  Its mobile version  ...
Which One Should You                  Choose ?                  iPhone apps are written in Objective C.                  A...
ALL OF THEMTuesday, September 18, 12
Mobile HTML/CSS/JS                  Web technology is the one thing all devices have                  in commonTuesday, Se...
Mobile HTML/CSS/JS                  Using HTML, CSS and JavaScript, we can write                  applications that will r...
Mobile HTML/CSS/JS                  These apps can run online or offline using HTML5                  offline capabilitiesTues...
Mobile HTML/CSS/JS                  Web apps can integrate                  special device capabilities to                ...
Web Vs. Native                              Write once, test     Write everywhere,                     Coding             ...
Mobile HTML/CSS/JS                  The App is a single html file, with many stylesheets                  and script files. ...
Mobile Web Challenges                  Develop & Test on many platforms                  Adjust UI to various screen sizes...
MOBILE APP USER EXPERIENCETuesday, September 18, 12
Mobile UX                  App is used in short bursts - waiting for the bus or                  subway                  A...
The Tools             Code Less, Do MoreTuesday, September 18, 12
Writing Apps                  Same source editor as the web                  Can use:                        Komodo Edit  ...
Writing Apps                  But you should really just use WebstormTuesday, September 18, 12
Debugging Apps -                  Desktop                  Use Safari/Chrome inspector tools to debug                  Use...
Debugging Apps -                  Device                  Use weinre For on device inspectionTuesday, September 18, 12
Deploying Apps                  For online apps, every web server will do.                  For offline apps, consider Phone...
Tips: Performance                  jQuery is not your friend (consider jqmobi)                  Test on a real device thro...
HTML5 Boilerplate                  A ready made starter for html5 mobile apps                  Cross-platform compatible (...
Mobile Frameworks                  JQuery Mobile                  Sencha Touch                  jqMobiTuesday, September 1...
jQuery Mobile                  Most hyped mobile framework today, and the one                  we’ll use in the course.   ...
Sencha Touch                  Stable and mature mobile framework                  Works best on iPhone & Android          ...
Q&ATuesday, September 18, 12
Thanks For Listening                  Ynon Perek                  ynonperek@yahoo.com                  ynonperek.comTuesda...
Upcoming SlideShare
Loading in...5
×

01 Mobile Web Introduction

2,381

Published on

An introductory keynote to mobile web development history and challanges

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,381
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
32
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

01 Mobile Web Introduction

  1. 1. Mobile Web Is HereTuesday, September 18, 12
  2. 2. Agenda The Mobile Eco System Challenges for Mobile Developers Mobile Web To The Rescue Online ResourcesTuesday, September 18, 12
  3. 3. The Mobile Eco SystemTuesday, September 18, 12
  4. 4. The Mobile Eco System Almost Dead Almost Dead Dead DeadTuesday, September 18, 12
  5. 5. How We Got Here 1990, started using 2G systems 1992, First SMS 1998, First ringtone sale 1999, First mobile internet in JapanTuesday, September 18, 12
  6. 6. How We Got Here 2G was good for talk, not good enough for data 2001, First 3G network in Japan 2007, 295 Mil subscribers on 3G networks worldwideTuesday, September 18, 12
  7. 7. Modern Mobile Device 3G or 3.5G capable Internet Connectivity Voice and Video calls No longer used “just for talking” Supports AppsTuesday, September 18, 12
  8. 8. Major Players Apple Google Nokia MicrosoftTuesday, September 18, 12
  9. 9. Apple 2007, first iPhone device iPhone Power Focus on Design Use Capacitive Touchscreen AppStore Built InTuesday, September 18, 12
  10. 10. Tuesday, September 18, 12
  11. 11. Google 2005 Google Buys Android Inc 2007 Announcing Android Platform 2008 HTC Dream (first Android Device)Tuesday, September 18, 12
  12. 12. Nokia The Oldest player in the game. World’s largest phone manufacturer. Owner of the Symbian OS.Tuesday, September 18, 12
  13. 13. Microsoft Known best for its desktop applications. Its mobile version Windows Mobile was never a success. Its newest product WinPhone7 looks promising.Tuesday, September 18, 12
  14. 14. Which One Should You Choose ? iPhone apps are written in Objective C. Android apps are written in Java. Symbian apps are written in C++. Blackberry apps are written in Java (but not the same Java as Android). WinPhone apps are written in .NETTuesday, September 18, 12
  15. 15. ALL OF THEMTuesday, September 18, 12
  16. 16. Mobile HTML/CSS/JS Web technology is the one thing all devices have in commonTuesday, September 18, 12
  17. 17. Mobile HTML/CSS/JS Using HTML, CSS and JavaScript, we can write applications that will run on any device.Tuesday, September 18, 12
  18. 18. Mobile HTML/CSS/JS These apps can run online or offline using HTML5 offline capabilitiesTuesday, September 18, 12
  19. 19. Mobile HTML/CSS/JS Web apps can integrate special device capabilities to create Hybrid Applications Music Waste Festival AppTuesday, September 18, 12
  20. 20. Web Vs. Native Write once, test Write everywhere, Coding everywhere Test everywhere Use limited device Use full device Caps capabilities capabilities Build your own UI Use device UI Look & Feel components componentsTuesday, September 18, 12
  21. 21. Mobile HTML/CSS/JS The App is a single html file, with many stylesheets and script files. Modular and OO JavaScript is used, to keep “state”Tuesday, September 18, 12
  22. 22. Mobile Web Challenges Develop & Test on many platforms Adjust UI to various screen sizes Handle mobile UXTuesday, September 18, 12
  23. 23. MOBILE APP USER EXPERIENCETuesday, September 18, 12
  24. 24. Mobile UX App is used in short bursts - waiting for the bus or subway App is used while watching TV App is interrupted by incoming call or SMSTuesday, September 18, 12
  25. 25. The Tools Code Less, Do MoreTuesday, September 18, 12
  26. 26. Writing Apps Same source editor as the web Can use: Komodo Edit Dashcode MacVim/gvim/vim Aptana StudioTuesday, September 18, 12
  27. 27. Writing Apps But you should really just use WebstormTuesday, September 18, 12
  28. 28. Debugging Apps - Desktop Use Safari/Chrome inspector tools to debug Use Ripple to test your hybrid app from chrome Use iPhone/Android Emulator Use BrowserStackTuesday, September 18, 12
  29. 29. Debugging Apps - Device Use weinre For on device inspectionTuesday, September 18, 12
  30. 30. Deploying Apps For online apps, every web server will do. For offline apps, consider PhoneGap Before deployment, use a build script to minimize js/css filesTuesday, September 18, 12
  31. 31. Tips: Performance jQuery is not your friend (consider jqmobi) Test on a real device throughout development Think about network trafficTuesday, September 18, 12
  32. 32. HTML5 Boilerplate A ready made starter for html5 mobile apps Cross-platform compatible (Android, iOS, Blackberry, Symbian) Supports all devices and overcomes many glitches http://html5boilerplate.com/mobile/Tuesday, September 18, 12
  33. 33. Mobile Frameworks JQuery Mobile Sencha Touch jqMobiTuesday, September 18, 12
  34. 34. jQuery Mobile Most hyped mobile framework today, and the one we’ll use in the course. Built on top of jQuery Themed UI WidgetsTuesday, September 18, 12
  35. 35. Sencha Touch Stable and mature mobile framework Works best on iPhone & Android Commercial framework (currently free)Tuesday, September 18, 12
  36. 36. Q&ATuesday, September 18, 12
  37. 37. Thanks For Listening Ynon Perek ynonperek@yahoo.com ynonperek.comTuesday, September 18, 12
  1. ¿Le ha llamado la atención una diapositiva en particular?

    Recortar diapositivas es una manera útil de recopilar información importante para consultarla más tarde.

×