01 Mobile Web Introduction
2 likes1,880 views
The document discusses the rise of mobile web development. It covers the evolution of mobile devices and their capabilities. Major mobile platforms like iOS, Android, Symbian and Windows Phone are summarized. The document argues that mobile web development using HTML, CSS and JavaScript is the best approach for cross-platform apps since it will run on all devices. Tools for mobile web development and frameworks like jQuery Mobile, Sencha Touch and jqMobi are also covered.
01 Mobile Web Introduction
- 1. Mobile Web Is Here Tuesday, September 18, 12
- 2. Agenda The Mobile Eco System Challenges for Mobile Developers Mobile Web To The Rescue Online Resources Tuesday, September 18, 12
- 3. The Mobile Eco System Tuesday, September 18, 12
- 4. The Mobile Eco System Almost Dead Almost Dead Dead Dead Tuesday, September 18, 12
- 5. How We Got Here 1990, started using 2G systems 1992, First SMS 1998, First ringtone sale 1999, First mobile internet in Japan Tuesday, September 18, 12
- 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 worldwide Tuesday, September 18, 12
- 7. Modern Mobile Device 3G or 3.5G capable Internet Connectivity Voice and Video calls No longer used “just for talking” Supports Apps Tuesday, September 18, 12
- 8. Major Players Apple Google Nokia Microsoft Tuesday, September 18, 12
- 9. Apple 2007, first iPhone device iPhone Power Focus on Design Use Capacitive Touchscreen AppStore Built In Tuesday, September 18, 12
- 10. Tuesday, September 18, 12
- 11. Google 2005 Google Buys Android Inc 2007 Announcing Android Platform 2008 HTC Dream (first Android Device) Tuesday, September 18, 12
- 12. Nokia The Oldest player in the game. World’s largest phone manufacturer. Owner of the Symbian OS. Tuesday, September 18, 12
- 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. 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 .NET Tuesday, September 18, 12
- 15. ALL OF THEM Tuesday, September 18, 12
- 16. Mobile HTML/CSS/JS Web technology is the one thing all devices have in common Tuesday, September 18, 12
- 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. Mobile HTML/CSS/JS These apps can run online or offline using HTML5 offline capabilities Tuesday, September 18, 12
- 19. Mobile HTML/CSS/JS Web apps can integrate special device capabilities to create Hybrid Applications Music Waste Festival App Tuesday, September 18, 12
- 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 components Tuesday, September 18, 12
- 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. Mobile Web Challenges Develop & Test on many platforms Adjust UI to various screen sizes Handle mobile UX Tuesday, September 18, 12
- 23. MOBILE APP USER EXPERIENCE Tuesday, September 18, 12
- 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 SMS Tuesday, September 18, 12
- 25. The Tools Code Less, Do More Tuesday, September 18, 12
- 26. Writing Apps Same source editor as the web Can use: Komodo Edit Dashcode MacVim/gvim/vim Aptana Studio Tuesday, September 18, 12
- 27. Writing Apps But you should really just use Webstorm Tuesday, September 18, 12
- 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 BrowserStack Tuesday, September 18, 12
- 29. Debugging Apps - Device Use weinre For on device inspection Tuesday, September 18, 12
- 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 files Tuesday, September 18, 12
- 31. Tips: Performance jQuery is not your friend (consider jqmobi) Test on a real device throughout development Think about network traffic Tuesday, September 18, 12
- 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. Mobile Frameworks JQuery Mobile Sencha Touch jqMobi Tuesday, September 18, 12
- 34. jQuery Mobile Most hyped mobile framework today, and the one we’ll use in the course. Built on top of jQuery Themed UI Widgets Tuesday, September 18, 12
- 35. Sencha Touch Stable and mature mobile framework Works best on iPhone & Android Commercial framework (currently free) Tuesday, September 18, 12
- 36. Q&A Tuesday, September 18, 12
- 37. Thanks For Listening Ynon Perek ynonperek@yahoo.com ynonperek.com Tuesday, September 18, 12