Hi folks
how to make website that should compatibility with desktop browser as well as mobile browser
Thanks in advance
Aswan
+1
A:
I'm going to assume you mean compatible. and If I knew a little more about what your trying to achieve I may be able to be a bit more help.
Basically because of the wide range of mobile devices (most of which have different browser capabilities, screen resolutions, dimensions, etc) you will never get a website to completely compatible with all mobile devices. There will always be problems with some devices.
A possible solution to this however, is to create different versions of the site for different types of phones (for example a version for iphones, a version for nokias, a version for blackberrys, ect), and use something like PHP & WURFL to detect the mobile browser type and load the appropriate version of the site.
I have used PHP & WURFL in the past to detect if a desktop or mobile browser is being used, and load the appropriate mobile or desktop site.
Exile
2010-09-14 11:06:19
+1 Wurfl is great.
Alex Ciminian
2010-09-14 11:07:20
+1
A:
There's the trick with alternative CSS files for desktop and mobile. Implemented in HTML header thusly:
<head>
<meta name="viewport" content="width=320" />
<link rel="stylesheet" href="mobile.css" type="text/css" media="only screen and (max-device-width: 480px)"/>
<link rel="stylesheet" href="desktop.css" type="text/css" media="screen and (min-device-width: 481px)"/>
<link rel="stylesheet" href="mobile.css" type="text/css" media="handheld"/>
<!--[if IE]>
<link rel="stylesheet" href="desktop.css" media="screen" type="text/css" />
<![endif]-->
</head>
Then if you need alternative content for mobile and desktop, feel free to make parts of HTML visible on desktop and hidden on mobile, or vice versa.
Tried on iPhone and Android. Note that simply specifying "media="handheld"" in the ref tag or in the CSS file does not do the trick; iPhone does not consider itself a handheld.
Seva Alekseyev
2010-09-27 15:56:44