Emerson1
Joined: 02 Mar 2013 Posts: 10
|
Posted: Sat Mar 02, 2013 7:22 pm Post subject: Redirect Your Website To A Mobile Version |
|
|
With the growing number of web visitors using mobile devices, many sites are offering a mobile version with cut-down content. If you have built a mobile version and want an easy way to redirect your visitors, follow these simple steps.
Redirect or Restyle?
The aim of this post is to provide an easy solution to redirecting your visitors to a mobile version of your website. However, you may prefer to use media queries to style your site content to suit a range of devices.
Build Your Mobile Site
There are only a few steps to this process and the first one is of course, to build your mobile site! There are many ways of doing this and many thoughts about whether to put all the content into a single page, or to build an entire set of mirror pages. If you are going to build a full set of mobile pages, don’t just duplicate the entire content of your main site – this will look like you are trying to trick the search engines into thinking you have twice as much content for them to read, index and offer-up to the search engine results!
Bear in mind when you build your mobile site that
navigation should be simple
content is best kept brief and pages should scroll up and down only
images need to load ultra-quickly
contact details are clear and easy to find
clickable elements are big enough to click on!
Redirect Your Main Website To The Mobile Version
However you choose to build your mobile site, put it in a folder, or on a sub-domain called ‘mobile’. Make sure you have an index.html file in this location, and in this mobile index.html file you need to add a link back to the main website.
For the link text use something like “View Full Site” and for the url, type your full website address (ie. http://www.yourwebsiteaddress.com) and then put ?skipmobile=1 at the end ( ie. http://www.yourwebsiteaddress.com?skipmobile=1 ). The code for this will be:
<a href=”http://www.yourwebsiteaddress.com?skipmobile=1?>View Full Site</a>
In the main website, you need to add a script to the <head> of the index.html page.
<script>
if (document.location.search.indexOf(“skipmobile”) >= 0) {
document.cookie = “skipmobile=1?;
}
else if ((document.location.hostname.match(/\.mobi$/) || screen.width < 699)
&& document.cookie.indexOf(“skipmobile”) == -1)
{
document.location = “mobile/”;
}
</script>
Make sure the document.location matches the location of your mobile site. If you have put your files into a folder called “mobile-site”, the line should read document.location = “mobile-site/”; or whatever you have chosen.
The code sets a cookie that stores the “skipmobile” part of your web address. If you forget to add ?skipmobile=1 to your main/full website URL, your visitors will not be able to access your main site. _________________ car loans for bad credit |
|