I am creating a website from scratch which would work for both desktop and iPad. There are going to be some UI components like sliding panels like you can see on
http://www.moneycontrol.com/tablet/
Plus some other things like Accordion, Drag drop things, etc
I need to have the same html file to be called for all devices (can only have separation at css or js)
Now we can implement these in multiple ways. In some cases, it is possible to have the same component work in both desktop and iPad without modification (e.g. Through jquery ui)
But guess there are some downsides like performance issue. Not sure if this is the only thing. Please suggest if you know of any other thing, may be from development side as well.
Another approach is to have different ui component to work on desktop vs iPad. E.g. For the site http://www.moneycontrol.com/tablet/, it uses DMZone sliding panels which would only work on iPad and not on common desktop browsers..so in this case, we would use another component which would work for desktop. Is this a good approach?
Thus My question is like which approach should i go for, both from a user perspective, future development efforts for some other mobile device ?
I need some strong points which would really justify the right approach.
Please suggest as much as you can. I am quite open to all ideas..
What you are looking for is a mobile app framework that supports desktop clients. There are tons of those available both free and commercial.
One of those which is quite popular is http://www.appcelerator.com/
Although i haven’t used it and i can’t tell you if you will hit a dead end on the road (with the sliders for instance), this is the best approach that you can do.
And, you are more than covered for future mobile devices.
You can do your own research of other frameworks, but appcelerator seems fine.
EDIT:
Seems like there is controversy whether its best to create native app vs browser based app on mobile devices. There are some interesting posts:
http://www.readwriteweb.com/archives/mobile_app_or_browser-based_site.php
http://blog.caplin.com/2011/02/11/sdps-native-or-browser-based-mobile-apps/
The only sane way to export your app to multiple devices is to use a framework. The other way is to make hundreds of conditionals depending on the device that is visiting your site…
If you want pure HTML interaction in the mobile device, then you can use jQuery Mobile. But you will have to make some sort of hacking to render the page correctly on desktops.