Accept that your site will only render correctly on devices with square pixels, and that {old TVs, mis-calibrated CRTs, fun-house mirrors} will not render your document correctly.
But pixels are not perfectly square, and not visible on >300 ppi devices? I think we should accept that you can't rely on pixels anymore, and it's a good thing, which will let us move on to better display technologies and better, vector, graphics. When you do that, and if you want, make vector squares, you can let the rendering layer 'snap to grid' for rendering your pseudo-pixels.
Vectors have to be rasterized at some point, which requires detailed knowledge of device pixels.
Furthermore, some graphics are always going to be bitmaps, such as photos. Tasks like "center this image square, but don't make it blurry" requires pixel-perfect positioning.
That's exactly my point. Only the mobile OS knows the detailed knowledge of device pixels, not a web developer. Raster graphics can utilize GPU accelerated filtering. Sharp graphics should be vector with blocky or any other kind of 'hinting' that you might want.
Given two displays with identical dimensions, where one has twice the DPI of the other, then a square specified to be "width: 400px" should be physically half the size on the higher-DPI screen.
Designers who want to render at a particular size (e.g. for buttons that a user will push) should specify sizes in physical dimensions, such as inches or cm.
What about the fact that we have dpi's going from 250 to 450, everywhere in between? We have color temperature problems, we have totally different screen aspects sizes. Between all the things we can't control, why is it still a good idea to render with pixel accuracy?
