My mobile site does not render on certain mobile phones. Why? - mobile

I am developing a basic mobile site in asp.NET and C# and am having problems rendering .aspx pages on certain mobile phone browsers.
I tried Stackoverflow.Mobi on a nokia looking for good examples for coding mobile sites.
As soon as I redirect to another page I receive the error "File Format Unknown."
As soon as i use the button_click event to transfer to another page the "File Format Unknown." shows up on the mobile divice.
I have tried the following as suggested fixes from numerous forums but without any luck.
Setting Page contentype : ContentType="text/html"
Server.Transfer
Response.ContentType = "application/xhtml+xml";
Response.Redirect("Test.aspx");
Posting to the Full URL www.XXXX.com/test.aspx
One of the phones i am having problems with is a Nokia 6300
Any suggestions?

Normaly this is a problem with doc-type, because asp.net changes it to wap/application. I will recommend you use Fiddler for checking http headers. Normaly,Page directive ContentType should solve it
<%# Page Language="C#" ... ContentType="text/html" %>
But you have set :-S

Make sure your html passes w3c validation. I know Blackberry device will have trouble displaying pages where the Html does not validate according to the doctype.

Related

Page not mobile friendly error when testing on google mobile friendly test

I test my site url on google mobile friendly test. It showing me page is mobile friendly but some times it is showing me that page is not mobile friendly. So why it is happen. Please help me out for this. I added some codes in htaccess but not getting positive thing. Site in wordpress.
URL : https://www.example.com/test/
This could happen when the google mobile bot is not able to fetch and render the page correctly for the mobile platforms.
If you test this in your search console, you can see the errors for the static assets not getting loaded for mobile. It could happen due to a variety of reasons based on your Wordpress website configurations and plugins.
If you are not using google search console, make sure you use it to figure out the actual cause of these issues.
Check out this detailed blog for the fix relates to static content delivery - Fix Page not friendly issue

iOS11 getUserMedia with apple web-app not working

Edit: Duplicate of How to access camera on iOS11 home screen web app?
I'm running into a problem with using a apple web-app together with camera access through the getUserMedia API.
I have some application that is working fine when accessed through safari, it asks for persmission to use the camera and upon approval I can see the camera feed. But if I save this same page to the home screen as an web-app this does not work anymore. There is no prompt for camera access, which seems to be the problem as it is not enabled by default.
The line that gives the problems is a meta tag which enables full screen for a web application on iOS.
<meta name="apple-mobile-web-app-capable" content="yes">
Anyone know what is going on here and why this fails? Do I need to set camera permission somehow through a meta tag also?
Thanks in advance!
Apple has removed the ability to use getUserMedia inside a UIWebView, WKWebView, SFSafariViewController, or a webpage that has been "added to the home screen".
The reasoning is not clear, however I do not believe this to be a bug.
An Apple staff member wrote this about WebRTC in iOS 11:
...right now, WebRTC is only supported in Safari. No WKWebView, not even SFSafariViewController.
And I can confirm that this includes the UIWebView as well (through personal tesing).
The navigator.mediaDevices.getUserMedia function is back in iOS 14.3 which got out yesterday. (Make sure you are not using the navigator.getUserMedia which is deprecated).
We'll be using it in Cordova, I'll update this post if we find some instabilities.
Don't forget to use the playinline attribute in your <video> element if you don't want the video to start in fullscreen.

Google amp html validator doesn't see mobile page

I am working on a news website, trying to implement amp. We are using Mobile_Detect.php to serve desktop pages to desktop and tablets, and mobile version to mobile phones and that works OK, our pages are mobile friendly according to Google for some time now, no problem.
Now, I started to enter the code for amp pages and encountered a situation I can' resolve. URL for the amp version have .amp at the end. Depending on the user's device, we are generating the page from the database and serving different pages to different devices.
Now, PageSpeed Insights and Mobile-Friendly Test shows that the page is mobile friendly but amp validator is pulling the desktop page, I can see by the source code it prints out, instead of a mobile page. I'm on the desktop, Chrome, but I'd expect it to work with mobile pages.
You can see that here: https://validator.ampproject.org/#url=http%3A%2F%2Fwww.poandpo.com%2Fbusineasdfasdfas-usual%2Fpublic-housadfadf-kong-972016223.amp
I installed Chrome amp extension and it says "AMP available" but when I click on it it also pulls the desktop version of the page and it's blank. I would expect the extension to load the mobile page but it doesn't.
We do have links canonical and amphtml, that's why the extension says there is an amp page.
So, how to tell validator to pull the mobile version of the page? The amp implementation is not done yet and I know there are some things missing, but without a validator is a bit hard to program.
Another interesting things is that when I open "Inspect" in Chrome and toggle to responsive design, it shows the mobile version of the webpage correctly. It also says "Powered by amp" and shows no errors although there are errors because we didn't even implemented all tags.
If anybody has any suggestion how to make amp validator to show the mobile page I'd appreciate that. Thank you.
I had a quick look at your pages but it appears that the amphtml reference but there appears to be a problem in the URL you are generating in the href= field. If you take a close look, the AMP URL is missing a '/'.
Broken: http://www.poandpo.com/business-as-usualmexicans-work-longest-hours-germans-the-least-97201645.amp
Works: http://www.poandpo.com/business-as-usual/mexicans-work-longest-hours-germans-the-least-97201645.amp

single page application with angularjs and google+ button

I used this https://stackoverflow.com/a/20537386/744040 solution to define the content of the Facebook sharing window.
I can't find a similar solution for Google +.
I am working on this website http://sportnews.codeskeleton.com/ and if you go to an article page and try to G+, it'll take a wrong image as thumbnail and for the title it takes the AngularJS code : Sportnew7-24 - <% Page.title() %> (I use <% instead of {{ to avoid collision with blade ).
I tried the solution with schema.org but the google popin seems to ignore them.
Thank you
Google+ share details are populated by Google making an HTTP request to the specified URL and parsing the HTML. Since you are making a SPA site Google is just parsing the default template details without executing your JavaScript. If you want Google+ sharing details to work you will have to render the HTML with the title/image in it.
Google does have a method for telling crawlers about AJAX pages and how to crawl them but I can't speak to if the Google+ bot supports the standard.

Silverlight app disappears on page refresh in IE10

UPDATE: There is a workaround to the problem. It is to force IE10 into compatibility mode by including one of the following meta tags:
<meta http-equiv="x-ua-compatible" content="IE=7" />
<meta http-equiv="x-ua-compatible" content="IE=8" />
This is not really a perfect solution for various reasons, but it eliminates the problem at least.
ORIGINAL QUESTION:
I realised a couple of months ago that there is a problem with our Silverlight application in IE10 on Windows 8 (I have not tried the IE10 preview for Windows 7). When the asp.net page hosting our SL app first loads everything works fine and the application loads as expected. If I refresh the page immediately, it also reloads as expected. But: If I focus the Silverlight application by clicking in it and THEN hit F5, it just goes blank. It is like the plugin disappears completely. If I trace the requests using Fiddler I can see that no request is issued for the xap file. I have been hoping that this would be fixed in a patch release for IE10, but so far nothing has changed. I cannot find any information about this when I try googling it. It seems highly unlikely that I should be the first person to discovered it and I am quite surprised that I am not finding more information. To reproduce the issue:
Create a new Silverlight application
Add some sort of content to MainPage.xaml, like a Button or whatever
Run the app in IE10 (on Win8)
Click anywhere within the Silverlight application. This is just to focus the plugin.
Refresh the page (F5)
Result: The Silverlight application does not load and the page is blank.
A few observations:
After the steps above, no amount of refreshing will bring the application back.
After the steps above, if I re-enter the url into the address bar and hit Enter, the application loads as expected.
If I enable Compatibility View in IE, the app also loads as expected. Nothing I do will reproduce the bug when compatibility view is enabled.
Now to my questions:
Has anyone else observed this behaviour?
If so, have you found a workaround?
I'm seeing the same issue with my Silverlight application in IE 10.
I've tried adding the IE 8 compatibility meta tag suggested above, but this does not resolve the problem consistently. It seems to work only intermittently, after say every 5th refresh attempt?!
The only way I can see to work around this consistently is to force the Browser Mode into "IE 10 Compatibility View", and I don't think this can be done via page content (meta tag, etc.)? I've had to remove the IE 8 compatibility meta tag so that the "Compatibility View" button is available in the address bar, and then ask users to click the compatibility button, which is then remembered for the site. This results in the browser entering Browser Mode: "IE 10 Compat View" and Document Mode: "IE7 Standards". The refresh behaviour then works consistently as expected and as it used to.
This is a big problem for us. We've built our Silverlight app such that the browser refresh button is used to refresh pages/content within the app (the users stays logged in, etc.). It's really bad that we have to ask users to set our site to run in compatibility mode for the refresh functionality to work as expected.
Note that this still works as expected in Chrome. It seems silly that we might need to recommend that our users use Chrome because of this issue!
UPDATE:
A workaround for this seems to be to always load the Silverlight object into its hosting page dynamically using JavaScript.
E.g.
function onLoad() {
var silverlightControlHost = document.getElementById("silverlightControlHost");
silverlightControlHost.innerHTML = "<object ...
UPDATE 2:
Here is the latest code I use to work around this issue:
...
function unloadSilverlight() {
document.getElementById("silverlightControlHost").innerHTML = "";
}
function focusOnSilverlight() {
document.getElementById("silverlightObject").focus();
}
function onLoad() {
window.onbeforeunload = unloadSilverlight;
setTimeout(focusOnSilverlight);
}
</script>
</head>
<body onload=" onLoad() ">
...
I still had issues with the solution presented by Chris.
This works perfectly for me though:
window.onbeforeunload = function () {
var silverlightControlHost = document.getElementById("silverlightControlHost");
silverlightControlHost.innerHTML = "";
}
I solved the problem in a very easy way. I Wrote a javascript code at the end of the page (or after the object tag in where is your silverlight app) and set the focus to another element, for example, a link. Example:
<object id="silverlightHostControl">...bla bla bla</object>
<script type="text/javascript" language="javascript">
var shc = document.getElementById("silverlightHostControl");
document.getElementById("myLink").focus();
</script>
The shc var is useless, I put just for clarify. Remember: your javascript code must set the focus to another (but focusable) object AFTER the silverlight app object tag was parsed, which means your js code is writen after silverlight app object.
In answer to your question #1, this is happening with our Silverlight apps as well. The only workarounds are 1) restart the browser or 2) switch to compatibiity mode.
It apparently is a bug in ie10.
Thanks for all workarounds solution but this is obviously a bug with Silverlight plugin.
We have raised few tickets directly with Internet explorer development team and they said the issue is from an external problem. It is not a good answer from Microsoft.
Anyway, this time our developers raised ticket through Silverlight development team which still waiting for their response. To get a good response from them, we need to get more people who are facing this issue.
You can vote this issue from Connect website which is Microsoft's official bug reporting platform.
The link to our ticket is: http://connect.microsoft.com/VisualStudio/feedback/details/789004/ie10-shows-blank-page-upon-refreshing-silverlight-app
Cheers
Moh
Yeah i am also facing same issue with one my application. If i opens help of my application in IE 10 then i have to refresh the page each time to view the contents.
I have two workaround for this issue:
1. Press ALT key once
2. Open IE in compatible mode

Resources