today I decided to share my experience of creating website version for mobile devices such as mobile phones.
As you probably understand mobile devices are quite limited in screen size and keyboard, so you as creator have to do things to help your visitors on the go.
There is two main languages designed for mobile phones:
1. Wireless Markup Language which stands as WML and is older (and simpler) format
2. XHTML MP is more modern and more similar to "normal" xHTML just restricted for mobile devices. MP stands for Mobile Profile so this is HTML for mobile phones.
Both of them uses standard HTTP protocol and server such as Apache. WML was designed in times then mobile data transfare was very unreliable and slow, so for that reason WML content was send through getaway device which is between phone and server and this protocol is called WAP (wireless application protocol).
Nowadays new phones support both protocols. So if you need to deliver your content (whatever poor it will look) to most devices (old and new) use WML. Anyway if you are not crazy about supporting old phones or you just want to use color images use XHTML MP.
For learning WML language I suggest visiting w3schools WML formatting lesson for learning more about XHTML MP usage visit this referance
More about cross platform (cross phone) support
There is one way to make your mobile website more pleasant for more visitors and it is auto filtering by their phone or device compatibilities. This mean if visitor come with old old phone which support only WML he sees WML version of your site, but if your visitor isn't that conservative and has upgraded his phone in at least last 3 years he's redirected to better looking XHTML MP version of your website.
You can do this filtering by reading HTTP_ACCEPT headers sent by browser (yes mobiles use browsers too). This HTTP_ACCEPT header contains information about MIME types of information which browser support. Then you know that you can redirect them by this type. If you run php on your server you can do filtering like this:
$container = $_SERVER['HTTP_ACCEPT']; //reading HTTP_ACCEPT header
$wml = "text/vnd.wap.wml"; //this is how WML Mime type looks like
$xhtml = "application/xhtml+xml"; //this is how normal xhtml header looks
$wapxml = "application/vnd.wap.xhtml+xml"; //added for support of some strange phones
if(strstr($container,$wml) && strstr($container,$xhtml)) {
//browser (phone) supports XHTML & WAP let them pass
}elseif(strstr($container,$wml) && strstr($container,$wapxml)){
//browser (phone) supports XHTML & WAP let them pass (support stupid phones)
}elseif (strstr($container,$wml)) { //if supports WAP only redirect to WML version
header("Location: http://wml.example.com");
exit();
}else { //all other browsers to normal version
header("Location: http://www.example.com");
exit();
}
This code should be at the very beginning of index.php of your website version dedicated to mobile devices. It will let mobile phones which support XHTML pass in and will redirect old phones to WML version as normal browsers to normal version of your website. More about redirecting and technical stuff about WAP protocol
No comments:
Post a Comment