How to Redirect Mobile Traffic to a Mobile Friendly Page

584
430

I was talking to a good marketing friend of mine and he showed me his new product page. I was on my cell phone so I decided to check it out on my iPhone. There were several problems with it, one being it was not mobile friendly. It was one big issue and lucky for him I told him the issues with his site. He then started to read up on mobile marketing and strategies then on.

We are moving into a mobile space right now, a lot of users have cell phones, a big majority have a smart phone! As marketers we need to adjust to this and make sure we can reach our traffic whether they are looking on it from a standard FireFox browser or their iPhones. For example I have a virtual card on IanFernando.Me.

It has all my information and it is the only business card I need now. When someone scans my QR code, 2 things happen – there is a check that see if it is a smartphone or not, then redirects to the proper page. Since users can go to my virtual card form their browser, I still want to make it browser friendly and attractive.

But if they are viewing it on their cell phones, I want to make sure they get access to the right information fast. I do this by creating a mobile friendly page or in the case of my virtual card – a mobile friendly service that houses my information. You can visit my virtual card on your phone and it will redirect you JumpScan, a service that holds my contact information on a mobile friendly page.

In order to do this, I use a code that checks the screen size of the browser and then redirect the user if necessary. The code below is added to the TOP page of my html page. This code will be the very first line of defense to mobile users, making sure they are sent to the right page.

<script type="text/javascript">
<!--
if (screen.width <= 699) {
document.location = "http://jumpscan.com/ianternet";
}
//-->
</script>

This small snippet of code says if the screen size is LESS than 699 in pixels, redirect to JumpScan profile. If you go to my JumpScan profile from this blog, on a standard browser you will see a standard and browser friendly page. If you viewed it on a mobile device, you will a very friendly mobile landing page with my contact information. This is why I keep it on JumpScan.

You should take advantage of both parties and redirect users base on the type of browser they are on. DO not permanently switch to mobile as a BIG majority of users will still be PC/MAC browser base traffic. You should cater to your users and make things easier for them. For example ability to watch videos, load times, smaller image file sizes, etc. There are a lot more you can do to optimize your website to cater to mobile users.

I know I personally work on my iPhone a lot and I tend to view emails and websites on my phone. It bothers me that I have to magnify the website I am looking at to see and understand what I am looking at. Making everything easier for the end user is the best way to gather leads and make sales.

Use the code above and paste it ABOVE any other code of your website and redirect it to mobile friendly services such as JumpScan or download and edit mobile friendly themes. If you are using WordPress, just use WPTouch to turn your blog into a mobile friendly theme.

In either case mobile marketing will have to be part of your marketing model.


Follow and Join Me: Facebook & Instagram

  • Is there a software that can take your old sites and make them mobile friendly.? If so could you post a link to it.

  • Is there a software that can take your old sites and make them mobile friendly.? If so could you post a link to it.

  • very informative and meaningful post thanks for sharing

  •  I know
    exactly what you mean about having to magnify the screen on a website.

    It makes a
    landing page so much more unattractive if you have an airplane view of it.

    Having a
    mobile format for your site is so important for that reason.

    The better
    the accessibility and navigation easiness, the more engaged your smart phone
    users will be.

  • Anonymous

    I dont know of any personally since most o fmy sites are wordpress or I simply purchase mobile themes – you may want to check out mobify

  • I use the WordPress Mobile Edition plugin on some of my sites.  Works pretty well.

  • Fidel1344

    Ian thanks i checked out mobify it makes easy to target diff phones….I really enjoy your blog it’s very informative and up to date, thanks

  • seo

    Mobile Optimization is one of the new term and it is getting popular, and it is very important for mobile websites owners

  • Cheree moreland

    Is there a way to redirect to Ipad?

  • Cheree moreland

    This worked great for the redirect of I phone site but I need to auto redirect to a  Ipad site. My site now is a XML/Flash site. I’ve created a .html site that views on Ipad but I don’t know how to redirect viewer without learning ridiculously complicated Plugins for dotCMS or Apache..

    Cheree

  • Anonymous

    as of right now this only works base on the screen size. not sure if you can use 2 versions of this 1 for iphone and 1 for ipad… but ipad screen is big enough for just a standard site?

  • Ephraim Edwards

    Thanks for this code.  It works perfect.

    To use it on iPads or tablets of the similar screen size just increase the screen width value in the code.

  • Thanks for the very simple code and instructions! It worked perfectly!

  • Iannjo

    Nice article, funny thing was reading it using my phone, guess would have been better if you had used the code here to.

  • when I wrote this post it was going to a mobile friendly page. I am getting a new one done for this new web design. soon to come 🙂

  • Not a bad trick. Most sites look ok on ipad anyway.

  • gareth

    Great tip!  Thanks very much.
    I’ve spent an hour looking at how to do this and got all sorts of answers which involved so many steps, and had me lost very quickly.
    Here you are with 7 lines of code, and done.

  • staunton

    This code won’t work for mobile android phones. Just for iphone’s and others like it.

  • Cas-cos

    This makes you “Hero of the Day”, thank you and good karma

  • Russellspicer

    I did this and it works great.  However, i have a link that says view full site.  when people click it… it takes them to the mobile site again. how do i fix this>

  • A very insightful and educational post, Ian. JumpScan seems to be very useful when wanting to redirect mobile traffic from your standard web page to a mobile friendly one.
    Being a non-techie guy, I am especially grateful to you for sharing this snippet of code with us.
    Thank you.

  • Thank you thank you for this post – I’ve spent hours trying to find some simple code that will do this – works like a dream 🙂