Mobile web application development

2,194 views
2,141 views

Published on

An overview of

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,194
On SlideShare
0
From Embeds
0
Number of Embeds
363
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Mobile web application development

  1. 1. WebCamp KK: Episode 1 Mobile Web Application Development Vince Aggrippino a.k.a. Ghodmode http://www.ghodmode.com
  2. 2. About Me <ul>Vince Aggrippino <ul><li>Working in IT since 1990
  3. 3. US Army, 7 years
  4. 4. Programming since 2000
  5. 5. Programming for the web since 2004
  6. 6. Freelancing since 2005 </li></ul>Ghodmode Development http://www.ghodmode.com <ul><li>iddqd
  7. 7. ashtug ninda anghizidda arrflug </li></ul></ul>
  8. 8. Please save all of your questions until the end of the presentation.
  9. 9. Topics <ul><li>Why target the mobile market?
  10. 10. Target Platforms
  11. 11. User Agents
  12. 12. Web Development Technologies
  13. 13. Reference Materials and Tools
  14. 14. Things to consider </li></ul>
  15. 15. Why Mobile Web Apps? <ul><li>Millions of new iOS and Android devices are registered every day. Web apps can target all of them.
  16. 16. Web apps don't (necessarily) require, installation, an account, a credit card, or any personal information to use.
  17. 17. Mobile device platforms are more consistent.
  18. 18. No specialized tools, hardware, or restrictive licenses required for development. </li></ul>
  19. 19. Target Platforms <ul><li>iOS - Apple's proprietary mobile operating system </li></ul><ul><ul><li>Over 200 million devices * </li></ul><li>Android - Google's Open Source Φ mobile operating system </li><ul><li>Nearly 140 million devices § </li></ul></ul>* Live from WWDC 2011 - This is my next Φ Is Android Open? - Wired.com § Android reaches 130 million devices, growing by 550,000 a day - This is my next
  20. 20. Other Platforms? <ul><li>Windows Phone 7
  21. 21. Blackberry OS
  22. 22. HP WebOS
  23. 23. Palm OS
  24. 24. Windows Mobile
  25. 25. Windows CE </li></ul>As is the case with PC browsers, we have to consider project requirements and target audience.
  26. 26. User Agents* Webkit Opera Mozilla / Gecko Trident (Internet Explorer) <ul><li>User Agent = term used in W3C documentation to generically refer to a web browser's rendering engine. </li></ul>
  27. 27. Web Development Technologies <ul><li>HTML5 </li><ul><li>Apple's early domination of the mobile market and their stance against Flash support have pushed browser vendors into better HTML5 support. </li></ul><li>CSS3 </li><ul><li>It's not the same as HTML5... or is it? * </li></ul><li>Javascript </li><ul><li>Along with the use of libraries like jQuery and MooTools, Javascript has become the most powerful tool at our disposal. </li></ul></ul><ul><li>Adactio: Journal ― Badge of shame </li></ul>
  28. 28. Reference <ul><li>W3C Mobile Web Initiative
  29. 29. W3C: Standards for Web Applications on Mobile
  30. 30. Safari Dev Center
  31. 31. Safari on iPhone Tools Coding How-To's
  32. 32. Android Developers: Web Apps Overview
  33. 33. Smashing Magazine: How To Build a Mobile Website </li></ul>
  34. 34. Tools <ul><li>Modernizr - feature detection
  35. 35. PhoneGap *
  36. 36. Sencha Touch - Mobile Javascript Framework
  37. 37. HTML5BoilerPlate - Mobile Boilerplate
  38. 38. jQuery Mobile
  39. 39. W3C MobileOK Checker </li></ul><ul><li>PhoneGap is not actually a web development framework. It's a framework for building and deploying native applications using HTML5, CSS3, and Javascript. </li></ul>
  40. 40. Things to Consider <ul><li>In contrast with the prevailing wisdom for PC website development, many articles recommend User Agent detection (a.k.a. browser sniffing).
  41. 41. Mobile users usually have lower screen resolution.
  42. 42. Mobile users usually have low internet speeds.
  43. 43. Mobile users usually have bandwidth limitations.
  44. 44. Use web search, forums, and mailing lists! </li></ul>
  45. 45. Summary <ul><li>Mobile Web applications are quicker and easier to deploy and allow us to target a larger market than native applications.
  46. 46. Fewer differences between mobile browsers and better standards compliance means quicker development and fewer bugs.
  47. 47. General support for HTML5, CSS3, and JavaScript lets us do more with less code and fewer dependencies.
  48. 48. There is an abundance of information available and numerous tools available that can make this fun and easy.
  49. 49. This isn't the same as desktop web application development. It's still changing, but in some ways, it's better. </li></ul>

×