Cross platform app development with HTML5
Much has been said about programming apps on this blog; also about Android and iOS app development, on responsive and native applications and about how to monetise all these mobile projects. Even app design has secured a foothold in our blog. However, there is a good mobile development option available to us that we’ve never made abundantly clear. We’re talking about cross-platform app development with HTML5.
For those who have just landed to the world of apps, the difference between native and cross-platform applications is that the former is ‘written’ in their own app programming language. On the other hand, the latter is developed in a single code that is interpreted and adjusted to the different devices; we would say that the concept is practically synonymous to that of web applications − which we’ve discussed several times.
HTML5 is precisely one of the languages allowing us to create cross-platform apps − which can be accessible from any device – by undertaking a single development process. Let’s see what it is a little more in-depth.
What exactly is HTML5?
HTML5 is a markup language used to structure and display content in websites. It provides support to advanced multimedia applications − including audio and video. But it also allows us to modify a page’s layout and thus change its appearance.
In this regard, how can app developers take advantage of it? An expert can programme interactive apps with HMTL5 that will be displayed via a browser on any device.
HTML5 is indeed one of the most versatile languages for developing web applications and the most widely used for creating non-native apps.
Why programming apps with HTML5?
First of all, it’s worth noting that HTML5 is a very widely used programming language. In fact, it’s the standard web programming language since October 2014, so there are always plenty of resources on it to be found. In addition, the World Wide Web Consortium (W3C) has bestowed its “Recommended” stamp upon its fifth version.
Compared to previous versions of HTML and other programming languages, its fifth version includes new features for including video and audio and – on top of that − implements responsive design automatically.
We have already made it clear why this programming language is important both in a global sense and for conventional programmers. But do you know which features render it one of the best options for programming cross-platform apps? We will now discuss the advantages that HTML5 entails when used to create mobile applications.
- First and foremost we come across its universality, i.e. it works in all browsers, whether on mobile devices or on a traditional computer. The code is interpreted and displayed by any browser (Chrome, Safari, Firefox, Internet Explorer…).
- It’s also a language with a clear audio-visual vocation and allows including both audio and video at a native level. It stands up for showing and including multimedia content.
- It’s a very good option for limited budgets because it’s cheaper than other native alternatives. Likewise, an HTML5 version entails significant savings when getting our business or mobile game started by developing a beta version and is a clever way to see if it works and if there is a market for it. Games like Candy Crush and the like (puzzle solving) can be created with this technology and be redeveloped as native apps later on.
- HTML allows you to programme apps in beta. And last but not least, HTML5 is an open-source kind of language: i.e. anyone can modify, improve, expand or implement new services on already developed applications.
Advantages and disadvantages of cross-platform app development
To keep up with what we were saying in the last section, most of the benefits associated with creating cross-platform apps with HTML5 and other languages are to be exploited by former web developers. Web developers can use their previous experience to get acquainted with cross-platform app development very quickly and easily.
“Another advantage is that developing the same app for Android, iOS and Windows Phone takes up double or triple the resources,” adds José Antonio Llopis, Technical Director at Yeeply.
Among its disadvantages, we come across the app’s speed, which gets reduced to a great extent. Similarly, access to the device’s hardware is limited to the available plugins. Another drawback is that − even if the app should work theoretically on any platform automatically − this is not entirely true. In the real world, we must check our app on all platforms to be sure that a given feature that looks good on a certain platform is also working well in the other ones.
REMEMBER that even if an app is a cross-platform app, it’s necessary to generate an app (for Android devices) or a native IPA (for iOS devices) for it to be legible and displayed on mobile devices. This is the reason why we’ll need SDK’s for each platform. Alternatively, we can use services like Adobe Build that will generate these automatically for us.
Cross-platform app development tools
The most common cross-platform app development tools for apps of the WebView type are shown below:
- Ionic: it’s a free and open-source tool for hybrid app development based on HTML5, CSS, and JS. The tool is built around Sass and optimised with AngularJS.
Although the quality of these applications is not the best to be found − especially when compared with native app development − they work very well for small and medium projects that require neither high performance nor too many features. As a matter of fact, Facebook’s first application was developed with this technology until it was later decided to develop native app versions.
Well, what about you? Do you know how to programme cross-platform apps? Which tools are you using? Is there anything we’ve missed in our article?