1

In most cases websites will look at the user agent header and then redirect or serve mobile content if accessed from mobile device.

However, there are some sites that will serve mobile content even if you change agent in your browser (request desktop site in Android, for example).

An example of such site would be www.t-mobile.com. There are also some others.

How do those sites detect mobile regardless of user-agent header?

I read that network packet TTLs may be different for mobile and actual desktop. Is it the case? But that would require pretty low level proxy to detect.

Kevin Panko
  • 7,346
  • 22
  • 44
  • 53
Alex Gitelman
  • 135
  • 6
  • 1
    Screen resolution and CSS media queries. – gronostaj Dec 27 '13 at 17:30
  • 1
    The browser reports the information to the website. –  Dec 27 '13 at 17:30
  • 1
    Most newer more future proof sites don't detect mobile... they have the proper css (using media-queries) in place to render well on mobile and desktop alike... – philwills Dec 27 '13 at 17:39
  • @philwills , can you provide more details and frame your comment as answer? – Alex Gitelman Dec 27 '13 at 17:43
  • Related: [How much information can websites get about your browser/PC?](http://superuser.com/questions/470348/how-much-information-can-websites-get-about-your-browser-pc) – Ƭᴇcʜιᴇ007 Dec 27 '13 at 17:44
  • Perhaps check out these as well: http://webmasters.stackexchange.com/questions/1941/mobile-phone-detection-brand-model-browser-etc and http://webmasters.stackexchange.com/questions/12196/how-do-sites-manage-browser-and-mobile-versions – Ƭᴇcʜιᴇ007 Dec 27 '13 at 17:50

1 Answers1

1

As stated in my comment, the newer more future proof sites don't detect mobile devices using user agent sniffing or any other means... They include css media queries to make the page render properly on mobile and desktop.

Some example css might look like this:

/* mobile first */
.page,
.sidebar {
    width: 100%;
    padding: 10px;
}

img {
    max-width: 100%
}

@media screen and (min-width:960px){
    .page {
        width: 960px;
        padding: 3px;
    }

    .sidebar {
        float: left;
        width: 30%;
    }
}
philwills
  • 151
  • 3