Responsive Design for 1 ASP.NET Webpage - Detect Screen Width

Question

I have an ASP.NET Web Forms Website that has css code to detect whether or not the screen width is less than 420 pixels. The client now wants this version (under 420 pixels) to function very differently than the full screen site, so I figured I could redirect to a mobile version of the website by detecting on the server side how wide the browser is. I am using 51Degrees to check Request.Browser.ScreenPixelsWidth, but that always returns the same value, even on my phone. Is there a better way to detect this information so that I can load a mobile version of my webpage?

Answer 1

If you want to get device-width, user-agent is not very helpful, because ultimately you need screen resolution and that will be the sole criteria to manage UI. So when more devices will come into market, you need to store their useragent and their dimension, this way, i am saying it is not helpful. And what if user has mobile or tablet, and changes orientation, means dimension just got changed for same user-agent.

So best way would be to go with css media queries to start with. There are lot of CSS to help you out for responsive design , such as bootstrap.

Answer 2

You're mixing two different technologies. For responsive design, you never need to use browser agent sniffing. Use a RWD CSS framework like Bootstrap. With RWD you serve the same content and functionality to ALL devices.

This really sounds like an argument to develop a separate mobile app if there's some part of it that need different functionality. Outside of that, the client is an idiot and it is frequently our job to educate the client ;-)