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

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, UK
THE POWER OF HTML5
15 Reasons Your Business Should be Using
HTML5 for Web & Mobile
Dave Porter – SproutCore Developer & Core Team Member
marketing@appnovation.com
Dave Porter V

2. Appnovation is one
of the world’s TOP
OPEN SOURCE
DEVELOPMENT
SHOPS.
Dave Porter V

3. LOCATIONS
VANCOUVER OFFICE ATLANTA OFFICE LONDON OFFICE
152 West Hastings Street 3414 Peachtree Road, #1600 3000 Hillswood Drive
Vancouver BC, V6B 1G8 Atlanta Georgia, 30326-1164 Hillswood Business Park
Chertsey KT16 0RS, UK
Dave Porter V

4. Dave Porter V

5. The Power
Of HTML5
Dave Porter V

6. WHAT IS HTML5?
HTML5
CSS3
Blazing-Fast JavaScript
Powerful New JavaScript APIs
Dave Porter V

7. WHAT IS HTML5?
STANDARD BASED!
Dave Porter V

8. The Decline
of Flash
Dave Porter V

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. 1. THE DECLINE OF FLASH
If you want
to be on the
mobile web,
you can’t be
on Flash.
Dave Porter V

11. Write Once
Run Anywhere
Dave Porter V

12. 2. WRITE ONCE, RUN ANYWHERE
• PC
• Mac
• Linux
• iPhone
• iPad
• Android
• Kindle Fire
• Model S
• “Smart” Refrigerators
• Airplane seat-back screens
Dave Porter V

13. Responsive
Design
Dave Porter V

14. 3. RESPONSIVE DESIGN
Dave Porter V

15. 3. RESPONSIVE DESIGN
Dave Porter V

16. 3. RESPONSIVE DESIGN
Dave Porter V

17. 3. RESPONSIVE DESIGN
Dave Porter V

18. 3. RESPONSIVE DESIGN
Dave Porter V

19. 3. RESPONSIVE DESIGN
Dave Porter V

20. 3. RESPONSIVE DESIGN
One Site, any Display
On screen: NYDOT by Appnovation
Dave Porter V

21. Mobile, Mobile,
Mobile!
Dave Porter V

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. 4. MOBILE, MOBILE, MOBILE
Dave Porter V

24. 4. MOBILE, MOBILE, MOBILE
• Is HTML5 ready to
deliver sophisticated
mobile applications?
• Performance: Great
on iPad
• Performance: iPhone
5 is a turning point
Dave Porter V

25. Control Your
Development
Costs
Dave Porter V

26. 5. CONTROL YOUR DEVELOPMENT COSTS
• Cover more users with one product
• Avoid rare, specialized skillsets
• Zero-headache deployment
Dave Porter V

27. Control Your
Destiny
Dave Porter V

28. 6. CONTROL YOUR DESTINY
Nobody owns the web
No 30% app store fees
No sales channel rules
No long approval waits
Dave Porter V

29. Moving Forward
with Backwards
Compatibility
Dave Porter V

30. 7. MOVING FORWARD WITH BACKWARDS
COMPATIBILITY
• No more broken
websites
• Standards promise
to stay standards.
• Additive evolution:
new features too,
not instead
Dave Porter V

31. Accessibility
Dave Porter V

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. Standard-
Based Video
Dave Porter V

34. 9. STANDARD BASED VIDEO
Dave Porter V

35. 9. STANDARD BASED VIDEO
Dave Porter V

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. Location
Awareness
Dave Porter V

38. 10. LOCATION AWARENESS
• Act mobile in mobile browsers
• Provide better value in context
• Location-based targeting & marketing
Dave Porter V

39. 10. LOCATION AWARENESS
navigator.geolocation.
getCurrentLocation(cal
lback);
Dave Porter V

40. Enterprise-
class Features
Dave Porter V

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. Open-Source
Has Your Back
Dave Porter V

43. 12. OPEN-SOURCE HAS YOUR BACK
jQuery / Twitter embeds / ember.js / SproutCore
Dave Porter V

44. The Fastest-
Moving
Platform Period
Dave Porter V

45. 13. THE FASTEST-MOVING PLATFORM PERIOD
• Apple
• Google
• Microsoft
• Adobe
• You benefit for free.
Dave Porter V

46. WEB + APP
Dave Porter V

47. 14. WEB + APP
• The technology is speeding ahead
• No more tradeoffs
• Open, standardized web technologies are
ready.
Dave Porter V

48. HTML5 Is
The Future
Dave Porter V

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. 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.com
Dave Porter V