The Power of HTML5: 15 reasons your business should be using HTML5 for web and mobile

1,600 views
1,458 views

Published on

Slides from the webinar conducted on November 8, 2012. Presenter: Dave Porter

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
1,600
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
26
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • The Power of HTML5: 15 reasons your business should be using HTML5 for web & mobile.
  • HTML5: integrated audio, video, canvass (for drawing) & SVG (Scalable Vector Graphics).CSS3: Rounded corners, gradients, smooth scaling, skewing, animations, media queries.JS: Do more things, much faster.
  • This was always the great promise of the web. In 2012, we can finally deliver.
  • read.kobo.com
  • read.kobo.com
  • read.kobo.com
  • 1, 2 - Pew Research Center at http://pewinternet.org/Reports/2012/Smartphone-Update-2012/Findings.aspx3 - Flurry mobile analytics - http://blog.flurry.com/bid/88867/iOS-and-Android-Adoption-Explodes-Internationally4 – IDC via http://www.idc.com/getdoc.jsp?containerId=prUS23398412
  • IDC via http://www.idc.com/getdoc.jsp?containerId=prUS23398412
  • This is a limited use case but is a great, visceral example of how far the standards process has brought us.
  • Yelp is the most popular (and most straight-forward) example of browser geolocation put to good use.
  • Data storage & querying:LocalStorage, WebSQL, IndexedDB for performance and offline cachingFast, two-way communication: Web SocketsBig performance for big data: Web WorkersEasy CSS animations: CSS transitions & keyframe animationsFull 3D graphics: WebGL
  • 1990s: Browser wars2003: Apple releases WebKit2004: Firefox 1.0, funded largely by Google2008: Chrome; Google begins iterating and turns JavaScript into a world-class programming language2010 – 2011: IE9; Microsoft gets on board with standards2011 – 2012: Adobe begins contributing to CSS3These companies (market cap of $1.05T) are investing heavily to improve the platform, and you benefit for free
  • 1, 2 – caniuse.com3 – netmarketshare.com
  • The Power of HTML5: 15 reasons your business should be using HTML5 for web and mobile

    1. 1. CANADIAN HEADQUARTERS UNITED STATES OFFICE UNITED KINGDOM OFFICE www.appnovation.com 152 West Hastings Street 3414 Peachtree Road, #1600 3000 Hillswood Drive info@appnovation.com Vancouver BC, V6B 1G8 Atlanta Georgia, 30326-1164 Hillswood Business Park Chertsey KT16 0RS, UKTHE POWER OF HTML5 15 Reasons Your Business Should be Using HTML5 for Web & Mobile Dave Porter – SproutCore Developer & Core Team Member marketing@appnovation.comDave Porter V
    2. 2. Appnovation is oneof the world’s TOPOPEN SOURCEDEVELOPMENTSHOPS.Dave Porter V
    3. 3. LOCATIONSVANCOUVER OFFICE ATLANTA OFFICE LONDON OFFICE152 West Hastings Street 3414 Peachtree Road, #1600 3000 Hillswood DriveVancouver BC, V6B 1G8 Atlanta Georgia, 30326-1164 Hillswood Business Park Chertsey KT16 0RS, UK Dave Porter V
    4. 4. Dave Porter V
    5. 5. The Power Of HTML5Dave Porter V
    6. 6. WHAT IS HTML5? HTML5 CSS3 Blazing-Fast JavaScript Powerful New JavaScript APIsDave Porter V
    7. 7. WHAT IS HTML5? STANDARD BASED!Dave Porter V
    8. 8. The Decline of FlashDave Porter V
    9. 9. 1. THE DECLINE OF FLASH • Interactive, video, big-data websites in 2005: Flash / Flex • June 2007: iPhone ships without Flash, Adobe promises it “soon” • April 2010: Steve Jobs publishes “Thoughts on Flash” • August 2010: Adobe releases crippled, battery-draining Flash for Android • October 2011: Adobe begins contributing to CSS3 • June 2012: Adobe ceases development of Flash for mobile; removes it from Android store Dave Porter V
    10. 10. 1. THE DECLINE OF FLASH If you want to be on the mobile web, you can’t be on Flash. Dave Porter V
    11. 11. Write Once Run AnywhereDave Porter V
    12. 12. 2. WRITE ONCE, RUN ANYWHERE • PC • Mac • Linux • iPhone • iPad • Android • Kindle Fire • Model S • “Smart” Refrigerators • Airplane seat-back screensDave Porter V
    13. 13. Responsive DesignDave Porter V
    14. 14. 3. RESPONSIVE DESIGNDave Porter V
    15. 15. 3. RESPONSIVE DESIGNDave Porter V
    16. 16. 3. RESPONSIVE DESIGNDave Porter V
    17. 17. 3. RESPONSIVE DESIGNDave Porter V
    18. 18. 3. RESPONSIVE DESIGNDave Porter V
    19. 19. 3. RESPONSIVE DESIGNDave Porter V
    20. 20. 3. RESPONSIVE DESIGN One Site, any Display On screen: NYDOT by AppnovationDave Porter V
    21. 21. Mobile, Mobile, Mobile!Dave Porter V
    22. 22. 4. MOBILE, MOBILE, MOBILE!• 46% of US adults carry smartphones• >100M US users in 2013• Worldwide: over 450M users TODAY• 1.6B by 2016 Dave Porter V
    23. 23. 4. MOBILE, MOBILE, MOBILEDave Porter V
    24. 24. 4. MOBILE, MOBILE, MOBILE • Is HTML5 ready to deliver sophisticated mobile applications? • Performance: Great on iPad • Performance: iPhone 5 is a turning pointDave Porter V
    25. 25. Control Your Development CostsDave Porter V
    26. 26. 5. CONTROL YOUR DEVELOPMENT COSTS• Cover more users with one product• Avoid rare, specialized skillsets• Zero-headache deploymentDave Porter V
    27. 27. Control Your DestinyDave Porter V
    28. 28. 6. CONTROL YOUR DESTINY Nobody owns the web No 30% app store fees No sales channel rules No long approval waitsDave Porter V
    29. 29. Moving Forward with Backwards CompatibilityDave Porter V
    30. 30. 7. MOVING FORWARD WITH BACKWARDSCOMPATIBILITY • No more broken websites • Standards promise to stay standards. • Additive evolution: new features too, not instead Dave Porter V
    31. 31. AccessibilityDave Porter V
    32. 32. 8. ACCESSIBILITY• Section 508, Federal Rehabilitation Act of 1973• Web browsers come accessibility-ready• WIA-ARIA: Accessible Rich Internet Application standards <img src=”info.png” aria-label=”Information”/> Dave Porter V
    33. 33. Standard- Based VideoDave Porter V
    34. 34. 9. STANDARD BASED VIDEODave Porter V
    35. 35. 9. STANDARD BASED VIDEODave Porter V
    36. 36. 9. STANDARD BASED VIDEO http://www.craftymind.com/ 2010/04/20/blowing-up- html5-video-and-mapping- it-into-3d-space/Dave Porter V
    37. 37. Location AwarenessDave Porter V
    38. 38. 10. LOCATION AWARENESS• Act mobile in mobile browsers• Provide better value in context• Location-based targeting & marketingDave Porter V
    39. 39. 10. LOCATION AWARENESSnavigator.geolocation.getCurrentLocation(cal lback);Dave Porter V
    40. 40. Enterprise- class FeaturesDave Porter V
    41. 41. 11. ENTERPRISE-CLASS FEATURES• Data storage & querying• Fast, two-way communication• Big performance for big data• Visual flair: from easy CSS animation to full 3D graphics• Feature-parity with native solutions. Dave Porter V
    42. 42. Open-Source Has Your BackDave Porter V
    43. 43. 12. OPEN-SOURCE HAS YOUR BACKjQuery / Twitter embeds / ember.js / SproutCoreDave Porter V
    44. 44. The Fastest- Moving Platform PeriodDave Porter V
    45. 45. 13. THE FASTEST-MOVING PLATFORM PERIOD• Apple• Google• Microsoft• Adobe• You benefit for free. Dave Porter V
    46. 46. WEB + APPDave Porter V
    47. 47. 14. WEB + APP• The technology is speeding ahead• No more tradeoffs• Open, standardized web technologies are ready. Dave Porter V
    48. 48. HTML5 Is The FutureDave Porter V
    49. 49. 15. HTML5 IS THE FUTURE • Basic HTML5 – 77% compatibility • Advanced HTML5 – 60% compatibility • Mobile - 10% browser share • ...and rising rapidly Dave Porter V
    50. 50. CANADIAN HEADQUARTERS UNITED STATES OFFICE UNITED KINGDOM OFFICE www.appnovation.com 152 West Hastings Street 3414 Peachtree Road, #1600 3000 Hillswood Drive info@appnovation.com Vancouver BC, V6B 1G8 Atlanta Georgia, 30326-1164 Hillswood Business Park Chertsey KT16 0RS, UK Thank You For Your Participation! QUESTIONS?Dave Porter – SproutCore Core Team Member marketing@appnovation.comDave Porter V

    ×