What type of client-side redirection on mobile devices is the most reliable?
This is more of a fundamental question. Lets only assume that we need to deal with iOS and Android devices at the moment (no BB or Windows) and the webpage that has the redirect is only a pass-through page (meaning that it does it's job, then has to pass the user to the next page)
I found this blog post, which talks about the pros/cons of each of them.
I feel the biggest con of the meta redirect is the fact that it makes an entry in the browser history.
The JavaScript redirect in my opinion seems less reliable, but has a better UX (no browser history entry, and the fact that you can put some logic and dynamic values in it)
Thanks!
You could do a mix of both approaches: create a javascript redirect with 300 ms or so of delay. As backup (in case javascript is disabled or just doesn't work for any reason), put on your page a meta redirect with 300 ms more than the javascript redirect.
I find that this little plugin is great for mobile detection - http://detectmobilebrowsers.com. I use the jQuery version on that page, but there are also other scripts for PHP, ASP, pure javascript etc.
So with the jQuery version you'd just do this for a redirect -
if($.browser.mobile) {
window.location = 'http://yourmobilesite.com';
}
Related
I have a website which has two versions, an all singing all dancing javascript powered application which is served when you request the root url
/
As you navigate around the lovely website the content updates, as does the url, thanks to html5 push state or good old correctly formatted #! urls. However if you don't have javascript enabled you can still use all functionality of the site as each piece of content also exists under it's own url. This is great for 3 reasons
non javascript users can still use the site
SEO - web crawlers can index the site easily
everything is shareable on social networks
The third reason is very important to me as every piece of content must be individually shareable on the site. And because each piece of content has it's own url it is easy to deep link to that url, and each piece of content can have it's own specific open graph data.
However the issue I hit is the following. You are a normal person and have javascript enabled and you are browsing and image gallery on the site and decide to share the picture of a lovely cat you have found. Using javascript the url has been updated to
/gallery/lovely-cat
You share this url and your friend clicks on it. When they click on the link the server sends you the non javascript / web crawler version of the site, and the experience is no where near as nice as the javascript version you would have been served if you directly went to the root of the site and navigated there.
Do anyone have a nice solution / alternative setup to solve this problems? I have several hacks which work, however I am not that happy with them. They include :
javascript redirect to the root of the site on every page and store a cookie / add a #! to the url so on page render the javascript router will show the correct content. ( does google punish automatic javascript redirects? )
render the no javascript page, and add some javascript which redirects the user to the root, similar to above, whenever the user clicks on a link
I don't particularly like either of these solutions, but can't think of a better solution. Rendering the entire javascript app for each page doesn't appear to be a solution to me, as you would end up with bad looking urls such as /gallery/lovely-cat/gallery/another-lovely-cat as you start navigating through the site.
My solution must support old browsers which do not implement push state
Make the "non javascript / web crawler version of the site" the same as the JavaScript version. Just build HTML on the server instead of DOM on the client.
Rendering the entire javascript app for each page doesn't appear to be a solution to me,
That is the robust approach
as you would end up with bad looking urls such as /gallery/lovely-cat/gallery/another-lovely-cat
Only if you linked (and pushStateed) to gallery/another-lovely-cat instead of /gallery/another-lovely-cat. (Note the / at the front).
Try out this plugin it might solve your 3rd reason, along with two reasons.
http://www.asual.com/jquery/address/
Here's the situation: I'm redesigning our company's public facing website using ASP.NET, VB.NET and some javascript/jquery. Some of the features I'm adding require page reloads (which register as popups) and cookies. Works great if everything is enabled. But I've noticed on some browsers (such as Firefox) I still get prompted to ok these actions, retain these cookies, etc. Now I can code some contingencies for simpler pages for users who will not or can not enable these features, but I'd like to find a way to make it as simple as possible to enable the full features. From what I've read, there's no way I can actually force it to happen the way you can force a browsers document mode by settings in the web.config file, but I am hoping there is some way to give them a button to click (or something similar) where it will enable what I need. Is there a way to do this programmatically? what I'm looking for is some code that will make the changes, instead of directing them to go into e.g. Internet Explorer security settings, which most end users find tedious if not incomprehensible.
Advice?
You can avoid using cookies. Use Session or a database backend for things you would normally use cookies for. For popups, use overlaid divs such as Ajax Control Toolkit Modal Popup Extender or jQuery UI Dialog instead of starting a new browser window.
But really, ASP.NET is designed to function with cookies. If you're users aren't using them, tell them they're penalizing themselves.
Certain browser features are ONLY user-configurable for security reasons. You cannot provide a button to change these settings because they would then not user-configurable.
All you can do is warn the user.
JavaScript cannot change a client browser's setting due to security reason. Otherwise, all hell will break loose.
Note: you can if you create an executable program, and a user runs on his/her computer.
However, you should never change a user's browser setting.
Instead you should give the warning and instruction to a user which is a proper way of doing it.
Disable Javascript
Disable Cookie
I'm sorry if this is a newbie question but I don't really know what to search for either. How do you keep content from a previous page when navigating through a web site? For example, the right side Activity/Chat bar on facebook. It doesn't appear to refresh when going to different profiles; it's not an iframe and doesn't appear to be ajax (I could be wrong).
Thanks,
I believe what you're seeing in Facebook is not actual "page loads", but clever use of AJAX or AHAH.
So ... imagine you've got a web page. It contains links. Each of those links has a "hook" -- a chunk of JavaScript that gets executed when the link gets clicked.
If your browser doesn't support JavaScript, the link works as it normally would on an old-fashioned page, and loads another page.
But if JavaScript is turned on, then instead of navigating to an HREF, the code run by the hook causes a request to be placed to a different URL that spits out just the HTML that should be used to replace a DIV that's already showing somewhere on the page.
There's still a real link in the HTML just in case JS doesn't work, so the HTML you're seeing looks as it should. Try disabling JavaScript in your browser and see how Facebook works.
Live updates like this are all over the place in Web 2.0 applications, from Facebook to Google Docs to Workflowy to Basecamp, etc. The "better" tools provide the underlying HTML links where possible so that users without JavaScript can still get full use of the applications. (This is called Progressive Enhancement or Graceful degradation, depending on your perspective.) Of course, nobody would expect Google Docs to work without JavaScript.
In the case of a chat like Facebook, you must save the entire conversation on the server side (for example in a database). Then, when the user changes the page, you can restore the state of the conversation on the server side (with PHP) or by querying your server like you do for the chat (Javascript + AJAX).
This isn't done in Javascript. It needs to be done using your back-end scripting language.
In PHP, for example, you use Sessions. The variables set by server-side scripts can be maintained on the server and tied together (between multiple requests/hits) using a cookie.
One really helpful trick is to run HTTPFox in Firefox so you can actually monitor what's happening as you browse from one page to the next. You can check out the POST/Cookies/Response tabs and watch for which web methods are being called by the AJAX-like behaviors on the page. In doing this you can generally deduce how data is flowing to and from the pages, even though you don't have access to the server side code per se.
As for the answer to your specific question, there are too many approaches to list (cookies, server side persistence such as session or database writes, a simple form POST, VIEWSTATE in .net, etc..)
You can open your last closed web-page by pressing ctrl+shift+T . Now you can save content as you like. Example: if i closed a web-page related by document sharing and now i am on travel web page. Then i press ctrl+shift+T. Now automatic my last web-page will open. This function works on Mozilla, e explorer, opera and more. Hope this answer is helpful to you.
I have a mobile site at m.site.org and the main site at site.org I am using htaccess to redirect other pages but not sure if it's useful in this case.
If people are on a mobile phone and they go to the main site I want them to be redirected to the mobile version. Once on the mobile version we have an option to go back to the full site so I don't want them stuck in a redirect loop and can't go to the main desktop version.
I can not use server-side code and would like to know if there were an option without JavaScript (doubtful).
EDIT:
The link site.org I would like redirected but NOT site.org/index.html through htaccess. Possible? Does this help?
You should check this out. It provides regular expressions you use against the user-agent that can be done client side, and it is open source.
You can download an htaccess or get JS from it. Then edit at will. The htaccess gives you a rewrite cond. JS will give you a function.
Now this won't scale if a new phone comes to the market, but it's pretty decent and you can change it as new things come. Or you can run a process that fetches and deploys the new regular expressions periodically
Without touching the server, or adding JS, it's going to be difficult.
If you can check for the HTTP_USER_AGENT header on your server, you could display a HTML redirect:
<meta http-equiv="Refresh" content="0;URL=http://m.site.org" />
I'm writing a simple photo album app using ASP.NET Ajax.
The app uses async Ajax calls to pre-load the next photo in the album, without changing the URL in the browser.
The problem is that when the user clicks the back button in the browser, the app doesn't go back to the previous photo, instead, it navigates to the home page of the application.
Is there a way to trick the browser into adding each Ajax call to the browsing history?
Update: There is now the HTML5 History API (pushState, popState) which deprecates the HTML4 hashchange functionality. History.js provides cross-browser compatibility and an optional hashchange fallback for HTML4 browsers.
The answer for this question will be more or less the same as my answers for these questions:
How to show Ajax requests in URL?
How does Gmail handle back/forward in rich JavaScript?
In summary, you'll definitely want to check out these two projects which explain the whole hashchange process and adding ajax to the mix:
jQuery History (using hashes to manage your pages state and bind to changes to update your page).
jQuery Ajaxy (ajax extension for jQuery History, to allow for complete ajax websites while being completely unobtrusive and gracefully degradable).
MSDN has an article about Managing Browser History in ASP.NET AJAX
Many websites make use of a hidden iframe to do this, simply refresh the iframe with the new URL, which adds it to the browsing history. Then all you have to do is handle how your application reacts to those 'back button' events - you'll either need to detect the state/location of the iframe, or refresh the page using that URL.
You can use simple & lightweight PathJS lib.
Usage example:
Path.map("#/page1").to(function(){
...
});
Path.map("#/page2").to(function(){
...
});
Path.root("#/mainpage");
Path.listen();
The 3.5 SP1 update has support for browser history and back button in ASP.NET ajax now.
For all solutions about the back button, none of them are "automatic". With every single one you are going to have to do some work to persist the state of the page. So no, there isn't a way to "trick" the browser, but there are some great libraries out there that help you with the back button.
Info: Ajax Navigation is a regular feature of the upcoming IE8.
If you are using Rails, then definitely try Wiselinks https://github.com/igor-alexandrov/wiselinks. It is a a Swiss Army knife for browser state management. Here are some details: http://igor-alexandrov.github.io/blog/2013/07/11/the-way-to-wiselinks-1-dot-0/.