What do I need to know for my site to work on mobile devices these days?

This question is based on What do I need to know for my site to work in mobile browsers? which was published in 2009 with some old Microsoft websites and specific materials

I do web applications mostly in Django, and it doesn't seem to work very well on Android / Iphone / other mobile devices.

There are applications such as django-mobile ( https://github.com/gregmuellegger/django-mobile ), which offers you the ability to create different sites depending on the taste of the device. The problem is that we almost need to make 3 websites if we want to use them on Android, Iphone and PC.

There are some W3C recommendations ( http://www.w3.org/TR/2006/CR-mobile-bp-20060627/ ) since 2006, I think it’s out of date, because after 6 years the Internet and devices are completely different.

Any contributions related to this?

+4
source share
1 answer

As far as I know (correct me if I'm wrong) Django is a Python framework, so it works on the server side. This should not affect the operation of the phone. All smartphones will be able to run HTML / CSS and JavaScript / jQuery.

If you are talking about how a page is displayed on such a small screen, there are several options:

  • Have a responsive design that adapts to the screen size of the device. Take a look at Bootstrap .
  • You have a separate mobile site and something that detects a mobile / tablet device and sends it to a mobile site working in a sub-area, for example mobile.mysite.com .
  • Have an inappropriate site and use the viewport meta tag.
  • Another option is to use css media queries, which allow you to set conditional css depending on the screen or browser size:

     @media only screen and (min-width : 325px) and (max-width : 500px) { /*CONDITION CSS*/ } 

The best part about media queries is that you can get really detailed theoretical information that you can have media queries for 100 devices that define specific css for landscape and portrait mode devices.

Here's a pretty interesting article about the Romney and Obamas campaign and how each side chose to develop their mobile sites in different ways.

+4
source

All Articles