View Desktop Site

Russinating · 26 Jun 2013 at 10:21

I've finished making a small mobile version for our site but I'm just having trouble with the final step of creating a 'View Desktop Site' button. I think it's a jQuery mobile issue but I'm not sure.

The site is www.idoweddingfilms.co.uk. If you visit on your mobile it should automatically redirect you to /mobile, and then the current link is at the bottom.

The code I have is:

PHP:

session_start();

if (isset($_GET['v']) && $_GET['v'] == 'desktop') {
    $_SESSION['v'] == 'desktop';
}

if (!isset($_SESSION['v']) || (isset($_SESSION['v']) && $_SESSION['v'] != 'desktop')) {

$useragent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match('/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4))){
header('Location: http://www.idoweddingfilms.co.uk/mobile');
} 

}

Any ideas? When you click the link it sort of half-heartedly loads the new page - the URL changes but the page remains the same bar a few css changes (bigger logo and no background). Almost like it's keeping the mobile page's content but using the non-mobile's css on top or something :s.

Russinating · 26 Jun 2013 at 10:31

Fixed it now! All I needed to do was add rel="external" to the mobile site's link to force a refresh of the whole page rather than trying to load the content via Ajax.

zyfar · 26 Jun 2013 at 13:27

How come you went with a completely different mobile version instead of using media queries? Was the content different on the mobile site?

RoyMi6 · 26 Jun 2013 at 14:45

As above, your site is perfectly functional even without any responsive design on my iPhone. Works fantastic in fact, all the videos etc as well as the fact that good coding practices means zooming in and out to read text (which I can actually read zoomed out anyway) works perfectly.

Why offer up the crippled version and make them have to click on "desktop site" to get the full version? You had any real requirement from any of your users?

The one thing I'd maybe do is when being viewed on a mobile is find a neat way to push the contact information to the top but even that's only one click away...

uniQ · 26 Jun 2013 at 15:29

^ This. 'Nobody' wants to be redirected to a crippled less functional mobile site.

BaJ · 26 Jun 2013 at 16:10

I agree with the comments above ... however a more reliable mobile detection script such as this would be ideal to modify what you have already.

Tripnologist · 26 Jun 2013 at 22:46

I have to agree with the sentiments above.
There aren't many cases where a dedicated mobile site is ideal over RWD.

simisker · 27 Jun 2013 at 08:07

Hurray! I [kinda] disagree with the repliers [even Trip :eek:

]!

1. RWD is powerful and lovely, but there are cases where different markup is required. E-commerce is probably the best example, where placement of every element is crucial to maximising sales. Content choreography can only go so far.

2. Don't fall into the trap of received wisdom.
Example A: "'Nobody' wants to be redirected to a crippled less functional mobile site." Ray Winstone and many online betting sites disagwee wiv' ya.
Example B: http://forums.overclockers.co.uk/showpost.php?p=24516829&postcount=3

3. "zooming in and out to read text [...] works perfectly" - Why force users to use both hands when you can optimise and cater for one-handed [thumb] use? Agreed, this *may* be perfectly solvable by media queries, but maybe not.

4. Having checked out Russ' site on both small and large screen devices, I appreciate the mobile version and its efforts to cater for one-handed browsing [no sniggering at the back]. I didn't see any need to consider looking for/clicking on a 'desktop site' link, as at no time did I feel I was having a 'crippled' experience. Good job, Russ

5. I suspect this "don't give less on mobile" is an argument of principle about denying users content. This isn't the same argument as "give users what they need to fulfil their expectations however they're browsing", which is a more important goal. If that means developing two [or more!] sites in order to reach that goal, then so be it.

RoyMi6 · 27 Jun 2013 at 09:48

Russinating said:
Any ideas? When you click the link it sort of half-heartedly loads the new page - the URL changes but the page remains the same bar a few css changes (bigger logo and no background). Almost like it's keeping the mobile page's content but using the non-mobile's css on top or something :s.

Actually addressing your issue I don't have any problems with switching side of things. Works fine. Even switching back to the mobile site via the link at the bottom of the main site.

simisker said:
Hurray! I [kinda] disagree with the repliers [even Trip ]!

1. RWD is powerful and lovely, but there are cases where different markup is required. E-commerce is probably the best example, where placement of every element is crucial to maximising sales. Content choreography can only go so far.

Have to agree actually - I never said RWD wasn't a good idea. In this case though instead of a fully responsive design as some might see it I did suggest promoting information that you might find is more useful to mobile visitors - like contact information. A look at your analytics might shed more light on what your mobile visitors are finding useful but remember that's based how you site currently works. I'd probably just use this approach as an interim solution to developing something fully responsive though.

simisker said:
2. Don't fall into the trap of perceived wisdom.
Example A: "'Nobody' wants to be redirected to a crippled less functional mobile site." Ray Winstone and many online betting sites disagwee wiv' ya.

Pot, kettle, black?

Seriously though, I see where you're coming from. However, I think as developers we need to spend time understanding requirements rather than interpreting them literally.

Comments such as "on my mobile I want it to load fast so get rid of all the large images" is easy to be taken literally by just removing all the nice high resolution images. Consider though that what might be worth looking at is delivering responsive images that are mobile friendly - http://css-tricks.com/which-responsive-images-solution-should-you-use/

simisker said:
3. "zooming in and out to read text [...] works perfectly" - Why force users to use both hands when you can optimise and cater for one-handed [thumb] use? Agreed, this *may* be perfectly solvable by media queries, but maybe not.

That's what double tapping is for

simisker said:
4. Having checked out Russ' site on both small and large screen devices, I appreciate the mobile version and its efforts to cater for one-handed browsing [no sniggering at the back]. I didn't see any need to consider looking for/clicking on a 'desktop site' link, as at no time did I feel I was having a 'crippled' experience. Good job, Russ

I realise it's just another couple of pages to add but I personally found the complete lack of "package" information a surprise and by virtue of the fact that the "sample" videos are so good I think this is a bit of an oversight that they are also missing.

simisker said:
5. I suspect this "don't give less on mobile" is an argument of principle about denying users content. This isn't the same argument as "give users what they need to fulfil their expectations however they're browsing", which is a more important goal. If that means developing two [or more!] sites in order to reach that goal, then so be it.

I'm not arguing about principle I'm arguing about how I personally use content. As someone that's thinking about marriage I'd also consider myself a potential client. As a "power user" I'll often show videos to friends and family via my phone via airplay. I'll also regular visit websites on one of my many computers and then resuming viewing on my mobile as I travel or when I slouch in front of the tele - I expect to have the experience transferable and not disjoint.

You could argue that as a power user I should be less catered for as you can expect me to find my way around but I'd just say we should work together to come up with a better solution

EDIT: That turned out longer than I thought! Also, nothing personal simisker! You've got a lot of valid points

simisker · 27 Jun 2013 at 10:21

Nothing personal taken, Roy, and you make valid counterpoints

Russinating · 28 Jun 2013 at 20:41

Interesting thoughts folks. Worth posting this thread even if I fixed the problem before a reply it seems.

I was under the impression that having a mobile site was always a good thing, but perhaps that's just web designer schpiel to get clients to pay for more work.

The reason for me doing it was because our site is quite content-heavy and I wanted a slimmed down version. That was the reason for having a completely separate site rather than a css modification.

I do however completely agree re: browsing full sites on mobiles. I much prefer this and if I personally ever get redirected to a mobile site I always force the desktop view via Chrome. Coding (and mobile browsers) have come a long way even in the past year, especially when video content is delivered via Vimeo or YouTube.

There's also the fact that wedding videography is still, unfortunately, a very amateur business. I'd like to think that we're at the top not just in regards to our film work but also our professionalism and customer service as a business, and I think a lot of people would see us having a mobile version as a plus point towards our brand/something else that makes us stand out.