3 ms·

In principle, using resolution-independent units like points should be fine; it's using px instead of pt that leads to problems. (And the site is using px; it

In principle, using resolution-independent units like points should be fine; it's using px instead of pt that leads to problems. (And the site is using px; it shouldn't.)

pteraspidomorph 7y ago
As a web developer in the past I found - though maybe that has changed in recent years, let me know if that is the case - there aren't any real resolution-independent units you can use to design an interface that is comfortable on every medium. You can peg your design to things like viewport width or font size, but you always end up having to make an arbitrary decision at some point, because there is no way for the web browser to know the physical dimensions of the screen the webpage is actually being displayed on. You have to make educated guesses based on the relationship between width and height, user agent and other headers, stuff like that, and create different stylesheets for each case. The style for the 1920x1080 screen (rotated horizontally) of the smallest smartphones can't have the same font size as the style of a 1920x1080 30 inch desktop monitor.
iamacyborg 7y ago
Hey man, I work in email dev, I'm at least a decade behind current web dev standards.
chrismorgan 7y ago
You are incorrect. All CSS units are defined in a resolution-dependent way. (I think there has only every been one exception to this, an experimental unit `mozmm`, now discontinued, that attempted to be resolution-independent, representing one physical millimetre.) On screen, the px unit is king, being defined however the device chooses to define it—most commonly one or two device pixels. All other units are defined in terms of it: 1in = 96px = 72pt, &c. On print, the ratios are the same, but physical length units actually have meaning now, corresponding to physical measurements—well, maybe they do; in practice browsers play fast and loose with it all, second-guessing the website’s stylesheets all over the place, which is normally a good thing for users because few websites take care for print stylesheets, but is utterly debilitating if you actually care and want precision. Now the question of what the root font-size is (a unit I like to call “browser em” or “bem”—I’ve never heard anyone else give it a proper name)—that’s a much more interesting question. It’s almost always 16px (I have no stats ready to hand, but I’d suggest >99% of page views), but there are devices out there that have other values, mostly between 13px and 19px, and you can change the value in some browsers also. However, website layouts commonly break if the value is not 16px, if the font sizes are based in bems and media queries in px, or font sizes in px and media queries in bems, and the developers have assumed 16px (which is completely normal). The ideal situation is to use either px everywhere or bem everywhere. In theory, using relative units everywhere is potentially nicer. In practice, you’re fine using pixel units everywhere. But 24px is still way too big.
- barrkel 7y ago
  I'm sure you're right - I am only ever a front end CSS dev in an emergency, and then only for desktop. That said, when I see a relative discrepancy between sizes on different media, px vs pt is where I'd look. That is, two things that might e.g. look the same size on a desktop browser but look different sizes on mobile.

In principle, using resolution-independent units like points should be fine; it's using px instead of pt that leads to problems. (And the site is using px; it shouldn't.)

pteraspidomorph 7y ago

As a web developer in the past I found - though maybe that has changed in recent years, let me know if that is the case - there aren't any real resolution-independent units you can use to design an interface that is comfortable on every medium. You can peg your design to things like viewport width or font size, but you always end up having to make an arbitrary decision at some point, because there is no way for the web browser to know the physical dimensions of the screen the webpage is actually being displayed on. You have to make educated guesses based on the relationship between width and height, user agent and other headers, stuff like that, and create different stylesheets for each case. The style for the 1920x1080 screen (rotated horizontally) of the smallest smartphones can't have the same font size as the style of a 1920x1080 30 inch desktop monitor.

iamacyborg 7y ago

Hey man, I work in email dev, I'm at least a decade behind current web dev standards.

chrismorgan 7y ago

You are incorrect. All CSS units are defined in a resolution-dependent way. (I think there has only every been one exception to this, an experimental unit `mozmm`, now discontinued, that attempted to be resolution-independent, representing one physical millimetre.) On screen, the px unit is king, being defined however the device chooses to define it—most commonly one or two device pixels. All other units are defined in terms of it: 1in = 96px = 72pt, &c. On print, the ratios are the same, but physical length units actually have meaning now, corresponding to physical measurements—well, maybe they do; in practice browsers play fast and loose with it all, second-guessing the website’s stylesheets all over the place, which is normally a good thing for users because few websites take care for print stylesheets, but is utterly debilitating if you actually care and want precision. Now the question of what the root font-size is (a unit I like to call “browser em” or “bem”—I’ve never heard anyone else give it a proper name)—that’s a much more interesting question. It’s almost always 16px (I have no stats ready to hand, but I’d suggest >99% of page views), but there are devices out there that have other values, mostly between 13px and 19px, and you can change the value in some browsers also. However, website layouts commonly break if the value is not 16px, if the font sizes are based in bems and media queries in px, or font sizes in px and media queries in bems, and the developers have assumed 16px (which is completely normal). The ideal situation is to use either px everywhere or bem everywhere. In theory, using relative units everywhere is potentially nicer. In practice, you’re fine using pixel units everywhere. But 24px is still way too big.

barrkel 7y ago
I'm sure you're right - I am only ever a front end CSS dev in an emergency, and then only for desktop. That said, when I see a relative discrepancy between sizes on different media, px vs pt is where I'd look. That is, two things that might e.g. look the same size on a desktop browser but look different sizes on mobile.