Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

FAQs sobre apps

Tecnicamente, o que é uma Open Web App?

Uma Open Web App é muito mais que uma aplicação feita com HTML. Pense em "Open Web Apps" (OWA) como aplicações construidas com base em Web Standards ou "Web Run Time" (WebRT).

Uma aplicação WebRT é executada fora de um navegador comum e pode ser iniciada a partir da área de trabalho (ou equivalente no dispositivo) eme qualquer um dos dispositivos populares conectados à internet. E é claro, os aplicativos WebRT também podem ser executados dentro de um navegador se o usuário preferir.

Embora HTML5 é uma evolução das especificações na sintaxe HTML, na prática é também uma onda de novas tecnologias avançadas.

Para uma Open Web App, você pode utilizar:

  • HTML5 como uma sintaxe declarativa para definir a estrutura da interface de usuário em sua aplicação.
  • CSS3 como uma sintaxe declarativa para definir layout, estética visual e e porções de comportamentos do UI. Usando CSS3, você pode customizar a experiência visual para qualquer dispositivo que necessite de uma apresentação específica sem ter que re-implementar a estrutura ou a lógica da programação.
  • JavaScript como uma sintaxe imperativa para implementar a lógica que será executada no client-side do dispositivo.
  • Novas tecnologias que são parte da onda HTML5 sem contar apenas as especificações para a marcação, tais como AppCache, WebStorage, WebSockets, WebWorkers, Server-Sent Events, Crypto API, etc.

Quando for apropriado, você pode completar aplicações WebRT com lógica server-side, para usar quando o usuário está conectado na internet com seu dispositivo. Embora aplicações WebRT podem funcionar conectadas ou não a internet, você pode oferecer uma experiência melhor quando estiver conectado. Você pode escolher qualquer plataforma e tecnologia server-side que você gosta, desde que a aplicação e o servidor se comuniquem através do protocolo HTTP/S usando mecanismos padrão como JSON e XML.

Portabilidade

Open Web App são chamadas de abertas por que devem funcionar em qualquer plataforma web, seja ele Firefox, Chrome, e em qualquer dispositivo, seja ele um computador desktop, laptop, telefone, qualquer coisa. Então teoricamente quando você desenvolve uma OWA ela será executada em todos os lugares. Na prática, como não são todos os fabricantes que estão apotando a web para uma direção de padronização, fazer uma OWA funcionar de uma plataforma web para outra pode exigir algum trabalho de adaptação mas isso deve diminuir a medida que o tempo passa.

Eu construí uma aplicação Web. Como posso transforma-la em um aplicativo instalável?

Na prática, há muito mais que precisa ser feito. Para mais informações, veja Desenvolvimento de app para Web developers.

Qual é a diferença entre uma app e um website?

Uma app pode:

  • Ser executada normalmente fora de um browser
  • Funcionar normalmente quer o dispositivo esteja ou não, conectado na internet
  • Pode ser iniciada da mesma maneira que uma aplicação nativa é iniciada

No mínimo, uma app é como um website que pode ser "instalado" em um dispositivo móvel ou computador para que ele se pareça com uma aplicação nativa para o usuário. Você pode distribui-la tanto em seu próprio website ou através de uma loja de aplicativos. Ambos podem ser construidos utilizando padrões abertos da Web, como HTML5. Você pode controlar o acesso a uma Web app, para que somente usuários que pagarem por ela poderem acessa-la.

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.

See also:

Should I build a website or an app?

Of course, it depends on your goals. In both cases, you can deliver your site on multiple device platforms by using the standard "Web stack" of technologies (HTML/CSS/JavaScript). However, an advantage of a Web app is that it looks like a native application to users — they can launch it from their home screen or desktop, without having to find a bookmark or remember a URL. This means they are more likely to use it and keep returning to it than a website.

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.

Comparison

Add-on:

  • 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?

The Web Run Time has access to necessary device APIs like Camera and Vibration. The Mozilla Web API project is working on expanding this list.

Hows does an Open Web App work across platforms? Form factors?

Unlike proprietary languages or runtimes, HTML, CSS and JavaScript have already been implemented on all popular modern devices where customers want to use applications.

There are, however, unavoidable differences in form factor between disparate devices. A carefully designed and well developed application can implement one set of HTML and JavaScript for an application and then form-factor specific CSS files to adapt layout and other aesthetic attributes as desired.

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?

One way to do this is to use the navigator.mozApps.getSelf() function.

A way to detect that an app is running in chromeless mode (no URL bar and so on) is to check the window.locationbar.visible property. If the app is in the Web runtime, window.locationbar.visible will be false. For example, if the following check returns true, the app is in a chromeless window:

window.locationbar && !window.locationbar.visible

Etiquetas do documento e colaboradores

 Colaboradores desta página: HenriqueSilverio
 Última atualização por: HenriqueSilverio,