Native vs. HTML5 Applications: Which Approach is Best?

Share on FacebookTweet about this on TwitterShare on LinkedInGoogle+

Share on FacebookTweet about this on TwitterShare on LinkedInGoogle+

When we’re approached about building a mobile application, the first question we often get is, “How much will it cost?” While we’ve already discussed that topic in a previous blog, one of the factors that dictate cost comes down to what type of mobile application you want us to build.

segue-blog-native-vs-HTML5-applications

 

There are essentially three different types of mobile applications:

  1. Native applications
  2. HTML5 applications
  3. Hybrid applications

Native Applications: Benefits and Drawbacks

A native application is installed directly onto your phone. They’re usually designed and built specifically for your device. They’re also not cross-platform, meaning you can’t build an iOS app and have it run on an Android device – a separate Android application is also needed.

Native applications can make better use of your device’s hardware capabilities (GPS, microphones, accelerometers, etc.). They’re best suited for rich user experiences and can provide a level of interaction HTML5 apps cannot currently reach. Native applications offer the developers and users the ability to use standardized UI controls, making interfaces more natural to users. These types of intuitive interfaces typically make users very happy.

Benefits:

  • Available through standard device marketplaces (iTunes store, Google Play store) which allow for paid applications or licensing fees that can supply the developer with a revenue stream
  • Allow for a richer user experience
  • User interface is designed for a single targeted operating system, allowing for familiar UI controls to be used
  • Can support offline usage (usable when there is no network connectivity)
  • Provide increased security options (data at rest and in transit can be encrypted)
  • Background processes can be leveraged to provide push notifications, monitor for specific events

Drawbacks:

  • Require separate development efforts for each supported operating system
  • Market fragmentation could limit your target audience if you’re trying to use newer device/OS features
  • Application updates must be pushed for each platform through the app stores
  • Increased costs to support multiple platforms
  • Applications must go through app-store approval processes (iTunes, Google Play)

HTML5 Applications: Benefits and Drawbacks

These applications are written in HTML, JavaScript, and CSS. They run in your device’s web browser, not within their own container, and allow developers to create a single application that can run on almost any device. This keeps developers from having to develop, maintain, and publish separate code bases for each operating system.

However, with an HTML5 application, there are a number of tradeoffs that must be made. For example, iPhone users like their tabs at the bottom of the screen. Android puts them at the top. With a single application, designers have to make decisions that could leave one group feeling left out. Trying to blend the two interfaces also leads to a seemingly muddled interface. Usually, the best approach here is to be generic enough that the app doesn’t feel too much like iOS or Android. Customized graphics, navigation controls, and icons can make your app feel more natural to users. Those things, however, require additional development, since you’re not able to leverage the native UI controls.

There is a time and place for HTML5 applications. Usually, they’re best suited for lightweight applications that do not need to be secured or rely too heavily on native device functionality. They’re also usually a good option for budget-conscious developers or when content will be changing often.

Benefits:

  • Single application for all users, regardless of operating system, hardware, or network.
  • Faster time to market.
  • Reduced development costs.
  • Centralized code base does not require “updates” to be pushed to each user. They’re always on the current version.
  • No app store approval process.

Drawbacks:

  • No centralized “App Store” for HTML5 applications, resulting in reduced monetization options and no built-in support for in-app purchases – you must process all transactions externally.
  • Can’t leverage app store for marketing options /search availability.
  • Device browser inconsistencies don’t truly allow for a “write once, run everywhere” approach. Testing and optimization for each browser is still required.
  • Data at rest (browser cache) cannot be encrypted.
  • No background processes are available. Users must have your app open in order for you to interact with them. This includes push notifications.
  • User interface must be consistent for all platforms, usually causing one group to feel alienated.

Hybrid Applications: Benefits and Drawbacks

A hybrid application is essentially an HTML5 application inside a native application wrapper. This approach allows developers to leverage much of the benefits of a native application (hardware availability, background processes, etc.) while still using HTML5 for the majority of the content.

Hybrid apps can be a bit tricky sometimes. Apple’s approval process might not let your app into the iTunes store if they don’t think you’re offering enough value to your users. They might tell you to just launch it as a web page if your application only provides an icon and a web view to your HTML5 site. Android is a bit more lenient on this, but users are typically not as receptive. Mobile users have been getting much better at identifying those apps that only provide a bookmark to a mobile website.

The best time to choose a hybrid application is when your content is more dynamic and will change constantly, but you want your users to have a richer experience than what they’d normally get on a mobile-optimized website. Allowing them to store login credentials, maintain notification settings, access GPS data, etc. are all examples of value that can be added to a basic HTML5 application.

Benefits:

  • Shorter development time than a fully native application.
  • Interface could use native controls, or be built fully in HTML5. These are the major design considerations.
  • Support for more dynamic content.
  • Background processes and notifications can be leveraged.

Drawbacks:

  • Developers still need to maintain multiple (albeit smaller) sets of code for each platform.
  • Applications must go through approval processes for app stores.
  • User experience may not be as rich as many users expect from a native application.

In conclusion, the type of application you develop really depends on what you want your users to do, your time frame, and your budget. Native applications can provide the most rewarding experiences, both in revenue streams for you and the experience for your users, but can be costly. HTML5 applications can provide the “good enough” experience, but may leave users feeling like they’re missing out on something. Hybrid apps can provide the middle ground between the two, but must be very carefully designed in order to create a successful user experience in all platforms.

Download our Mobile eBook