6 ms·
Viewport width can be obtained via CSS, e.g. by using a media query for every screen width: @media (min-width: 400px) { .thing { background-i
by storborg 11y ago
Viewport width can be obtained via CSS, e.g. by using a media query for every screen width:
@media (min-width: 400px) {
.thing {
background-image: url(size-400.png);
}
}
@media (min-width: 401px) {
.thing {
background-image: url(size-401.png);
}
}
You could combine this with pixel density for even more specificity.
- adrusi 11y agoThe tor browser bundle does have settings to disable media queries for this reason, but it is still conceivable to be identified by browser size unless you completely disable all embeded media (including images). Perhaps the browser delays loading images that aren't visible on the screen.
- mistercow 11y agoThis seems almost trivial for the browser to fix. Just load all CSS resources, regardless of media query matching.
- J_Darnley 11y agoWhat idiots thought this was a good idea? I swear, sometimes it seems like browser writers, standard writers, and website writers are actively colluding with advertisers and spies to make it easier to uniquely track everyone.
- schoen 11y agoThere's kind of a long-term issue about the web platform changing in ways that increase trackability, often without people thinking about it (or maybe in a few cases without people admitting that they thought about it). There is a W3C TAG document that touches on this at http://www.w3.org/2001/tag/doc/unsanctioned-tracking/ http://www.w3.org/2001/tag/doc/unsanctioned-tracking/ One problem is that there are so many ways of tracking user-agents in the web platform today that it can be hard to convince anyone that addressing one of them will improve the situation. :-(
- justJanne 11y agoWell, the idea was to do stuff like @media(max-size: 200px) { #container { background: url(tiny_mobile.png); } } @media(max-size: 400px) { #container { background: url(small_mobile.png); } } @media(max-size: 800px) { #container { background: url(medium_tablet.png); } } @media(max-size: 2000px) { #container { background: url(large_desktop.png); } } @media(min-size: 2000px) { #container { background: url(retina.png); } } Not always loading the same image is a good idea on mobile.
- J_Darnley 11y agoSee my reply elsewhere. Background images are bad meaning this isn't a very compelling argument.
- cbr 11y agoOften these aren't really background images, they're just using that to set image sources via CSS. These days you can do the same thing with srcset, which also allows someone to learn your screen resolution.
- pc86 11y agoIt's almost as if when your goal is to track someone you can use widely available, generally innocuous means to do so. People being smart is the horse, and programmers colluding with "advertisers and spies" in a massive fashion is the zebra.