Mobile users are increasing day by day especially developing countries like India, China, etc. And all the users from developed countries like USA, UK, etc are enhancing their mobiles with new technologies. With respect to this change, lots of companies have started a different web application for mobile users as well.

It is always recommended to have a single web application to ease the maintenance and development process. Now the question is - how can we develop a single web application for desktop users as well as mobile users? When I was researching on this, I've printed all the headers that I'm receiving to the server from various clients.

These headers are from a desktop PC
ACCEPT: text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5
ACCEPT-CHARSET: ISO-8859-1,*,utf-8
ACCEPT-ENCODING: gzip,deflate,bzip2,sdch
ACCEPT-LANGUAGE: en-US,en
CACHE-CONTROL: max-age=0
CONNECTION: Keep-Alive
COOKIE: JSESSIONID=c0a80111ce7e6058f18e10248cdb8d8c7d5feaa140b.e3uRa3aOaNmQe3uNaNaPbhyPb41ynknvrkLOlQzNp65In0
HOST: 203.197.128.203
USER-AGENT: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.19 (KHTML, like Gecko) Chrome/1.0.154.65 Safari/525.19
ORACLE-ECID: 1242045527:192.168.1.17:4372:0:15,0


Below headers are from my Sony Ericsson W810i (Check the USER-AGENT)
ACCEPT: multipart/mixed, application/vnd.wap.multipart.mixed, application/vnd.wap.xhtml+xml, application/xhtml+xml, text/vnd.wap.wml, */*
ACCEPT-CHARSET: utf-8, utf-16, iso-8859-1, iso-10646-ucs-2, Shift_JIS, Big5
ACCEPT-ENCODING: deflate, gzip
ACCEPT-LANGUAGE: en
CONNECTION: close
HOST: 203.197.128.203
PROXY-CONNECTION: close
USER-AGENT: SonyEricssonW810i/R4EA Browser/NetFront/3.3 Profile/MIDP-2.0 Configuration/CLDC-1.1
VIA: Jataayu CWS Gateway Version 4.2.0 at jataayuwap4
X-FORWARDED-FOR: 10.16.9.200
X-NETWORK-INFO: TCP, 10.16.9.200
X-WAP-PROFILE: "http://wap.sonyericsson.com/UAprof/W810iR301.xml"
ORACLE-ECID: 1242045600:192.168.1.17:4360:0:96,0


Below request headers are from Nokia N72 (Check the USER-AGENT)
ACCEPT: text/javascript, text/ecmascript, application/x-javascript, text/html, application/vnd.wap.xhtml+xml, application/xhtml+xml, text/css, multipart/mixed, text/vnd.wap.wml, application/vnd.wap.wmlc, application/vnd.wap.wmlscriptc, application/java-archive, application/java, application/x-java-archive, text/vnd.sun.j2me.app-descriptor, application/vnd.oma.drm.message, application/vnd.oma.drm.content, application/vnd.wap.mms-message, application/vnd.wap.sic, text/x-co-desc, application/vnd.oma.dd+xml, text/javascript, */*
ACCEPT-CHARSET: iso-8859-1, utf-8, iso-10646-ucs-2; q=0.6
ACCEPT-ENCODING: gzip, deflate, identity;q=0.9
ACCEPT-LANGUAGE: en
CONNECTION: close
HOST: 203.197.128.203
USER-AGENT: NokiaN72/2.0635.2.0.2 Series60/2.8 Profile/MIDP-2.0 Configuration/CLDC-1.1
VIA: Jataayu CWS Gateway Version 4.2.0 at jataayuwap4
X-FORWARDED-FOR: 10.16.3.220
X-NETWORK-INFO: TCP, 10.16.3.220
X-WAP-PROFILE: "http://nds1.nds.nokia.com/uaprof/NN72r100.xml"
ORACLE-ECID: 1242046187:192.168.1.17:4470:0:11,0


If you cleanly observe above request headers to check the difference between mobile client and desktop client - you can find some extra headers PROXY-CONNECTION, VIA, X-FORWARDED-FOR, X-NETWORK-INFO, X-NETWORK-INFO, X-WAP-PROFILE. Among these request headers - X-WAP-PROFILE is a mandatory for every mobile client to pass it on to the server whenever a request has been made.

Conclusion: Very simple but effective when you consider for the large scale applications, use the below condition on you Servlet or PHP or ASP or C# to check the request header to generate a different layout for mobile users. Here I'm going to explain this with Struts Action (Java technology).

if(request.getHeader("X-WAP-PROFILE"))
{
  //Code to invoke the business procedures to generate the mobile client
  return mapping.findForward("mobileHome"); //If you're using struts tiles, you can forward the mobile users to a different page
}
//Logic for normal users


Drop a comment if you face any issues with the above technique. Hope you guys have understood the simple logic and enjoy developing web applications. Enhancement makes you different from other websites.