CODEWITHSUNDEEP
.htaccessurlhttp-redirectmobile
Dave
Dave

Reputation: 13

Use separate URL's for desktop and mobile pages

Google identified my site as 'non-mobile friendly'.

Some time ago I redesigned several pages on my website to make sure they displayed properly on mobile devices. Up until recently it was necessary for the user to manually select which version to use. I realise this was not satisfactory as it resulted in Google not understanding the relationship between these pages, hence they were viewed as "Not mobile-friendly"

I have been trying to resolve this and have read and followed Google's instructions that describes using separate URL's for desktop and mobile pages, by inserting the following tags in the head of the page:

link rel="alternate" tag on the desktop version and a
link rel="canonical" tag on the mobile version

This is the complete method I followed:

  1. Set up a sub domain for the mobile site: www.m.identitydesign.co.nz

  2. Use the code from here for the .htaccess file: http://webdesignandsuch.com/redirect-to-a-mobile-site-with-htaccess-and-set-a-cookie-to-break-redirect/

At this point I seemed to have it mostly right as the redirect was working, but there was still a persistent 'looping redirect' when viewed on mobile, causing the page to not display at all due to excessive redirects.

  1. To fix this and stop it looping I created another .htaccess file for the subdomain with the following code:

    RewriteEngine off RewriteBase /

  2. This worked fine but then presented a new problem (which is still a redirect problem). If a user wanted to override the auto redirect to the mobile site they should be able to click a manual link back to the main site. But it was automatically looping back to the mobile site preventing access to the main site if they wished to see it.

To fix this I inserted the code ?m=0 directly after the href link on the mobile site like so:

<a href=“http://www.example.com?m=0”>

this broke the redirect causing it to stop looping.

At this point I thought it was all working pretty good, but I realise there is still a problem.

Perhaps because Google hasn't indexed the pages yet, it is still showing up as "not mobile-friendly" in Google's SERP's. However, when I go to Google's Mobile-friendly test page and analyse the page, it tells me it's "Awesome!"

That's good, but when I tried analysing other pages (besides the home page)e.g. http://www.identitydesign.co.nz/artists_impressions.html which should load this page:
www.m.identitydesign.co.nz/artists_impressions.html

it keeps loading the INDEX page instead.

This is the CRUX of the problem:
When analysing the desktop page I get a positive result, however it redirects to the index page and does not direct to the correct corresponding mobile page.

The result of this is, when I do a Google search e.g. "artist impressions auckland" my page comes up in the SERP. If I'm searching on a desktop the link goes to the correct page. But if I'm doing the same search on a mobile device the link takes me to the INDEX page not the correct corresponding page for "artists impressions".

I searched the StackOverflow site for a similar problem but could not see one with the same specific problem. The closest matching threads involve the use of PHP, which doesn't apply in my case.

I appreciate any help or assistance. Thank you.

Upvotes: 1

Views: 1632

Answers (1)

Mhowell
Mhowell

Reputation: 139

The idea of using sub domains for mobile and desktop versions of the same site is a little antiquated in my opinion.

Have you looked at using responsive web design? It focuses around the idea of using scalable content that will adapt to the size of the screen on the device being used. It would mean having to maintain only a single set of pages rather than separate ones for both versions of the website. This would eliminate your problem and make it easier to maintain in the future. It's now easier than ever to build responsive sites with the myriad amounts of HTML and CSS frameworks out there e.g. http://getbootstrap.com/ and http://foundation.zurb.com/

That being said, if you wish to stick to your current approach I would suggest that there is something wrong with the .htaccess file. You might want to rewrite the list of user agent strings that are matched as it looks quite out of date.

The line that performs the redirect in your example points at a fixed URL:

RewriteRule ^ http://m.example.com [R,L]

Change this to copy over the path component:

RewriteRule ^ http://m.example.com%{REQUEST_URI} [R,L]

Upvotes: 0

Related Questions