[ispivey]

The advice on min-width vs min-device-width strikes me as controversial:

  Therefore, you should avoid using *-device-width, since the
  page won’t respond when the desktop browser window is
  resized.

GMail, Facebook, New York Times, and lots of other smart folks don't show their mobile-web versions if you make the browser viewport very small. Their sites have min-width ~980px when viewed on desktop.

I imagine this is because (a) their mobile sites use different interactions that require different DOM and JS, not just different CSS styles, and/or (b) those different interactions might not be appropriate on desktop even if you shrink the viewport and/or (c) it's confusing for the site to work differently when you resize your window and/or (d) they don't want to send unused JS/DOM to devices that aren't going to use it.

Any thoughts, kinlan?

[kinlan]

Good point. In lots of cases these sites are actually doing the detection of the device class on the server and never returning a fully responsive site in the first place. There is certainly a balance to be had on responsive vs adaptive, in this case with this piece of guidance it is to give developers and users the chance to adapt more appropriately to the screen constraints at any time. Min-device-width is pretty much permenant so it is harder to adapt to when the user is on a big screen but only usng half of it.

For most content based sites there is not a huge amount of reason to have drastically different html, CSS or js. For apps we are yet to cover that fully.

[petele]

Personally I wish they did. On my 13" MacBook, I want to be able to make those windows smaller and still be able to see the content without having to pan back and forth or zoom the content.

There's also some good technical reasons that PPK pointed out in the issue he raised (https://github.com/google/WebFundamentals/issues/20).