What is an Open Web App, technically?
An Open Web App is much more than an HTML application. Think of Open Web Apps (OWA) as Web-standards-built applications or "Web runtime" applications.
A Web runtime application runs outside a normal browser and can be launched from the desktop (or device equivalent) on any of the popular internet-connected devices. Of course, Web runtime applications can be run inside the browser too if the user prefers.
Although HTML5 is an evolution of the HTML syntax specification, in practice it is a wave of new or enhanced technologies.
For an Open Web App, you can use:
- HTML5 as the declarative syntax to define the structure of the application's user interface.
- CSS3 as the declarative syntax to define layout, visual aesthetics and portions of the UI behavior. Using CSS3, you can custom-tailor the visual experience to any device that needs a specific presentation without having to re-implement structure or programmatic logic.
- New technologies that are part of the HTML5 wave if not the HTML5 markup specification such as AppCache, WebStorage, WebSockets, WebWorkers, Server-Sent Events, Crypto API, etc.
When appropriate, you can augment Web runtime applications with server-side logic, for use when the user's device is in a connected state. Though Web runtime applications can run whether or not they can connect to the worldwide Web, you can offer an enhanced experience when connected. You can choose any server-side platform and technology that you like, since the application and the server communicate over HTTP/S using standard mechanisms such as JSON and XML.
Open Web Apps are called open because they should work on any Web platform, be it Firefox, Chrome, whatever on any device be it a desktop computer, laptop, phone, whatever. So theoretically when you develop an OWA it will run everywhere. Practically, since some vendors aren't all aiming in the standardizing direction, making an OWA run from one web platform to the other may require some adaptation work that should diminish as time goes by.
I've already built a Web application. How do I make it into an installable app?
In practice, there is usually a great deal more that needs to be done. For more information, see App development for Web developers.
What is the difference between an app and a website?
An app can:
- Run outside a normal browser
- Run whether the device is connected to the Internet or not
- Be launched in the same way a native device application is launched
At a minimum, an app is a website that can be "installed" on a mobile device or computer so that it looks to a user like a native application. You can distribute it either on your own website or through an app store. Both can be built using open Web standards such as HTML5. You can control access to a Web app, so that only paid users can access it.
A site that is an app should be designed to work when the device is not on the Internet, or at least to fail gracefully. Building HTML5 Web runtime applications (as opposed to building sites that will always be visited from the Internet in a browser) requires some architectural additions to handle staes like "sometimes connected," etc.
Building HTML5 sites (instead of apps) tends to focus on implementing page structure using the new HTML5 semantics.
Note that HTML5 apps versus sites is not an either-or proposition. You can build HTML5 "applications" that can run either inside a browser or outside it, and you can design them to provide an enhanced user experience when the user's device is connected to the Internet.
Should I build a website or an app?
What is the difference between an app and an add-on?
Add-ons (such as built with JetPack) are extensions to your Firefox browser. Add-ons provide little or no UI component at all, and only extend the capabilities/behavior of the browser in specific ways. For example add-ons can provide new buttons to the UI (for example by adding a button near the address bar to block ads, or new menu items to change some options), or change internal functions (for example by improving your privacy through the processing of the Web browser in-and-out net traffic).
Apps (theoretically) run in any modern Web browser (both on desktop as well as mobile) and are not browser specific. Apps are complete applications such as office applications, productivity applications, image processing applications, games, etc.
Finally, add-ons are usually in effect across all websites (for example ads can be blocked on all websites, network privacy improved while visiting all websites), even if some add-ons are designed to interact with specific web sites/services. Apps on the other side don’t combine with other apps in this way; they run standalone, like any regular website.
- is browser specific
- extends the browser default capabilities
- is effective on all visited web sites
- can be active in the browser with unlimited other add-ons
Open Web App:
- is web platform neutral (theoretically)
- is tied to a specific business case or use case
- runs outside of a normal browser, is "a kind of website" by itself
- is only one web app at the time (obviously)
- might install a link/icon in the menus/desktop of the host system to get started
What tools should I use to build Open Web Apps?
Use the same tool set you would choose for Web development on your platform of choice. Most "current" editors and IDEs for Web development support HTML5 syntax.
Can my app access device-level APIs?
Hows does an Open Web App work across platforms? Form factors?
If you wish to provide the richest possible experience, you can also write code to detect the presence of "optional devices" like a camera, and leverage them as appropriate for the application.
How can my app detect that it is in the Web runtime?
There are a few ways you can check this:
- Use the
- Use the
window.locationbar.visible. See Navigation.
- To detect if the app is running in Firefox OS, you can use code like this: