Beyond optimizing your site for mobile devices

Optimizing your website for mobile devices is a great start to improving user retention on mobile devices, but are you forcing users into a mobile experience that they weren't expecting?

Sure, it's common practice, generally in the website footer, to allow a user to switch back to the desktop version of a site, but a frequent user of your site will quickly become annoyed at the need to choose the desktop version each time they load your site on a mobile device, if that is their preference.

By combining 3 scopes, request, session and cookies, you can create a robust solution for detecting the presence of a mobile browser and storing a user's preference. To break this process down into steps, which could be performed in a conditional if/then/else statement:

1. Request. Check the query string for the presence of a preference variable, which indicates that the user wishes to switch to either the mobile or desktop version of the site. This is traditionally done with a link in the footer of a site, i.e.

   <a href="?browser=mobile">Mobile</a>
<a href="?browser=desktop">Desktop</a>

   If this variable is present in the query string, store the preference in the session and cookie scopes.
    

2. Check the session scope for the presence of the preference variable.
3. Check the cookie scope for the presence of the preference variable.
4. Perform a user agent detection to determine if the user is on a mobile device.
5. If all else fails, assume the user is viewing the site in a desktop browser.

For many of us, seeing a code example is more helpful in illustrating a process, so here's a quick PHP example:

if (isset($_REQUEST['browser'])) {
    if ($_REQUEST['browser'] == 'desktop' || $_REQUEST['browser'] == 'mobile') {
        $browser = $_REQUEST['browser'];
        $_SESSION['browser'] = $_REQUEST['browser'];
        $_COOKIE['browser'] = $_REQUEST['browser'];
    }
}
elseif (isset($_SESSION['browser']))
    $browser = $_SESSION['browser'];
elseif (isset($_COOKIE['browser']))
    $browser = $_COOKIE['browser'];
elseif ( // mobile detection logic goes here)
{
    $browser = 'mobile';
    $_SESSION['browser'] = 'mobile';
}
else
    $browser = 'desktop';


You can now safely assume that the $browser variable will contain the users most desired preference between the desktop and mobile version of your site.

As a bonus, here's a useful PHP script that will determine the presence of a mobile browser.