[eluser]boltsabre[/eluser]
>> 1) How can I go about detecting the devices/browsers through which the requests comes?
CI has built in user agent detection, but it's pretty basic. It's in a class, called... wait for it... User Agent.
But if you want something more robust just google it, it's heaps of options out there.
>> 2) How can be the html and css changed according to the user(mobile/ipad/pc)?
Well, that all depends on what you are trying to do...
Designing a responsive website means that the html does not change at all, but the css is altered by using media queries. However, this may not suit your needs... I find responsive (despite that fact everyone raves about it) design rather limiting... do your users use the mobile site exactly the same as the pc version? I doubt it... if you look at most large/successful websites, the vast majority don't use responsive design on the mobile site, they have a dedicated mobile. You'll have to decide for yourself what you want to do, again, research on google if you are wondering what I'm talking about, it's a massive area and you could have an entire forum (not just this thread) dedicated to mobile design.
As for the technical part, it would be something like this:
In your controller, hook, MY_Controller, helper, library, wherever, you do your user agent detection. Then if you wanted to load one view for mobile, a different for tablet, and another for pc, it would be something like this in your controller:
Code:
$user_agent = ....(user agent detection goes here...)
if ($user_agent == 'mobile'){
$this->load->view('someview_mob');
}elseif($user_agent == 'tablet'){
$this->load->view('someview_tab');
}else{
$this->load->view('someview');
}
But if you have 100 controllers, it gets tedious doing this in every controller, so you'd want to make a helper or something to keep your code DRY.
You can also use the above "if/elseif/else" statement directly inside your view files to load different things...
There are many different ways you can do all this. I suggest doing a little test site first, have a play around with it, find some of the pitfalls... get your hands dirty in a little test site and you'll save a lot of time later in your live site!!!
>> 3) Is there anything which i need to take care from server stand point?
Nothing that I can imagine... user agent detection is done inside your php scripts, I can't see anything that would affect servers... but I could be wrong ;-)
4) Does CI provide some library to handle these kind of application or any library which will be useful for this application?
Not off the top of my head... google around, there may be a custom library on git or something, make use of google, it's your best friend!!!
5) Do I have to use jQuery Mobile as well and can it be used with CI?
You don't have to use anything that you don't want to! I haven't used it ever, but I cannot see it being a problem with CI, just include/call/load from a CDN the jQuery mobile JS file and you're good to go... call the jquery mobile functions and they should work.
CI is server based PHP, JS is client based and shouldn't affect it in the slightest (but we all know what troubles people can have with ajax/jquery... so who knows)...
>> 6) As there are n number of devices in the world, which devices can be target....
Yeah, that's a bit of a loaded/silly question. You've already answered it with this comment "I understand that will depend on application and the user pool which will use it."
Without knowing anything about your app/your target market demographics, or anything else, what more can we say?
What I do recommend is getting onto... google!!! Have a look around, plenty of people publish their user browser details (ie, 35.4 iOS 4, 20.2% android 3.1, etc).
Also, if you are building a mobile site for an existing pc site, have a look at your analytics code (you have google analytics running right? If not, install it today so you can start to get this information). It will give you a good idea of the existing mobile traffic you already have.
Also talk to people in your industry/location/demographics, see what they have to say about their mobile traffic sources.
>> 7) Can anyone provide any links/tutorial/examples/sample codes which will help to start the work?
GOOGLE GOOGLE GOOGLE!!!
>> 8) Any other suggestions/comments/ideas which you might have are welcome.
Research a lot first, this is a complex subject.
Build a samll test site first, learn the tips/tricks. Build into this test site all the mobile functionality you think you'll want on your real site. For example, my above code about loading different views, you might have it in your test site in a helper, but then towards the end, because of something unexpected, need to completely change this set up. This can be very time consuming on your real site if you've 100's of controllers calling your helper, etc.
Iron out the bugs/design patterns in the test site, then develop the real site.
Oh yes... you'll have to do some user testing/research. Find out what they want on the mobile site. User Interface isn't about making things pretty, it's about solving a User Problem in the quickest AND easiest method. Learn your users and you'll reap the benefits!
Good luck.
