1>> With the explosion of smartphones and tablets time has put web designers in front of a harder challenge. Having a different page for mobile and pc is not a good idea to live with. We have to create a responsive site that redirects mobile users to mobile site and pc users to pc site. This can be done using a simple javascript:
<script type="text/javascript">
<!--
if (screen.width<= 699) {
document.location ="YOUR-
MOBILE-SITE.com";
}
//-->
</script>
The approach using user agent looks like this:
<script type="text/javascript">
<!--
if ((navigator.userAgent
.match(/
iPhone/i)) ||
(navigator.userAgent
.match(/
iPod/i))) {
location.replace("
http://YOUR-MOBILE-SITE.com");
}
-->
</script>
The above example only detects iPhone and iPod, but a complete list of user agents that can be found on
Www.User-Agents.orgCSS METHOD: This can also be done by CSS. Just use this css code:
<link rel="stylesheet"
href="screen.css"
media="screen"/>
<link rel="stylesheet"
href="handheld.css"
media="handheld"/>
hope this helped :-)