Mobile device browsers have different, more limited capabilities
Limitations with mobile browsers
The capabilities of mobile device browsers grow by the minute, but they are different to those of browsers that work on computers and as of now, we have to assume the following:
- The most obvious difference is that mobile device screens are smaller.
- Mobile browsers use a different HTML type.
- Some can understand style sheets, but to a limited extent
- Javascript and Flash might be supported, but possibly not
- Downloads can be expensive and download speeds might be limited, so large images are out
- Some mobile browsers fail completely when they encounter something they don't understand
Solutions
There are several possible solutions:
- Do nothing
- Use browser detection to determine which style sheet to use and use the same site for main and mobile sites with the different style sheets
- Use browser detection to redirect to completely different content
Do nothing
This is not an option. Many mobile devices will display a full website very poorly, and some not at all.
It your clients want to get last minute directions when travelling to you - they will not be able to use your site from a mobile device.
Use browser detection for style sheet selection - @media handheld
This would probably be the best solution if all mobile phone browsers supported cascading style sheets (CSS), and more specifically the '@media handheld' type.
You would have just one website to keep current and different CSS style sheets would determine what content, images, videos etc would be required to show the site's pages.
At the moment there is not universal support for '@media handheld', so we don't use it.
Use browser detection to redirect
The server detects the 'user agent' - ie. the browser requesting the data. If the user agent is a mobile browser, then the browser is 'redirected' to different content. The latter could just be pages on the same site, or could be a sub-directory of the same domain name (such as using the 'm' prefix: m.www.myxyzwebsite.com), or using .mobi domains (www.mywebsite.mobi).
There are two standard ways of detecting browser type.
- Ues client side detection with Javascript
- Use server side detection with PHP, C# or Java etc
Browser detection and redirection - client side Javascript
Unfortunately not all mobile browsers support Javascript - but some do. No doubt this will change with time, but it is not comprehensive at the moment.
Browser detection and redirection - server side code
This is the method we currently favour. Over the next few years, mobile browser capabilities will grow dramatically, but until then, it is better to provide a minimum of useful information that all mobile users can access. Use of PHP, C# etc just depends on the architecture of the site.
Browser detection and redirection - m. or .mobi
If you use server side redirection, there is also the choice of which pages to redirect from and where to redirect to.
Currently we only redirect from the home page (all home pages for multilanguage sites) to prevent redirecting every page on the site when the main site is required.
As for destinations, you could just redirect to pages in the same directory structure (www.myxyzwebsite.com/mobilepages/). It is unlikely that users would guess to type this into their mobile browser however to avoid redirection so there are two better choices: use m. or .mobi
m.myxyzwebsite.com is a subdomain of your main domain name. It keeps traffic on your domain and many users will automatically try this option from mobile devices. It is simple to set up and costs nothing.
myxyzwebsite.mobi is a separate domain name that you would have to purchase and host. Many users might automatically try this option from mobile devices, but the m. solution is simpler, cheaper, and seems to be adopted by many large sites.