or Connect
AppleInsider › Forums › Mobile › iPhone › Latest iPhone Software supports full-screen Web apps
New Posts  All Forums:Forum Nav:

Latest iPhone Software supports full-screen Web apps

post #1 of 39
Thread Starter 
One unpublicized feature introduced by Apple's latest iPhone software updates is the ability to save Web apps to the home screen and have them launch in full-screen mode without the Safari wrapper, essentially mimicking the experience of a native app.

Clancy, an AppleInsider reader who brought the matter to our attention, believes the undocumented feature arrived as part of the most recent iPhone Software 2.1 update. He notes that the capability is only present in Web applications specifically authored to include the full-screen code.

To illustrate the feature, he's created a demo application for iPhone users to try out. In order to trigger the full-screen mode, follow these steps:
Load the demo app in Safari on your iPhoneHit the "+" button at the base of the Safari appSelect "Add to Home Screen"Save the App to the Home ScreenTap the icon that was just saved to your Home ScreenThe demo App should load in full screen without the Safari wrapper.
Once the app is loaded in full-screen, it behaves just like a native app acquired from the App Store, though it may perform slightly slower as all the resources and interface elements are being downloaded in real-time over the Internet.

You can even pull the interface down (screenshot, below) like a native app without the Safari interface coming into play.

Saving a Web app to the Home Screen

Steps to prep a Web app to launch as a full-screen app.

Launching a Web app in full-screen mode

Steps to prep a Web app to launch as a full-screen app.
post #2 of 39
Nice. Sometimes web-apps are simply more stable and makes more sense than the native apps. All native iPhone apps I've tried so far have crash bugs. The Safari doesn't crash as often.
post #3 of 39
Quote:
Originally Posted by palegolas View Post

Nice. Sometimes web-apps are simply more stable and makes more sense than the native apps. All native iPhone apps I've tried so far have crash bugs. The Safari doesn't crash as often.

If you have any apps left over from the 2.0.1 or 2.0.2 days, sometimes its best to delete them and do a fresh install. That has solved a great deal of my crashing problems.
post #4 of 39
Anyone think there is still a chance they would let you have offline web apps? This would be a good way to make use of those.
post #5 of 39
Quote:
Originally Posted by mxpx5678 View Post

Anyone think there is still a chance they would let you have offline web apps? This would be a good way to make use of those.

Kiwi, a Wikipedia app, allows you to store content for offline viewing.
post #6 of 39
This is a cool feature.

Can anyone share the code that allows the pages to act like the demo.
post #7 of 39
Why isn't Apple's own Web Apps page for the iPhone not formatted for the iPhone.
Dick Applebaum on whether the iPad is a personal computer: "BTW, I am posting this from my iPad pc while sitting on the throne... personal enough for you?"
Reply
Dick Applebaum on whether the iPad is a personal computer: "BTW, I am posting this from my iPad pc while sitting on the throne... personal enough for you?"
Reply
post #8 of 39
Gmail Chat and Meebo work pretty well this way, going so far as to have very nice icons for the homescreen.
post #9 of 39
This was in 2.0 and was dadvertised in the SDK intro videos - there was one about new features for web app developers which had stuff about css3 features etc, plus this stuff. It annoys me that no web developers seem to have found it...
post #10 of 39
Quote:
Originally Posted by jfischetti View Post

This is a cool feature.

Can anyone share the code that allows the pages to act like the demo.

I think this is the relevant code...
<meta name="apple-mobile-web-app-capable" content="yes" />
post #11 of 39
Quote:
Originally Posted by rdepom View Post

This was in 2.0 and was dadvertised in the SDK intro videos - there was one about new features for web app developers which had stuff about css3 features etc, plus this stuff. It annoys me that no web developers seem to have found it...

That's because AppStore GoldRush Fever hasn't subsided yet.
In a few months the novelty will wear off and developers will go back to choosing the best tool for the job.
In many cases that is a web app.
I'm glad to see this as it gives more parity between native and web apps on the iPlatform.
post #12 of 39
I was saving web pages to the iPod Touch home screen before 2.0, and if the web page happened to be the size of an "app" it looked an awful lot like this. I'm not clear what's new here... maybe just that when you do it, Safari gets more out of your way now?
post #13 of 39
Wha- no whines for cut 'n paste?
post #14 of 39
Quote:
Originally Posted by teckstud View Post

Wha- no whines for cut 'n paste?

Where's my cut and paste????

(Happy now?)

Journalism is publishing what someone doesn't want us to know; the rest is propaganda.
-Horacio Verbitsky (el perro), journalist (b. 1942)
Reply
Journalism is publishing what someone doesn't want us to know; the rest is propaganda.
-Horacio Verbitsky (el perro), journalist (b. 1942)
Reply
post #15 of 39
Quote:
Originally Posted by Booga View Post

I was saving web pages to the iPod Touch home screen before 2.0, and if the web page happened to be the size of an "app" it looked an awful lot like this. I'm not clear what's new here... maybe just that when you do it, Safari gets more out of your way now?

Before it would just save a link to the web page as an icon on the home screen. When clicked, it would load up the link in Safari.

This new implementation doesn't use Safari, but creates a simple self-contained application that uses a WebKit view to display the web page. This means of course, there's no Safari browser interface, such as the address bar, search field, bookmarks, etc.

Safari 4 will have the same feature, "Save as Web Application..."
Disclaimer: The things I say are merely my own personal opinion and may or may not be based on facts. At certain points in any discussion, sarcasm may ensue.
Reply
Disclaimer: The things I say are merely my own personal opinion and may or may not be based on facts. At certain points in any discussion, sarcasm may ensue.
Reply
post #16 of 39
Quote:
Originally Posted by Johnny Mozzarella View Post

That's because AppStore GoldRush Fever hasn't subsided yet.
In a few months the novelty will wear off and developers will go back to choosing the best tool for the job.
In many cases that is a web app.
I'm glad to see this as it gives more parity between native and web apps on the iPlatform.

Indeed.

At the risk of incurring the fearful wrath of the sacred developers, who are of course ALWAYS RIGHT ... *looks around fearfully* ...

A lot of apps in the app store would be better as Web apps, most notably almost all the apps that were rejected by Apple for inclusion. The Gmail app switcher, or pretty much any new interface for Gmail, as well as Podcaster would totally work better as web apps and Apple would not be able to reject them.
In Windows, a window can be a document, it can be an application, or it can be a window that contains other documents or applications. Theres just no consistency. Its just a big grab bag of monkey...
Reply
In Windows, a window can be a document, it can be an application, or it can be a window that contains other documents or applications. Theres just no consistency. Its just a big grab bag of monkey...
Reply
post #17 of 39
I started fooling around with some iPhone web code after reading this article and discovered an interesting however completely unrelated item. The navigator.vendor property for the iPhone version of Safari reads Apple Computer, Inc. You'd think they would change that to just Apple since they dropped the Computer from their legal name.

Life is too short to drink bad coffee.

Reply

Life is too short to drink bad coffee.

Reply
post #18 of 39
Has anyone found any more examples of sites using this code?
post #19 of 39
For those of you with jailbroken phones, you can make any webclip do this by editing the plist file for the webclip, found in /private/var/mobile/Library/WebClips/ to include

\t<key>FullScreen</key>
\t<true/>


and then respringing your phone.
post #20 of 39
The webapp.net Demo app looked pretty good...until I tried it in Internet Explorer 7.
Unfortunately webapp.net's CSS does not degrade nicely for IE7.

I'll be sticking with iUI.
post #21 of 39
Quote:
Originally Posted by Johnny Mozzarella View Post

I think this is the relevant code...
<meta name="apple-mobile-web-app-capable" content="yes" />

I just inserted that <meta> into the HAIF CW39 Houston Weather forecast web app and it works really well! Thanks for that.
post #22 of 39
Isnt possible to publish, for downloading, in one zip file the whole source code ?

Best Regards,
Dominique.
post #23 of 39
Quote:
Originally Posted by dominik67 View Post

Isnt possible to publish, for downloading, in one zip file the whole source code ?

Best Regards,
Dominique.

The webapp.net Demo app and all source are available on their site.

However, as I mentioned above, this is only a good solution if it is only intended for use on Safari and Firefox.
It is not compatible with Internet Explorer.

Another solution that is compatible with Interent Explorer and probably a bit more polished is iUI.
post #24 of 39
Quote:
Originally Posted by Reaperducer View Post

I just inserted that <meta> into the HAIF CW39 Houston Weather forecast web app and it works really well! Thanks for that.

Same problem I have, though. If you click any link, it takes you out of there and drops you into a Safari page. Quite annoying.

Any way around that?
post #25 of 39
Quote:
Originally Posted by fabsgwu View Post

If you have any apps left over from the 2.0.1 or 2.0.2 days, sometimes its best to delete them and do a fresh install. That has solved a great deal of my crashing problems.

Thanks for the tip. I've only got new fresh apps though, and not many of them. (Two pages) There's about one crash a day (or more if I use the apps more). So I guess it's just like any computer platform with developers just getting started. They release buggy software, and optimize them over time.
post #26 of 39
Quote:
Originally Posted by Johnny Mozzarella View Post

That's because AppStore GoldRush Fever hasn't subsided yet.
In a few months the novelty will wear off and developers will go back to choosing the best tool for the job.
In many cases that is a web app.
I'm glad to see this as it gives more parity between native and web apps on the iPlatform.

Web apps already had 12 months of head start. What more could you reasonably want?

Web apps are fine in many circumstances, especially if it needs up-to-the-minute data from the internet anyway. But I would prefer a local app with local data for other circumstances, it's no fun to try to access a web app when the internet signal is weak or nonexistent, doubly so if the data is largely static.
post #27 of 39
Quote:
Originally Posted by pikey View Post

For those of you with jailbroken phones, you can make any webclip do this by editing the plist file for the webclip, found in /private/var/mobile/Library/WebClips/ to include

\t<key>FullScreen</key>
\t<true/>


and then respringing your phone.

Every way I try to do this causes the webapp to no longer work. The icon turns to black and doesn't launch.

I've tried vi on the phone itself, I've tried copying the file to my Mac and editing it there and moving it back.

When I used vi, i got a message that said "DB_CREATE must be specified to create databases."

Is there a trick to editing this plist that I'm missing?
post #28 of 39
Anyone know how to make an offline web app? Would only setting the http "cache-control" header to "public" work?
post #29 of 39
Hello to all the new people.
post #30 of 39
Nothing undocumented here. See
https://developer.apple.com/webapps/...002051-CH3-SW2

I thought this was common knowledge? It's even possible to change the status bar style (black translucent for example)
post #31 of 39
This is a nice idea, but unfortunately running webapps in this fullscreen mode seems to disable orientation events ... so you can't have a landscape version aswell as portrait
post #32 of 39
Quote:
Originally Posted by mickmel View Post

Same problem I have, though. If you click any link, it takes you out of there and drops you into a Safari page. Quite annoying.

Any way around that?

That is because Apple wants people to develop Ajax Webapps or some sort of self sufficient app. I don't think there is an immediate way to avoid this.
post #33 of 39
Quote:
Originally Posted by mxpx5678 View Post

Anyone think there is still a chance they would let you have offline web apps? This would be a good way to make use of those.

Yes I'd read some info that Apple told developers this would be coming with Safari 4. It was likely under NDA so no one is widely talking about it.
post #34 of 39
Quote:
Originally Posted by solipsism View Post

Why isn't Apple's own Web Apps page for the iPhone not formatted for the iPhone.

I agree. Apple should have a web app store designed like the native app store. The current site is difficult to navigate on the iPhone.
post #35 of 39
Quote:
Originally Posted by JeffDM View Post

Web apps already had 12 months of head start. What more could you reasonably want?

I can see the point that all of the hype has shifted to native apps. I agree several of those native apps would work fine as web apps. Because many of them are just a front end UI that connect to a database.

Quote:
Web apps are fine in many circumstances, especially if it needs up-to-the-minute data from the internet anyway. But I would prefer a local app with local data for other circumstances, it's no fun to try to access a web app when the internet signal is weak or nonexistent, doubly so if the data is largely static.

From what I've read offline web apps will be a reality when webkit fully utilizes HTML 5 in Safari 4.
post #36 of 39
Quote:
Originally Posted by Lafe View Post

Where's my cut and paste????

(Happy now?)


Nobody needs cut and paste.

Nobody needs third party iPhone applications.

There will be no iPhone SDK.

Web apps are really, really SWEET.

Apple will not enter the cell phone market.

Balance in the universe restored.
post #37 of 39
post #38 of 39
Quote:
Originally Posted by leorou View Post

That is because Apple wants people to develop Ajax Webapps or some sort of self sufficient app. I don't think there is an immediate way to avoid this.

I'm trying to keep my mobile sites as platform-independent as possible. I like them to work well on iPhone, but also work for Blackberry, Nokia N95, WinMo, etc. It seems like making them with more ajax will kill that compatibility.

I want the best of both worlds, please.
post #39 of 39
Quote:
Originally Posted by mjtomlin View Post

This new implementation doesn't use Safari, but creates a simple self-contained application that uses a WebKit view to display the web page. This means of course, there's no Safari browser interface, such as the address bar, search field, bookmarks, etc.

Self-contained application? No, that would be more like a MS .hta web app, which can actually access local files, etc.

Seems more like this meta-tag simply turns off the Safari browser chrome.

?
New Posts  All Forums:Forum Nav:
  Return Home
  Back to Forum: iPhone
AppleInsider › Forums › Mobile › iPhone › Latest iPhone Software supports full-screen Web apps