Responsive web design with mobile detection interspersed for greater control

Question

I have just finished building my first website with a mobile-first responsive design process in mind. The site looks and works great on mobile devices, but the desktop experience is quite lacking. There's no good way I can improve the desktop experience without compromising the mobile experience, and even then there are just some things I can't do using a pure client side approach.

I don't want to have to manage two separate websites (mobile, desktop). What I want to do is have mobile detection server side to have more control of when I load/display more data, etc.

I want to do something akin to:

// in view
...
if not request.mobile: 
    related_posts = post.get_related_posts()
...

// in template
...
{% if not request.mobile and related_posts %} 
    {{ related_post_stream(related_posts) }} 
{% endif %}
...

Surprisingly, I don't see much online discussion about doing things this way. Most articles I've read either recommend pure (mobile-first) responsive design or a separate mobile website, although this seems like a decent idea. Is there a downside to doing this?

Answer 1

If you are using Django, there is django-mobile module which allows you to check the mobile usage in the template like this:

{% if flavour != "mobile" %}Desktop version{% endif %}

If you are not using Django, you can still analyze the source of that module and implement something similar for your website.