I have a website developed in ASP.NET MVC.

Now, I am looking forward to getting up a mobile interface for it. My knowledge in this regard isn't that great, so I will explain what is needed to be done. It's much like on the lines of StackOverflow or Programmers and following are the few points that need to be addressed.

  1. Much like Stack Overflow, if a site is visited from mobile, auto-detection should happen and the mobile version should be displayed.
  2. Do I need to setup some sub-domain like m.mysite.com and should I have the mobile site installed for this domain (SE sites don't do this now but Facebook does that)
  3. Lastly, How to design the website that is easily readable on all sized of screens for mobile.

3 Answers 3


Re: 1 - Shouldn't (necessarily) be your responsibility to detect mobile devices, as long as yu use the @media type correctly in your stylesheet.

Re: 2 - That would depend on whether the difference between what you want to serve mobile devices as opposed to "normal" viewers is large. If your main site is heavy on JavaScript and you want to serve your mobile users a much simpler view, use a separate subdomain. If it's pretty much the same content, you just want the presentation to be different, you don't need a subdomain, just a different stylesheet (or parts thereof).

Re: 3 - Follow best practices, use em font sizes rather than px, etc... beyond that would take quite a while to answer this part ;-)


For 1., see here: http://detectmobilebrowsers.com/

For 2., That's up to you, technically it doesn't make much of a difference.

For 3., Javascript frameworks like jQTouch or Sencha Touch might help. Beyond that, design questions are probably off-topic here.

  • jQTouch and Sencha Touch should only be used if your interface relies heavily on touch. Remember mobile internet makes external javascript files really expensive to download. Minimize your external resources as much as possible for mobile.
    – Raynos
    Jan 23, 2012 at 10:00
  • Also please don't use server-side UA sniffing to detect mobile or desktop.
    – Raynos
    Jan 23, 2012 at 10:02
  • @Raynos, while searching over the better solution for various interface requirements, I came across this SLIDE .. Let me know your views on this Jan 23, 2012 at 10:34
  • @PankajUpadhyay that's a very good slide show.
    – Raynos
    Jan 23, 2012 at 10:51

If you are using MVC 3, there is very little code to write to detect a mobile client and subsequently display the mobile view. The two small additions you'll have to make are:

  1. Override the RazorViewEngine.FindView, and check the Request.UserAgent to determine what browser is sending the request.
  2. Create a "Mobile" folder under the Views folder for a particular area, and create your mobile-styled views there.
  3. Complete the work to tell "FindView" where to get the mobile views

This separates your regular browser views from your mobile views, and eliminates the need to change your controller code.

To get started with this, you could start rolling your own (perfectly fine - you learn a lot that way), or you could leverage what others have started. I personally used a template on NuGet called "Mobile Ready HTML5", which is an MVC project that includes the pieces I described above, including HTML 5 support. Check it out, it helped me a ton:


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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