Does using frameworks like AngularJS/Backbone JS/Bootstrap/Foundation etc. automatically make the web application mobile device compatible?

Is there a framework/design approach to make applications (new or existing) mobile compatible?

To put it simply; is there a framework/guideline/library which I can use in my JEE web application UI layer making it automatically compatible both on computer browsers and mobile devices (iOS phone, iPad, Android phones and the whole array of it).

  • 1
    How are you defining 'compatible'? Any website will 'work' on mobile devices. – GrandmasterB Dec 4 '13 at 18:00
  • @GrandmasterB in my view compatible meaning my web site should not loose it's functionality when I switch to a mobile device. Having similar (if not exact) behavior across several browsers and mobile devices. An web app using iFrames in it's UI may not work on an android phone. Just thinking. – Ayusman Dec 4 '13 at 22:57

"Compatible" might mean many different things. In general mobile devices run fairly modern browsers which can easily render HTML5 content and JavaScript driven web apps. You have named a number of different frameworks with different responsibilities. All of them support building mobile-friendly sites but none of them can free you from needing to think about your site's mobile experience.

If your site does not rely on Flash, Silverlight, or other plugins you probably have a working mobile site however there are additional design and implementation concerns you should probably consider.

Most mobile devices do not provide a mouse pointer so sites which depend on mouse-over or hover interactions can be unusable.

Does your site work well on high latency, low bandwidth network connections? Are you serving large images to mobile devices? Can your web servers handle a large number of long-lived slow requests?

Does your site server reasonable markup to enable user interactions? For example HTML5 input elements with input types will allow mobile devices to present an appropriate keyboard (email, numeric) or other interface (date pickers and so on).

Finally does your site's design work on small screens and viewports? The phrase you're probably looking for here is "responsive design". Both Bootstrap and Foundation provide support for flexible grids which can scale as percentages of the available viewport or be adjusted using media queries to jump between several specific layouts depending on the rendering device's viewport size.

  • thanks. This is useful. Good points and I do see where you are coming from. Thanks again. – Ayusman Dec 4 '13 at 22:54

Not the answer you're looking for? Browse other questions tagged or ask your own question.