my site is responsive, and it's looking good on Safari on iPhone. But when I browse to my website from my Twitter app on my iPhone, it seems to ignore most of my mobile styling and looks very bad. Is there something I can do to detect if the browser is some kind of mobile app (such as Twitter) and cause the page to load in the default mobile browser instead (Safari, Browser, etc.)?
Edit: I strictly used CSS' max-width media query and targeted HTML5 block elements to change widths into percents. On two navs, I changed the display attribute as necessary.
Turns out it was a caching issue. It loads fine in the Twitter app. Oddly, it didn't before, even after several tries.
To the best of my knowledge, you can't force the site to open in the default mobile browser. The decision whether to open your site in the app's UIWebView or the default Safari browser is made by the Twitter app alone. If the Twitter app was gracious enough to provides any interface for you to choose, it might be possible, but they probably don't. Most app publishers try to keep users inside the app for as long as possible, and throwing them outside to a different app usually goes against this.
Your best bet is probably to try to improve your site's responsiveness to also work inside the Twitter app UIWebView as well (or inside other apps for that matter). If you base your responsiveness on screen width for example (CSS max-width and friends), I assume it should also work inside the Twitter app UIWebView.
The problem you are describing is indeed a very serious and annoying one. UIWebViews inside apps don't implement by default all of Apple's special handlers (that work inside the original Safari). The app maker is expected to implement these manually, and 99% of all apps simply don't do this. It's true for many other apps as well, the Google native search app also opens URLs inside a UIWebView - and sites tend to look lousy there too.
You should also consider filing a bug with Twitter and urge them to improve website compatibility when opened inside their app.
You can't force the user to open the link from a browser from your website. Android WebView is restricted and by default does not allow javascript and other extensions.
You can find more information here: Android WebView VS Phone Browser
Related
We have developed a mobile application in cordova, after undergoing the application on Apple store 20 days again later, we received a communication in which Apple refuses to submit our application for the following reasons:
Reasons :
10.6: Apple and our customers place a high value on simple, refined, creative, well thought through interfaces. They take more work but are worth it. Apple sets a high bar. If your user interface is complex or less than very good, it may be rejected
----- 10.6 -----
We found the following issues with the user interface of your app:
Specifically, there were no back buttons on social media web views displayed in the app. In order to return to the main app from a community page, such as Facebook or Twitter, the app had to be closed and re-launched.
These examples identify types of issues discovered in your app but may not represent all such issues. It would be appropriate to thoroughly evaluate your app to address these types of issues.
In fact we use links to our pages on social networks, it works well on Android, because it simply click the back button to return the phone. Thing that is not obvious on an iPhone.
Is there a method to solve this? A webview? a popup with a close button ? an HTML5 iframe ?
THANK YOU !
You can use official InAppBrowser plugin (it should have a close button x), or just open these links externally in browser (safari).
In addition, IMHO, you are risking to lose your precious users by opening social links on top of your (or inside) your own app. People can get distracted and just browse away.
I have a mobile web app designed as a single place for employees of our company to help them locate various online resources. The app has a lot of in-app content, but also provides links to external partner websites. My issue is a common one with a bit of a twist. I like the way the app looks in standalone mode on an iphone, but am struggling to figure out a solution for keeping the app in stand-alone mode, while also providing the ability to open external links in safari. I know how to keep the app in standalone mode when links are clicked, but when an external link is clicked, one of two problems occurs:
1) If I code the external link to keep it in standalone mode, there is no way to navigate back to my app from the external site as the back button is obviously no longer available.
2) If I code the external link to open in safari, when the user is done with the external link, the session for my app is closed and the user has to go back to their homescreen and re-open it again. (I know I can code it so that they will return to where they were in the session, but this is not the solution I want).
My question is this, is there a way to open external links ON TOP OF a standalone web app session? So that when the external link is closed, the standalone web app session appears?
I've read that I can use AJAX to open external links within the active session, but I don't know how to do this and can't find anything online that explains it well. Any help would be MUCH appreciated.
My app functions fine in safari, but looks SO much better in standalone mode; I would be SO appreciative if anyone can provide a solution. I am also willing to discuss paying someone to help with this as well.
Cheers,
SC
Turn your app into an actual app, not just a web site. You should implement your own web browser in your app using UIWebView. It's very simple. You probably only need a back button and a close button, you don't need a full search/address bar, bookmarks, etc. UIWebView and two buttons will do it.
As soon as you switch apps to Safari you will see the behavior you have described - there's no getting around it. Your only choice is not to exit.
https://developer.apple.com/library/ios/documentation/uikit/reference/UIWebView_Class/Reference/Reference.html
I have an application built using XPages' mobile controls. On an ipHone the application behaves as I would like in the standard Safari browser. When I take the url and add it to the Home Page as an icon and use the application from there every time an action I take invokes a native application (Maps, Contacts, Phone, attachment viewers etc.) when I switch back to my application I am immediately asked for my userid and password again. Is there a way to control the behavior to not lose the login credentials the same way that the standard Safari application seems to.
This is a limitation in iOS. If you save it to the home page like that it works, but it will NOT multi-task. That's the problem. So it doesn't remember where you were or anything like that.
As David mentions it starts all over again when you switch back.... The problem is not only the credentials - it is also all the information you may have entered or where you have navigated to in the "app".
This is why I am changing to another approach. I am starting to write apps as web-apps that run locally (i.e. cache the ressources and run on the cached versions of the JS-files, CSS and images). Then I implement a localstorage where you can track where in the app you are - and return to that place again. This way you do not need the authentication for running the app - only for synchronizing the information with the server. My approach is to save data locally and sync them to the server (as a sort of replication). This obviously gives more work - but it also gives a better user experience since you can run the "app" without being connected.
I have tried to control the caching locally using a cache.manifest file. This can be done, however, it is a pain. Therefore, I am now using Sencha Touch which really does this nicely.
/John
PS. I think you may be able to handle the login issue by using the XPage Dojo login custom control (http://www.openntf.org/internal/home.nsf/project.xsp?action=openDocument&name=Xpages%20Dojo%20Login%20Custom%20Control) - however, it does not solve the issue with reloading the page...
It seems the secret to success here is NOT to tell Safari the XPage is capable of acting as a mobile web app. Add the following code inside for the XPage to ensure this is the case.
<xp:metaData
name="apple-mobile-web-app-capable"
content="no">
</xp:metaData>
Note: You can still provide an icon for the home screen, its just that icon will now act more like a bookmark with the Safari controls and (more importantly) you can switch between applications and when you return to Safari it will display your Xpages app just as you left it.
I have a client that needed to abandon their very poor native app and needs a temporary solution immediately. They have a mobile optimized website and we'd like to deploy an app in the store to replace the current one, and design it such that as soon as you launch it, it either hosts the site within a web browser control, or just redirects the user to a website in the iPhone Safari app. I realize there are subtle differences between the browser control and the actual Safari browsers.
Are there any tools or products that auto create such simple apps, and are there any problems with getting such simple apps approved by Apple?
Sounds like you want to make a hybrid app.
http://www.cocoacontrols.com/posts/a-primer-on-hybrid-apps-for-ios
Your app could just be a UIWebView that shows the website. It's possible that Apple might reject ithe app if there is nothing to it except a web view -- do some research on that possibility.
I will soon be writing a native iPhone app for my web site. The web site is already mobile optimised so could potentially just sit in a UIWebView. How does the Facebook app work? Does it do something similar?
If I did use a UIWebView then how would I store user credentials so they don't have to log in every time and how would they upload photos? These are my two main requirements.
The facebook app is going to be a native app. It is different from the mobile website.
There are two things you can do here. If you're going to make your native app just a UIWebView then don't bother! You can have an apple icon embedded in your website which will show if a user bookmarks your website on their home screen. To use this use the <link rel="apple-itouch-icon" href="/apple-touch-icon.png" /> code to do it.
The second is make a fully native app. I know the benefits of a UIWebView app, but the negatives are plain to see. UIWebView apps are tacky, nonfunctional and terrible to use. A mobile website is not an app (unless done very well). You will have links to click, pinch and zoom, awful bounce effects on the web view, links that may possibly allow users to navigate away from your mobile website but within your app. Again, unless done cleverly, you will have to provide browser controls on your app which will make it look like a tacky web browser.
My suggestion would be either stick with your website, optimise it for touch based input, make it a really good mobile website, or create a fully functional native application. Remember not all websites need to have an app to go with it. If your app isn't necessary then its merely counter productive to make an app for it. I don't know about anyone else, but I spend more time in my web browser than I do in apps.
With regards to uploading and auth then a) auth should be done already in your website. A UIWebView is just an instance of safari working within your app, so it will be able to get and store cookies and all sorts. I believe these degrade at the end of the app session, however its easy to pass to the objective c and store in an stored preference. b) uploads not going to work even if you put your site in a web view. You will have to (at some point) hand off to an upload screen in your app which is running natively.
I would suggest that you start off with a simple native app. Let the users log in, upload stuff and do other basic stuff - whatever they can't currently do on your mobile website. Then move on to other things as people ask for them, or as you have the time to make them. You don't have to launch your app with a fully functioning version of you website (in fact this would be silly because the only thing they cannot do on your mobile website on their phone is upload stuff). I'm sure people will request features as your product evolves.
I would take a look at PhoneGap, you can get access to native device features through javascript http://phonegap.com/