Post on 22-Jan-2015
description
transcript
HTML5: Next-Gen Web Development<presenter name>
What is HTML?• HyperText Markup Language (HTML) is
the main markup language for creating web pages and other information that can be displayed in a web browser.
• HTML is written in the form of elements consisting of tags enclosed in angle brackets (like <html>), within the web page content.
• The purpose of a web browser is to read the HTML documents and compose them into visible or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page.
Enhances HTML with native support for latest multimedia and graphics
Leverages standards-based tools Consumes HTML4, XHTML and
DOM Compatible with JavaScript & CSS3 Contains JS APIs for complex web
applications Runs on smartphones and tablet
browsers Produces cross-channel web apps
What is HTML5?
Compatible
File/Hardware Access
Offline Storage
Graphics/Media
Canvas Screen controls and animation
Native media types (Including audio/video)
Store data locally
OS Integration
FEATURES
• Basic HTML Application is all HTML, server
side apps• Hybrid (Wrapper)
Run inside a native container, and leverage the device browser engine (but not the browser) to render the HTML and process the JS locally
• Mixed-Mode Version of native application
where some forms are rendered in the web view while others are rendered using the native SDK
• SPA – Single Page Application Native app experience in a
browser (Kony method)
HTML5 Flavors
Road to HTML5
1991
HTML
1998
CSS2
2002
TablelessWeb Design
1994
HTML2
1996
CSS1
JavaScript
1997
HTML4 2000
XHTML1 2005
AJAX
2009
Growth of HTML5
8
The Hype & The Promise• Development Advantages
No specialized skillset Single code base Backwards compatibility Easy to update / upgrade Cross channel and OS Faster time to market
• Business Advantages No commercial app stores Connect and reach more users Designed with mobile in mind Cost effective
HTML5 Has It’s Own Challenges
“We have definitely shifted from HTML5 to native. The primary reason for that is, we’re seeing that more and more people are spending more time in the app, and the app is running out of memory. The second reason we’ve gone native is trying to get some of the animations, that smoothness, we felt like we needed native to really do that well.”
Kiran Prasad, Senior Director for Mobile Engineering - Linkedin
“The biggest strategic mistake we made as a company was betting too much on HTML5 as opposed to native.”
Mark Zuckerberg
Browser Fragmentation All major browsers don’t
equally support HTML5 across all platforms
Compatibility testing must be done on all potential target browsers
Not a uniform standard Varies from browser-to-
browser and browser version
Must continuously optimize web app for multiple devices, browsers and platforms.
HTML5 Development Approach
Challenges• Less stable than native• Pulls in data much more slowly
than native• Browser fragmentation• No app store discoverability• May take longer to generate
revenue• Scarcity of mobile web developers• Less offline capabilities• Poor gaming capabilities• Not as UI rich as native• Less device access capabilities
Advantages• Leverage effective web search
technology for discoverability• Native mobile developers are
getting more expensive• More capable than HTML4• Multimedia support• Cost efficient• Cross-platform• Less maintenance• Multivariate testing• Faster time-to-market• Smaller device footprint• Easy to update / upgrade• Can be wrapped in hybrid format
Develop web apps with HTML5, JS and CSS3
Reuse UI/UX and business logic with HTML5/4 SPA method
Incorporate native device capabilities into hybrid apps
Same app definition used for web and native applications
Deliver device specific browser-optimized HTML5/4 markup
Import and reuse 3rd-party frameworks
Kony Development PlatformNext Generation HTML5
Tools / Frameworks
API
Outcomes
Integration
Device Specific
HTML 5/4
Kony mBaaS
Channel Specific
Hybrid Mixed-Mode
Kony & HTML5• SPA utilized to separate UI/UX from
business logic• HTML5/4 browser variation handling• Responsive and adaptive design• Native device capabilities, including
HTML5/4 with device detection for 10,000 device types
• Audio and video elements to support multimedia rendering without plugins
• Touch events and gestures• CSS3 for 2D & 3D transformations,
targeted media queries, gradients, rounded corners, shadows, and more
• Input elements to support a variety of types: number, email, URL, range, datapicker, etc.
• Semantic elements for sections, headers, footers, etc…
Eliminating HTML5 Challenge with KonyKony HTML5
Browser Fragmentation
Kony handles the variances to support HTML5 across “All” browsers
Developer codes the variances to support HTML5 across browsers
Cost Single platform for development and integration
Additional code required to handle current variances and development required for server side components
Testing Integrate test environment to test applications on “ALL” target devices
Apps must be tested on a range of popular devices. Developers must standup test suite for each target device
PerformanceHighly optimized code to maintain performance across varying hardware specifications
HTML5 may be designed to run on various devices, but no reliable way to maintain performance across varying hardware specifications
Where HTML5 is a Good Fit• Viable Solutions
Content driven industries without large user bases Publishing, magazines, newsletters, etc… Information/content-driven, forms-based
and mapping apps • Low Storage Requirement
Local storage limits for mobile web apps is 50 MB
• Simple Graphics Does not require highest quality UI/UX
• Extensive Device Interaction IS NOT Required HTML5 has limited support for device API’s
????
HTML5 is a fantastic technology that provides significant browsing improvements. However, it will not reduce the need for companies to provide native applications as a part of their mobile channel mix.
HTML5 development requires HTML, CSS3 and JavaScript expertise. If creating hybrid mobile apps without Kony, expertise with targeted device APIs is required.
Non–standard browsers implementations are caused by competitive forces, competition won’t go away. Browsers wars will produce continued fragmentation.
Many technologists hope HTML5 will be the silver bullet to tame the mobile chaos. HTML5 simply adds another development outcome organizations must support.
Debunking the Myths
HTML5 is all I need to go mobile.
I only need one skillset to build
HTML5 Applications.
Browsers will eventually
standardize HTML5.
Cost of developing an mobile app with HTML5 is less.
MYTH ✓FACT
MYTH
MYTH
MYTH
✓FACT
✓FACT
✓FACT
• Determine if HTML5 satisfies your business and user needs. It may be the right answer for your development efforts.
• Companies wanting to compete effectively in the mobile marketplace can’t rely on browser technology alone.
• With Kony, supporting new technologies like HTML5 becomes a business decision because we handle the mobile chaos for you.
• No need to gamble on the future of the mobile industry.
Summary